IntegrationConnectionOption() — supabase Function Reference

Source Code

apps/studio/components/interfaces/Integrations/VercelGithub/IntegrationPanels.tsx lines 237–266

  ({ connection, type, ...props }, ref) => {
    const { data: project } = useProjectDetailQuery({ ref: connection.supabase_project_ref })

    return (
      <li
        ref={ref}
        key={connection.id}
        {...props}
        className={cn(
          'bg-surface-100 border shadow-sm flex justify-between items-center px-8 py-4 rounded-lg'
        )}
      >
        <div className="flex flex-col gap-1">
          <div className="flex gap-2 items-center">
            <HandleIcon type={'Supabase'} />
            <span className="text-sm">{project?.name}</span>
            <ArrowRight size={14} className="text-foreground-lighter" strokeWidth={1.5} />
            <HandleIcon type={type} />
            <span className="text-sm">{connection.metadata.name}</span>
          </div>

          <span className="text-foreground-lighter text-xs">
            Connected {dayjs(connection.inserted_at).fromNow()}
          </span>
        </div>

        <Button type="default">Connect</Button>
      </li>
    )
  }