import classNames from "@calcom/lib/classNames"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; import { List } from "@calcom/ui"; import { ArrowRight } from "@calcom/ui/components/icon"; import { AppConnectionItem } from "../components/AppConnectionItem"; import { StepConnectionLoader } from "../components/StepConnectionLoader"; interface ConnectedAppStepProps { nextStep: () => void; } const ConnectedVideoStep = (props: ConnectedAppStepProps) => { const { nextStep } = props; const { data: queryConnectedVideoApps, isLoading } = trpc.viewer.integrations.useQuery({ variant: "conferencing", onlyInstalled: false, sortByMostPopular: true, }); const { t } = useLocale(); const hasAnyInstalledVideoApps = queryConnectedVideoApps?.items.some( (item) => item.userCredentialIds.length > 0 ); return ( <> {!isLoading && ( {queryConnectedVideoApps?.items && queryConnectedVideoApps?.items.map((item) => { if (item.slug === "daily-video") return null; // we dont want to show daily here as it is installed by default return (
  • {item.name && item.logo && ( 0} /> )}
  • ); })}
    )} {isLoading && } ); }; export { ConnectedVideoStep };