slice-machine-ui 1.23.2-alpha.bmo-add-github-settings-page.4 → 1.23.2-alpha.dev-env-default-active.2

package/out/_next/static/css/ca32882a5d2d8d88.css

@@ -1 +0,0 @@
-.FieldSet_flex__qy2tm{all:unset;display:flex}.FieldSet_column__NS4qQ{flex-direction:column}.FieldSet_root__XVbMv{border-color:var(--grey6);border-radius:6px;border-style:solid;border-width:1px;box-shadow:var(--box-shadow-1);overflow-x:hidden}.FieldSet_row__END9k{align-items:center;flex-direction:row;gap:8px;padding-inline:16px}.FieldSet_borderBottom__L01vK{box-sizing:border-box}.FieldSet_borderBottom__L01vK:not(:last-child){border-bottom:1px solid var(--grey6)}.FieldSet_legend__JjRCM{background-color:var(--grey2);height:48px;order:0}.FieldSet_header__0Q7YD{background-color:var(--grey2);height:72px;order:1}.FieldSet_content__PDj3t{background-color:var(--grey1);order:2;padding:16px}.FieldSet_list__HoMpl{max-height:256px;order:2;overflow-y:auto}.FieldSet_listItem__P0SKW{background-color:var(--grey1);flex-shrink:0;height:64px}.FieldSet_listItemText__J0_Fr{flex-grow:1}.FieldSet_borderTop__qyC9U:not(:first-child){box-shadow:0 -1px 0 0 var(--grey6)}.FieldSet_footer__thBWh{background-color:var(--grey1);height:48px;order:3;padding-right:8px}.FieldSet_footerText__mKIv2{flex-grow:1}

package/out/_next/static/eFhKCr9d2Q8SjtAKgFjlm/_buildManifest.js

