diff --git a/packages/console/src/components/CreateConnectorForm/index.tsx b/packages/console/src/components/CreateConnectorForm/index.tsx index 1a5963ec8..67c4d37ac 100644 --- a/packages/console/src/components/CreateConnectorForm/index.tsx +++ b/packages/console/src/components/CreateConnectorForm/index.tsx @@ -11,6 +11,7 @@ import { TenantsContext } from '@/contexts/TenantsProvider'; import DynamicT from '@/ds-components/DynamicT'; import ModalLayout from '@/ds-components/ModalLayout'; import type { RequestError } from '@/hooks/use-api'; +import useConnectorFactories from '@/hooks/use-connector-factories'; import useSubscriptionPlan from '@/hooks/use-subscription-plan'; import * as modalStyles from '@/scss/modal.module.scss'; @@ -35,10 +36,7 @@ function CreateConnectorForm({ onClose, isOpen: isFormOpen, type }: Props) { ConnectorResponse[], RequestError >('api/connectors'); - const { data: factories, error: factoriesError } = useSWR< - ConnectorFactoryResponse[], - RequestError - >('api/connector-factories'); + const { data: factories, error: factoriesError } = useConnectorFactories(); const isLoading = !factories && !existingConnectors && !connectorsError && !factoriesError; const [activeGroupId, setActiveGroupId] = useState(); const [activeFactoryId, setActiveFactoryId] = useState(); diff --git a/packages/console/src/hooks/use-connector-factories.ts b/packages/console/src/hooks/use-connector-factories.ts new file mode 100644 index 000000000..5eba9e171 --- /dev/null +++ b/packages/console/src/hooks/use-connector-factories.ts @@ -0,0 +1,9 @@ +import { type ConnectorFactoryResponse } from '@logto/schemas'; +import useSWRImmutable from 'swr/immutable'; + +import { type RequestError } from './use-api'; + +const useConnectorFactories = () => + useSWRImmutable('api/connector-factories'); + +export default useConnectorFactories; diff --git a/packages/console/src/pages/ConnectorDetails/index.tsx b/packages/console/src/pages/ConnectorDetails/index.tsx index 50278f441..c838b4232 100644 --- a/packages/console/src/pages/ConnectorDetails/index.tsx +++ b/packages/console/src/pages/ConnectorDetails/index.tsx @@ -7,6 +7,7 @@ import { toast } from 'react-hot-toast'; import { useTranslation } from 'react-i18next'; import { useLocation, useParams } from 'react-router-dom'; import useSWR, { useSWRConfig } from 'swr'; +import useSWRImmutable from 'swr/immutable'; import Delete from '@/assets/icons/delete.svg'; import More from '@/assets/icons/more.svg'; @@ -59,7 +60,7 @@ function ConnectorDetails() { data: connectorFactory, error: fetchConnectorFactoryError, mutate: mutateConnectorFactory, - } = useSWR( + } = useSWRImmutable( data?.isStandard && `api/connector-factories/${data.connectorId}` ); diff --git a/packages/console/src/pages/Connectors/ConnectorTypeColumn/index.tsx b/packages/console/src/pages/Connectors/ConnectorTypeColumn/index.tsx index 1894d377b..e67ede780 100644 --- a/packages/console/src/pages/Connectors/ConnectorTypeColumn/index.tsx +++ b/packages/console/src/pages/Connectors/ConnectorTypeColumn/index.tsx @@ -1,6 +1,6 @@ import type { ConnectorFactoryResponse } from '@logto/schemas'; import { useTranslation } from 'react-i18next'; -import useSWR from 'swr'; +import useSWRImmutable from 'swr/immutable'; import UnnamedTrans from '@/components/UnnamedTrans'; import { connectorTitlePlaceHolder } from '@/consts/connectors'; @@ -21,7 +21,7 @@ function ConnectorTypeColumn({ connectorGroup: { type, connectors } }: Props) { const firstStandardConnector = standardConnectors[0]; - const { data: connectorFactory } = useSWR( + const { data: connectorFactory } = useSWRImmutable( firstStandardConnector && `api/connector-factories/${firstStandardConnector.connectorId}` ); diff --git a/packages/console/src/pages/Connectors/index.tsx b/packages/console/src/pages/Connectors/index.tsx index ef547c616..e28f681c3 100644 --- a/packages/console/src/pages/Connectors/index.tsx +++ b/packages/console/src/pages/Connectors/index.tsx @@ -1,12 +1,10 @@ import { withAppInsights } from '@logto/app-insights/react'; import { ServiceConnector } from '@logto/connector-kit'; import { ConnectorType } from '@logto/schemas'; -import type { ConnectorFactoryResponse } from '@logto/schemas'; import { conditional } from '@silverhand/essentials'; import { useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import { useParams } from 'react-router-dom'; -import useSWR from 'swr'; import Plus from '@/assets/icons/plus.svg'; import SocialConnectorEmptyDark from '@/assets/images/social-connector-empty-dark.svg'; @@ -18,8 +16,8 @@ import { ConnectorsTabs } from '@/consts/page-tabs'; import Button from '@/ds-components/Button'; import TabNav, { TabNavItem } from '@/ds-components/TabNav'; import TablePlaceholder from '@/ds-components/Table/TablePlaceholder'; -import type { RequestError } from '@/hooks/use-api'; import useConnectorApi from '@/hooks/use-connector-api'; +import useConnectorFactories from '@/hooks/use-connector-factories'; import useConnectorGroups from '@/hooks/use-connector-groups'; import useDocumentationUrl from '@/hooks/use-documentation-url'; import useTenantPathname from '@/hooks/use-tenant-pathname'; @@ -68,10 +66,7 @@ function Connectors() { const { getDocumentationUrl } = useDocumentationUrl(); const { createConnector } = useConnectorApi(); const { data, error, mutate } = useConnectorGroups(); - const { data: factories, error: factoriesError } = useSWR< - ConnectorFactoryResponse[], - RequestError - >('api/connector-factories'); + const { data: factories, error: factoriesError } = useConnectorFactories(); const isLoading = !data && !factories && !error && !factoriesError;