Apply PR review suggestions

BrunoQuaresma · BrunoQuaresma · commit c59abfd30c8c · 2024-01-24T11:43:00.000Z
diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthBanner.stories.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthBanner.stories.tsx
@@ -12,7 +12,7 @@ const MockExternalAuth: TemplateVersionExternalAuth = {
 };
 
 const meta: Meta<typeof ExternalAuthBanner> = {
-  title: "pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthBanner",
+  title: "pages/CreateWorkspacePage/ExternalAuthBanner",
   component: ExternalAuthBanner,
 };
 
diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthBanner.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthBanner.tsx
@@ -2,18 +2,19 @@ import { Interpolation, Theme } from "@emotion/react";
 import { TemplateVersionExternalAuth } from "api/typesGenerated";
 import { ExternalAuthPollingState } from "../CreateWorkspacePage";
 import { ExternalAuthItem } from "./ExternalAuthItem";
+import { FC } from "react";
 
 type ExternalAuthBannerProps = {
   providers: TemplateVersionExternalAuth[];
   pollingState: ExternalAuthPollingState;
   onStartPolling: () => void;
 };
 
-export const ExternalAuthBanner = ({
+export const ExternalAuthBanner: FC<ExternalAuthBannerProps> = ({
   providers,
   pollingState,
   onStartPolling,
-}: ExternalAuthBannerProps) => {
+}) => {
   return (
     <section css={styles.root}>
       <div css={styles.content}>
diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthItem.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthBanner/ExternalAuthItem.tsx
@@ -3,9 +3,9 @@ import DoneAllOutlined from "@mui/icons-material/DoneAllOutlined";
 import LoadingButton from "@mui/lab/LoadingButton";
 import { TemplateVersionExternalAuth } from "api/typesGenerated";
 import { ExternalImage } from "components/ExternalImage/ExternalImage";
-import { ComponentProps, useEffect, useState } from "react";
+import { FC, useEffect, useState } from "react";
 // eslint-disable-next-line no-restricted-imports -- used to allow extension with "component"
-import Box from "@mui/material/Box";
+import Box, { BoxProps } from "@mui/material/Box";
 
 type Status = "idle" | "connecting";
 
@@ -14,15 +14,15 @@ type ExternalAuthItemProps = {
   isPolling: boolean;
   defaultStatus?: Status;
   onStartPolling: () => void;
-} & ComponentProps<typeof Box>;
+} & BoxProps;
 
-export const ExternalAuthItem = ({
+export const ExternalAuthItem: FC<ExternalAuthItemProps> = ({
   provider,
   isPolling,
   defaultStatus = "idle",
   onStartPolling,
   ...boxProps
-}: ExternalAuthItemProps) => {
+}) => {
   const [status, setStatus] = useState(defaultStatus);
 
   useEffect(() => {