@@ -1 +0,0 @@
-self.__BUILD_MANIFEST=function(s,c,a,e,t,i,f,b,n,u,d,h,l,k,j,p,g,o,r){return{__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":[a,j,p,"static/chunks/pages/index-64cfb8b0948ba8ef.js"],"/_error":["static/chunks/pages/_error-69b4f498bafdd188.js"],"/changelog":[s,e,"static/chunks/870-0c7a8a9622de78b7.js","static/chunks/pages/changelog-02cd80dad6f40878.js"],"/changes":[s,t,"static/chunks/8eec4907-b712959d9f984b68.js",i,"static/chunks/918-5bb55fb464e34768.js",c,b,"static/css/838fd8bb5a7c32b0.css","static/chunks/pages/changes-8de69920dfb5a48f.js"],"/custom-types":[a,j,p,"static/chunks/pages/custom-types-94b8f8dbf7727412.js"],"/custom-types/[customTypeId]":[s,n,u,d,h,e,f,i,l,g,c,a,k,o,r,"static/chunks/pages/custom-types/[customTypeId]-3f862ad6111a1fc0.js"],"/labs":["static/chunks/pages/labs-39b50541a4c370bf.js"],"/page-types/[pageTypeId]":[s,n,u,d,h,e,f,i,l,g,c,a,k,o,r,"static/chunks/pages/page-types/[pageTypeId]-d1ffca11c42f2603.js"],"/settings":["static/css/ca32882a5d2d8d88.css","static/chunks/pages/settings-41fc2a11b6be2683.js"],"/slices":[s,t,f,c,b,"static/css/f8eb526e10bc2441.css","static/chunks/pages/slices-81e382c3374273df.js"],"/slices/[lib]/[sliceName]/[variation]":[s,t,n,u,d,h,e,f,i,l,c,k,b,"static/css/b22c0750c14cc089.css","static/chunks/pages/slices/[lib]/[sliceName]/[variation]-62b55bae7f1b3793.js"],"/slices/[lib]/[sliceName]/[variation]/simulator":[t,"static/chunks/72585f70-28b4d7d5384b3703.js","static/chunks/18539003-5f78714a35fde4a1.js","static/chunks/777-8c5507e3b119b5dc.js","static/chunks/pages/slices/[lib]/[sliceName]/[variation]/simulator-b12346e58ac9abea.js"],sortedPages:["/","/_app","/_error","/changelog","/changes","/custom-types","/custom-types/[customTypeId]","/labs","/page-types/[pageTypeId]","/settings","/slices","/slices/[lib]/[sliceName]/[variation]","/slices/[lib]/[sliceName]/[variation]/simulator"]}}("static/chunks/59b4e022-7a3b5554b806349f.js","static/chunks/25-37d6fa7f064be04b.js","static/chunks/731-a9b66ccdc3fae2c2.js","static/chunks/183-4feb6bb3eddbc768.js","static/chunks/c8eae200-966ce352f7b5d2b9.js","static/chunks/543-f8766685f7f451e2.js","static/chunks/50-cfc2514205b86001.js","static/chunks/286-ed90373e9a469944.js","static/chunks/f36c6662-03bb5e9d9aa0b0aa.js","static/chunks/4c744e84-e3161d754618373f.js","static/chunks/065a3ddb-9a38ca0d60f0bf2f.js","static/chunks/1cc2734a-2c5b6c0367fcde86.js","static/chunks/696-b12edad30a3617e5.js","static/chunks/318-bd030cc1725e23b5.js","static/chunks/727-2235967a881f9035.js","static/css/be1f49e49a5aa7eb.css","static/chunks/474-5a072e6fac61f703.js","static/chunks/904-6d6937d53ea2761e.js","static/css/72465cc1225f28a2.css"),self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB();

package/out/settings.html

@@ -1 +0,0 @@
-<!DOCTYPE html><html><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><meta name="next-head-count" content="2"/><link rel="preload" href="/_next/static/css/3c26dbbbd8f4be12.css" as="style"/><link rel="stylesheet" href="/_next/static/css/3c26dbbbd8f4be12.css" data-n-g=""/><link rel="preload" href="/_next/static/css/ca32882a5d2d8d88.css" as="style"/><link rel="stylesheet" href="/_next/static/css/ca32882a5d2d8d88.css" data-n-p=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="/_next/static/chunks/webpack-2f903acb0cccbf9e.js" defer=""></script><script src="/_next/static/chunks/framework-cdccea7a52cc6e81.js" defer=""></script><script src="/_next/static/chunks/main-5e6780279ca21cb9.js" defer=""></script><script src="/_next/static/chunks/pages/_app-027b9e90438a0d83.js" defer=""></script><script src="/_next/static/chunks/pages/settings-41fc2a11b6be2683.js" defer=""></script><script src="/_next/static/eFhKCr9d2Q8SjtAKgFjlm/_buildManifest.js" defer=""></script><script src="/_next/static/eFhKCr9d2Q8SjtAKgFjlm/_ssgManifest.js" defer=""></script></head><body><div id="__next"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{}},"page":"/settings","query":{},"buildId":"eFhKCr9d2Q8SjtAKgFjlm","runtimeConfig":{"sentryEnvironment":"alpha"},"nextExport":true,"autoExport":true,"isFallback":false,"scriptLoader":[]}</script></body></html>

package/pages/settings.tsx

@@ -1 +0,0 @@
-export { SettingsPage as default } from "@src/features/settings/SettingsPage";

package/postcss.config.js

@@ -1,10 +0,0 @@
-module.exports = {
-  plugins: {
-    "postcss-flexbugs-fixes": true,
-    "postcss-preset-env": {
-      autoprefixer: { flexbox: "no-2009" },
-      features: { "custom-properties": false, "nesting-rules": true },
-      stage: 3,
-    },
-  },
-};

package/src/components/RelativeTime/RelativeTime.stories.tsx

@@ -1,25 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-
-import { RelativeTime } from "./RelativeTime";
-
-type Story = StoryObj<typeof meta>;
-
-const meta = {
-  component: RelativeTime,
-  argTypes: {
-    date: { control: "date" },
-  },
-} satisfies Meta<typeof RelativeTime>;
-
-export default meta;
-
-export const Default = {
-  args: {
-    date: new Date("1 Jan 2024"),
-  },
-  render: ({ date, ...otherArgs }) => (
-    // The `date` control converts the `date` arg into a UNIX timestamp. That's
-    // why we need to convert it back into a `Date` object.
-    <RelativeTime {...otherArgs} date={new Date(date)} />
-  ),
-} satisfies Story;

