EdgeFunctionsDiffPanel() — supabase Function Reference

Source Code

apps/studio/components/interfaces/BranchManagement/EdgeFunctionsDiffPanel.tsx lines 167–241

export const EdgeFunctionsDiffPanel = ({
  diffResults,
  currentBranchRef,
}: EdgeFunctionsDiffPanelProps) => {
  if (diffResults.isLoading) {
    return <Skeleton className="h-64" />
  }

  const noChanges = diffResults.addedSlugs.length === 0 && diffResults.modifiedSlugs.length === 0

  if (noChanges) {
    return (
      <div className="p-6 text-center">
        <Wind size={32} strokeWidth={1.5} className="text-foreground-muted mx-auto mb-8" />
        <h3 className="mb-1">No changes detected between branches</h3>
        <p className="text-sm text-foreground-light">
          Any changes to your edge functions will be shown here for review
        </p>
      </div>
    )
  }

  return (
    <div className="space-y-6">
      {diffResults.addedSlugs.length > 0 && (
        <div>
          <div className="space-y-4">
            {diffResults.addedSlugs.map((slug) => (
              <FunctionDiff
                key={slug}
                functionSlug={slug}
                currentBody={diffResults.addedBodiesMap[slug]!}
                mainBody={EMPTY_FUNCTION_BODY}
                currentBranchRef={currentBranchRef}
                fileInfos={diffResults.functionFileInfo[slug] || EMPTY_ARR}
              />
            ))}
          </div>
        </div>
      )}
      {/* TODO: Removing functions is not supported yet */}
      {/* {diffResults.removedSlugs.length > 0 && (
        <div>
          <div className="space-y-4">
            {diffResults.removedSlugs.map((slug) => (
              <FunctionDiff
                key={slug}
                functionSlug={slug}
                currentBody={EMPTY_ARR}
                mainBody={diffResults.removedBodiesMap[slug]!}
                currentBranchRef={mainBranchRef}
                fileInfos={diffResults.functionFileInfo[slug] || EMPTY_ARR}
              />
            ))}
          </div>
        </div>
      )} */}

      {diffResults.modifiedSlugs.length > 0 && (
        <div className="space-y-4">
          {diffResults.modifiedSlugs.map((slug) => (
            <FunctionDiff
              key={slug}
              functionSlug={slug}
              currentBody={diffResults.currentBodiesMap[slug]!}
              mainBody={diffResults.mainBodiesMap[slug]!}
              currentBranchRef={currentBranchRef}
              fileInfos={diffResults.functionFileInfo[slug] || EMPTY_ARR}
            />
          ))}
        </div>
      )}
    </div>
  )
}