package/src/components/RelativeTime/RelativeTime.tsx

@@ -1,40 +0,0 @@
-import { Text } from "@prismicio/editor-ui";
-import type { FC } from "react";
-
-type RelativeTimeProps = {
-  date: Date;
-};
-
-export const RelativeTime: FC<RelativeTimeProps> = ({
-  date,
-  ...otherProps
-}) => (
-  <Text {...otherProps} color="inherit" variant="inherit">
-    {formatRelativeTime(date)}
-  </Text>
-);
-
-const rtf = new Intl.RelativeTimeFormat("en", {
-  numeric: "auto",
-  style: "narrow",
-});
-
-function formatRelativeTime(date: Date, now = new Date()): string {
-  return rtf.format(differenceInCalendarDays(date, now), "day");
-}
-
-const millisecondsInDay = 1_000 * 60 * 60 * 24;
-
-// Adapted from: https://github.com/date-fns/date-fns/blob/6f44a167e71053999c10aa9462d7f0c52fec0faa/src/differenceInCalendarDays/index.ts.
-function differenceInCalendarDays(dateLeft: Date, dateRight: Date): number {
-  const startOfDayLeft = startOfDay(dateLeft);
-  const startOfDayRight = startOfDay(dateRight);
-  return Math.round((+startOfDayLeft - +startOfDayRight) / millisecondsInDay);
-}
-
-// Adapted from: https://github.com/date-fns/date-fns/blob/6f44a167e71053999c10aa9462d7f0c52fec0faa/src/startOfDay/index.ts.
-function startOfDay(date: Date): Date {
-  const newDate = new Date(date);
-  newDate.setHours(0, 0, 0, 0);
-  return newDate;
-}

package/src/components/RelativeTime/index.ts

@@ -1 +0,0 @@
-export { RelativeTime } from "./RelativeTime";

package/src/features/settings/SettingsPage.tsx

@@ -1,29 +0,0 @@
-import { Box } from "@prismicio/editor-ui";
-import Head from "next/head";
-import type { FC } from "react";
-
-import {
-  AppLayout,
-  AppLayoutBreadcrumb,
-  AppLayoutContent,
-  AppLayoutHeader,
-} from "@components/AppLayout";
-import { ConnectGitRepository } from "@src/features/settings/git/ConnectGitRepository";
-
-export const SettingsPage: FC = () => (
-  <>
-    <Head>
-      <title>Settings - Slice Machine</title>
-    </Head>
-    <AppLayout>
-      <AppLayoutHeader>
-        <AppLayoutBreadcrumb folder="Settings" />
-      </AppLayoutHeader>
-      <AppLayoutContent>
-        <Box flexDirection="column" maxWidth={600}>
-          <ConnectGitRepository />
-        </Box>
-      </AppLayoutContent>
-    </AppLayout>
-  </>
-);

package/src/features/settings/git/ConnectGitRepository.tsx

@@ -1,116 +0,0 @@
-import {
-  Button,
-  ErrorBoundary,
-  IconButton,
-  Tooltip,
-} from "@prismicio/editor-ui";
-import {
-  isUnauthenticatedError,
-  isUnauthorizedError,
-} from "@slicemachine/manager/client";
-import { type FC, type ReactNode, Suspense } from "react";
-
-import {
-  FieldSet,
-  FieldSetContent,
-  FieldSetFooter,
-  FieldSetLegend,
-} from "@src/components/FieldSet";
-import { ConnectGitRepositoryBlankSlate } from "@src/features/settings/git/ConnectGitRepositoryBlankSlate";
-import { GitProviderConnectButtons } from "@src/features/settings/git/GitProviderConnectButtons";
-import { GitRepositoriesList } from "@src/features/settings/git/GitRepositoriesList";
-import {
-  GitRepositoriesSearch,
-  GitRepositoriesSearchSkeleton,
-} from "@src/features/settings/git/GitRepositoriesSearch";
-import { useGitOwners } from "@src/features/settings/git/useGitOwners";
-import { useLinkedGitRepos } from "@src/features/settings/git/useLinkedGitRepos";
-import useSliceMachineActions from "@src/modules/useSliceMachineActions";
-
-export const ConnectGitRepository: FC = () => (
-  <FieldSet>
-    <FieldSetLegend>Connected Git Repository</FieldSetLegend>
-    <ErrorBoundary renderError={renderError}>
-      <Suspense fallback={<GitRepositoriesSearchSkeleton gitOwnerSelect />}>
-        <Content />
-      </Suspense>
-    </ErrorBoundary>
-    <FieldSetFooter
-      action={
-        <Tooltip content="Documentation is coming soon." side="bottom">
-          <IconButton disabled icon="openInNew" />
-        </Tooltip>
-      }
-    >
-      Learn more about Prismic for Git
-    </FieldSetFooter>
-  </FieldSet>
-);
-
-const Content: FC = () => {
-  const { linkedGitRepos } = useLinkedGitRepos();
-  return linkedGitRepos.length > 0 ? (
-    <GitRepositoriesList mode="unlink" repos={linkedGitRepos} />
-  ) : (
-    <UnlinkedRepositoryContent />
-  );
-};
-
-const UnlinkedRepositoryContent: FC = () => {
-  const owners = useGitOwners();
-  return owners.length > 0 ? (
-    <GitRepositoriesSearch owners={owners} />
-  ) : (
-    <FieldSetContent>
-      <GitProviderConnectButtons />
-    </FieldSetContent>
-  );
-};
-
-function renderError(error: unknown, reset: () => void): ReactNode {
-  if (isUnauthenticatedError(error)) {
-    return <UnauthenticatedErrorContent />;
-  } else if (isUnauthorizedError(error)) {
-    return <UnauthorizedErrorContent />;
-  } else {
-    return <UnknownErrorContent reset={reset} />;
-  }
-}
-
-const UnauthenticatedErrorContent: FC = () => {
-  const { openLoginModal } = useSliceMachineActions();
-  return (
-    <FieldSetContent>
-      <ConnectGitRepositoryBlankSlate
-        title="It seems like you are logged out"
-        description="Log in to connect a Git repository."
-        action={<Button onClick={openLoginModal}>Log in to Prismic</Button>}
-      />
-    </FieldSetContent>
-  );
-};
-
-const UnauthorizedErrorContent: FC = () => (
-  <FieldSetContent>
-    <ConnectGitRepositoryBlankSlate
-      title="It seems like you do not have permission"
-      description="An owner or admin is required to connect a Git repository."
-    />
-  </FieldSetContent>
-);
-
-type UnknownErrorContentProps = { reset: () => void };
-
-const UnknownErrorContent: FC<UnknownErrorContentProps> = ({ reset }) => (
-  <FieldSetContent>
-    <ConnectGitRepositoryBlankSlate
-      title="Unable to fetch data"
-      description="An error occurred while fetching the list of connected Git repositories."
-      action={
-        <Button color="grey" onClick={reset}>
-          Retry
-        </Button>
-      }
-    />
-  </FieldSetContent>
-);

package/src/features/settings/git/ConnectGitRepositoryBlankSlate.tsx

@@ -1,33 +0,0 @@
-import { Box, ButtonGroup, Text } from "@prismicio/editor-ui";
-import type { FC, ReactNode } from "react";
-
-type ConnectGitRepositoryBlankSlateProps = {
-  title: string;
-  description: string;
-  action?: ReactNode;
-};
-
-export const ConnectGitRepositoryBlankSlate: FC<
-  ConnectGitRepositoryBlankSlateProps
-> = ({ title, description, action }) => (
-  <Box
-    flexDirection="column"
-    /*
-     * TODO: these `padding` values actually don't match Figma, but they are the
-     * closest allowed by the `Box` component.
-     */
-    padding={{ block: 72, inline: 100 }}
-  >
-    <Text align="center" variant="emphasized">
-      {title}
-    </Text>
-    <Text align="center" color="grey11">
-      {description}
-    </Text>
-    {Boolean(action) ? (
-      <ButtonGroup sx={{ alignSelf: "center", marginTop: 8 }}>
-        {action}
-      </ButtonGroup>
-    ) : undefined}
-  </Box>
-);

package/src/features/settings/git/GitOwnerSelect.tsx

@@ -1,71 +0,0 @@
-import { Select, SelectItem, tokens } from "@prismicio/editor-ui";
-import type { GitOwner } from "@slicemachine/manager";
-import type { ComponentProps, FC } from "react";
-
-import { gitProviderToConfig } from "@src/features/settings/git/GitProvider";
-
-type GitOwnerSelectProps = {
-  disabled?: boolean;
-  owners?: GitOwner[];
-  selectedOwner?: GitOwner;
-  onSelectedOwnerChange?: (selectedOwner: GitOwner) => void;
-  sx?: SX;
-};
-
-export const GitOwnerSelect: FC<GitOwnerSelectProps> = ({
-  disabled,
-  owners = [],
-  selectedOwner,
-  onSelectedOwnerChange,
-  sx,
-}) => (
-  <Select
-    color="grey"
-    constrainContentWidth
-    disabled={disabled}
-    flexContent
-    onValueChange={(value) => {
-      const [provider, id] = parseGitOwnerKey(value);
-      const selectedOwner = owners.find(
-        (owner) => owner.provider === provider && owner.id === id,
-      );
-      if (selectedOwner) {
-        onSelectedOwnerChange?.(selectedOwner);
-      }
-    }}
-    placeholder="Owner"
-    renderStartIcon={() => <GitOwnerIcon owner={selectedOwner} />}
-    size="large"
-    sx={sx}
-    value={selectedOwner ? formatGitOwnerKey(selectedOwner) : undefined}
-  >
-    {owners.map((owner) => (
-      <SelectItem
-        key={formatGitOwnerKey(owner)}
-        renderStartIcon={() => <GitOwnerIcon owner={owner} />}
-        size="large"
-        value={formatGitOwnerKey(owner)}
-      >
-        {owner.name}
-      </SelectItem>
-    ))}
-  </Select>
-);
-
-type GitOwnerIconProps = { owner: GitOwner | undefined };
-
-const GitOwnerIcon: FC<GitOwnerIconProps> = ({ owner }) => {
-  const { Icon } = gitProviderToConfig[owner?.provider ?? "gitHub"];
-  return <Icon color={tokens.color.greyLight11} />;
-};
-
-function formatGitOwnerKey(owner: GitOwner): string {
-  return `${owner.provider}@${owner.id}`;
-}
-
-function parseGitOwnerKey(key: string): string[] {
-  return key.split("@");
-}
-
-// TODO(DT-1928): export the `SX` type from `@prismicio/editor-ui`.
-type SX = ComponentProps<typeof Select>["sx"];

package/src/features/settings/git/GitProvider.ts

@@ -1,40 +0,0 @@
-import { BitbucketIcon } from "@src/icons/BitbucketIcon";
-import { GitHubIcon } from "@src/icons/GitHubIcon";
-import { GitLabIcon } from "@src/icons/GitLabIcon";
-import { managerClient } from "@src/managerClient";
-
-export type GitProvider = keyof typeof gitProviderToConfig;
-
-const GITHUB_APP_SLUG = "prismic-prod-internal-test";
-
-export const gitProviderToConfig = {
-  gitHub: {
-    connect: async () => {
-      const state = await managerClient.git.createGitHubAuthState();
-      const url = new URL(
-        `https://github.com/apps/${GITHUB_APP_SLUG}/installations/new`,
-      );
-      url.searchParams.set("state", state.key);
-      window.open(url, "git-hub-app-installation");
-    },
-    Icon: GitHubIcon,
-    name: "GitHub",
-    supported: true,
-  },
-  bitbucket: {
-    connect: () => {
-      throw new Error("Not implemented.");
-    },
-    Icon: BitbucketIcon,
-    name: "Bitbucket",
-    supported: false,
-  },
-  gitLab: {
-    connect: () => {
-      throw new Error("Not implemented.");
-    },
-    Icon: GitLabIcon,
-    name: "GitLab",
-    supported: false,
-  },
-};

package/src/features/settings/git/GitProviderConnectButtons.tsx

@@ -1,63 +0,0 @@
-import { keys } from "@prismicio/editor-support/Object";
-import { Button, ButtonGroup, Text, tokens } from "@prismicio/editor-ui";
-import { type ComponentProps, type FC, useState } from "react";
-import { toast } from "react-toastify";
-
-import {
-  type GitProvider,
-  gitProviderToConfig,
-} from "@src/features/settings/git/GitProvider";
-
-export const GitProviderConnectButtons: FC = () => (
-  <ButtonGroup>
-    {keys(gitProviderToConfig).map((provider) => (
-      <GitProviderConnectButton
-        key={provider}
-        provider={provider}
-        sx={{ flexBasis: 0, flexGrow: 1 }}
-      />
-    ))}
-  </ButtonGroup>
-);
-
-type GitProviderConnectButtonProps = { provider: GitProvider; sx?: SX };
-
-const GitProviderConnectButton: FC<GitProviderConnectButtonProps> = ({
-  provider,
-  sx,
-}) => {
-  const { connect, Icon, name, supported } = gitProviderToConfig[provider];
-  const [loading, setLoading] = useState(false);
-  return (
-    <Button
-      color="grey"
-      disabled={!supported}
-      loading={loading}
-      onClick={() => {
-        void (async () => {
-          setLoading(true);
-          try {
-            await connect();
-          } catch (error) {
-            const message = `Could not connect to ${name}`;
-            console.error(message, error);
-            toast.error(message);
-            setLoading(false);
-          }
-        })();
-      }}
-      renderStartIcon={() => <Icon color={tokens.color.greyLight11} />}
-      sx={sx}
-    >
-      {name}
-      {supported ? undefined : (
-        <Text color="inherit" variant="small">
-          {" (soon)"}
-        </Text>
-      )}
-    </Button>
-  );
-};
-
-// TODO(DT-1928): export the `SX` type from `@prismicio/editor-ui`.
-type SX = ComponentProps<typeof Button>["sx"];

package/src/features/settings/git/GitRepositoriesList.tsx

@@ -1,76 +0,0 @@
-import { Button, Skeleton, Text } from "@prismicio/editor-ui";
-import type { GitRepo, GitRepoSpecifier } from "@slicemachine/manager";
-import type { FC } from "react";
-
-import { FieldSetList, FieldSetListItem } from "@src/components/FieldSet";
-import { RelativeTime } from "@src/components/RelativeTime";
-import { GitRepositoryConnectDialog } from "@src/features/settings/git/GitRepositoryConnectDialog";
-import { GitRepositoryDisconnectDialog } from "@src/features/settings/git/GitRepositoryDisconnectDialog";
-import { useLinkedGitRepos } from "@src/features/settings/git/useLinkedGitRepos";
-
-type GitRepositoriesListProps =
-  | { mode: "link"; repos: GitRepo[] }
-  | { mode: "unlink"; repos: GitRepoSpecifier[] };
-
-export const GitRepositoriesList: FC<GitRepositoriesListProps> = ({
-  mode,
-  repos,
-}) => {
-  const { linkRepo, unlinkRepo } = useLinkedGitRepos();
-  return (
-    <FieldSetList>
-      {mode === "link"
-        ? repos.map((repo) => (
-            <FieldSetListItem
-              action={
-                <GitRepositoryConnectDialog
-                  linkRepo={linkRepo}
-                  repo={repo}
-                  trigger={<Button color="grey">Connect</Button>}
-                />
-              }
-              key={`${repo.provider}@${repo.id}`}
-            >
-              {repo.name}
-              <Text color="grey11">
-                {" • "}
-                <RelativeTime date={repo.pushedAt} />
-              </Text>
-            </FieldSetListItem>
-          ))
-        : repos.map((repo) => (
-            <FieldSetListItem
-              action={
-                <GitRepositoryDisconnectDialog
-                  repo={repo}
-                  trigger={<Button color="grey">Disconnect</Button>}
-                  unlinkRepo={unlinkRepo}
-                />
-              }
-              key={`${repo.provider}@${repo.owner}/${repo.name}`}
-            >
-              {repo.name}
-            </FieldSetListItem>
-          ))}
-    </FieldSetList>
-  );
-};
-
-export const GitRepositoriesListSkeleton: FC = () => (
-  <FieldSetList>
-    {[...Array(4).keys()].map((index) => (
-      <FieldSetListItem
-        action={<Skeleton height={32} width={67.59} />}
-        key={index}
-      >
-        <Skeleton
-          height={24}
-          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-          // @ts-ignore TODO(DT-1918): add `verticalAlign: "middle"` to the `sx` prop.
-          sx={{ verticalAlign: "middle" }}
-          width={129.92}
-        />
-      </FieldSetListItem>
-    ))}
-  </FieldSetList>
-);

package/src/features/settings/git/GitRepositoriesSearch.tsx

@@ -1,69 +0,0 @@
-import type { GitOwner } from "@slicemachine/manager";
-import { type FC, Suspense, useState } from "react";
-
-import { FieldSetContent, FieldSetHeader } from "@src/components/FieldSet";
-import { ConnectGitRepositoryBlankSlate } from "@src/features/settings/git/ConnectGitRepositoryBlankSlate";
-import { GitOwnerSelect } from "@src/features/settings/git/GitOwnerSelect";
-import {
-  GitRepositoriesList,
-  GitRepositoriesListSkeleton,
-} from "@src/features/settings/git/GitRepositoriesList";
-import { useGitRepos } from "@src/features/settings/git/useGitRepos";
-
-type GitRepositoriesSearchProps = { owners: GitOwner[] };
-
-export const GitRepositoriesSearch: FC<GitRepositoriesSearchProps> = ({
-  owners,
-}) => {
-  const [selectedOwner, setSelectedOwner] = useState(owners[0]);
-  return (
-    <>
-      <FieldSetHeader>
-        <GitOwnerSelect
-          owners={owners}
-          selectedOwner={selectedOwner}
-          onSelectedOwnerChange={setSelectedOwner}
-          sx={{ width: "calc(50% - 8px)" }}
-        />
-      </FieldSetHeader>
-      <Suspense
-        fallback={<GitRepositoriesSearchSkeleton gitOwnerSelect={false} />}
-      >
-        <GitRepositoriesSearchResults owner={selectedOwner} />
-      </Suspense>
-    </>
-  );
-};
-
-type GitRepositoriesSearchResultsProps = { owner: GitOwner };
-
-const GitRepositoriesSearchResults: FC<GitRepositoriesSearchResultsProps> = ({
-  owner,
-}) => {
-  const repos = useGitRepos({ provider: owner.provider, owner: owner.name });
-  return repos.length > 0 ? (
-    <GitRepositoriesList mode="link" repos={repos} />
-  ) : (
-    <FieldSetContent>
-      <ConnectGitRepositoryBlankSlate
-        title="No Results Found"
-        description="Try selecting a different Git account or organization on the top left."
-      />
-    </FieldSetContent>
-  );
-};
-
-type GitRepositoriesSearchSkeletonProps = { gitOwnerSelect: boolean };
-
-export const GitRepositoriesSearchSkeleton: FC<
-  GitRepositoriesSearchSkeletonProps
-> = ({ gitOwnerSelect }) => (
-  <>
-    {gitOwnerSelect ? (
-      <FieldSetHeader>
-        <GitOwnerSelect disabled sx={{ width: "calc(50% - 8px)" }} />
-      </FieldSetHeader>
-    ) : undefined}
-    <GitRepositoriesListSkeleton />
-  </>
-);