chore: workspace settings realted constants

makeplane · Jan 17, 2025 · 214c820 · 214c820
1 parent 8497947
commit 214c820
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 48 deletions.
diff --git a/web/app/[workspaceSlug]/(projects)/settings/api-tokens/page.tsx b/web/app/[workspaceSlug]/(projects)/settings/api-tokens/page.tsx
@@ -4,19 +4,19 @@ import React, { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
-// ui
+// plane imports
+import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/ui";
 // component
 import { ApiTokenListItem, CreateApiTokenModal } from "@/components/api-token";
 import { NotAuthorizedView } from "@/components/auth-screens";
 import { PageHead } from "@/components/core";
-import { EmptyState } from "@/components/empty-state";
+import { DetailedEmptyState } from "@/components/empty-state";
 import { APITokenSettingsLoader } from "@/components/ui";
-// constants
-import { EmptyStateType } from "@/constants/empty-state";
 import { API_TOKENS_LIST } from "@/constants/fetch-keys";
 // store hooks
 import { useUserPermissions, useWorkspace } from "@/hooks/store";
+import { useResolvedAssetPath } from "@/hooks/use-resolved-asset-path";
 import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 // services
 import { APITokenService } from "@/services/api_token.service";
@@ -28,11 +28,14 @@ const ApiTokensPage = observer(() => {
   const [isCreateTokenModalOpen, setIsCreateTokenModalOpen] = useState(false);
   // router
   const { workspaceSlug } = useParams();
+  // plane hooks
+  const { t } = useTranslation();
   // store hooks
   const { currentWorkspace } = useWorkspace();
   const { workspaceUserInfo, allowPermissions } = useUserPermissions();
   // derived values
   const canPerformWorkspaceAdminActions = allowPermissions([EUserPermissions.ADMIN], EUserPermissionsLevel.WORKSPACE);
+  const resolvedPath = useResolvedAssetPath({ basePath: "/empty-state/workspace-settings/api-tokens" });
 
   const { data: tokens } = useSWR(
     workspaceSlug && canPerformWorkspaceAdminActions ? API_TOKENS_LIST(workspaceSlug.toString()) : null,
@@ -78,7 +81,11 @@ const ApiTokensPage = observer(() => {
               </Button>
             </div>
             <div className="h-full w-full flex items-center justify-center">
-              <EmptyState type={EmptyStateType.WORKSPACE_SETTINGS_API_TOKENS} />
+              <DetailedEmptyState
+                title={t("workspace_settings.empty_state.api_tokens.title")}
+                description={t("workspace_settings.empty_state.api_tokens.description")}
+                assetPath={resolvedPath}
+              />
             </div>
           </div>
         )}

diff --git a/web/app/[workspaceSlug]/(projects)/settings/webhooks/page.tsx b/web/app/[workspaceSlug]/(projects)/settings/webhooks/page.tsx
@@ -4,32 +4,34 @@ import React, { useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
-// ui
+// plane imports
+import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/ui";
 // components
 import { NotAuthorizedView } from "@/components/auth-screens";
 import { PageHead } from "@/components/core";
-import { EmptyState } from "@/components/empty-state";
+import { DetailedEmptyState } from "@/components/empty-state";
 import { WebhookSettingsLoader } from "@/components/ui";
 import { WebhooksList, CreateWebhookModal } from "@/components/web-hooks";
-// constants
-import { EmptyStateType } from "@/constants/empty-state";
 // hooks
 import { useUserPermissions, useWebhook, useWorkspace } from "@/hooks/store";
+import { useResolvedAssetPath } from "@/hooks/use-resolved-asset-path";
 import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 
 const WebhooksListPage = observer(() => {
   // states
   const [showCreateWebhookModal, setShowCreateWebhookModal] = useState(false);
   // router
   const { workspaceSlug } = useParams();
+  // plane hooks
+  const { t } = useTranslation();
   // mobx store
   const { workspaceUserInfo, allowPermissions } = useUserPermissions();
-
   const { fetchWebhooks, webhooks, clearSecretKey, webhookSecretKey, createWebhook } = useWebhook();
   const { currentWorkspace } = useWorkspace();
-
+  // derived values
   const canPerformWorkspaceAdminActions = allowPermissions([EUserPermissions.ADMIN], EUserPermissionsLevel.WORKSPACE);
+  const resolvedPath = useResolvedAssetPath({ basePath: "/empty-state/workspace-settings/webhooks" });
 
   useSWR(
     workspaceSlug && canPerformWorkspaceAdminActions ? `WEBHOOKS_LIST_${workspaceSlug}` : null,
@@ -81,7 +83,11 @@ const WebhooksListPage = observer(() => {
               </Button>
             </div>
             <div className="h-full w-full flex items-center justify-center">
-              <EmptyState type={EmptyStateType.WORKSPACE_SETTINGS_WEBHOOKS} />
+              <DetailedEmptyState
+                title={t("workspace_settings.empty_state.webhooks.title")}
+                description={t("workspace_settings.empty_state.webhooks.description")}
+                assetPath={resolvedPath}
+              />
             </div>
           </div>
         )}

diff --git a/web/core/components/exporter/guide.tsx b/web/core/components/exporter/guide.tsx
@@ -8,19 +8,20 @@ import { useParams, useSearchParams } from "next/navigation";
 import useSWR, { mutate } from "swr";
 // icons
 import { MoveLeft, MoveRight, RefreshCw } from "lucide-react";
-// ui
+// plane imports
+import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/ui";
 // components
-import { EmptyState } from "@/components/empty-state";
+import { DetailedEmptyState } from "@/components/empty-state";
 import { Exporter, SingleExport } from "@/components/exporter";
 import { ImportExportSettingsLoader } from "@/components/ui";
 // constants
-import { EmptyStateType } from "@/constants/empty-state";
 import { EXPORT_SERVICES_LIST } from "@/constants/fetch-keys";
 import { EXPORTERS_LIST } from "@/constants/workspace";
 // hooks
 import { useProject, useUser, useUserPermissions } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
+import { useResolvedAssetPath } from "@/hooks/use-resolved-asset-path";
 import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions";
 // services
 import { IntegrationService } from "@/services/integrations";
@@ -37,11 +38,14 @@ const IntegrationGuide = observer(() => {
   const { workspaceSlug } = useParams();
   const searchParams = useSearchParams();
   const provider = searchParams.get("provider");
+  // plane hooks
+  const { t } = useTranslation();
   // store hooks
   const { data: currentUser, canPerformAnyCreateAction } = useUser();
   const { allowPermissions } = useUserPermissions();
-
   const { workspaceProjectIds } = useProject();
+  // derived values
+  const resolvedPath = useResolvedAssetPath({ basePath: "/empty-state/workspace-settings/exports" });
 
   const { data: exporterServices } = useSWR(
     workspaceSlug && cursor ? EXPORT_SERVICES_LIST(workspaceSlug as string, cursor, `${per_page}`) : null,
@@ -164,7 +168,11 @@ const IntegrationGuide = observer(() => {
                   </div>
                 ) : (
                   <div className="flex h-full w-full items-center justify-center">
-                    <EmptyState type={EmptyStateType.WORKSPACE_SETTINGS_EXPORT} size="sm" />
+                    <DetailedEmptyState
+                      title={t("workspace_settings.empty_state.exports.title")}
+                      description={t("workspace_settings.empty_state.exports.description")}
+                      assetPath={resolvedPath}
+                    />
                   </div>
                 )
               ) : (

diff --git a/web/core/components/integration/guide.tsx b/web/core/components/integration/guide.tsx
@@ -28,6 +28,7 @@ import { IntegrationService } from "@/services/integrations";
 // services
 const integrationService = new IntegrationService();
 
+// FIXME: [Deprecated] Remove this component
 const IntegrationGuide = observer(() => {
   // states
   const [refreshing, setRefreshing] = useState(false);
@@ -137,7 +138,7 @@ const IntegrationGuide = observer(() => {
                     </div>
                   ) : (
                     <div className="flex h-full w-full items-center justify-center">
-                      <EmptyState type={EmptyStateType.WORKSPACE_SETTINGS_IMPORT} size="sm" />
+                      {/* <EmptyState type={EmptyStateType.WORKSPACE_SETTINGS_IMPORT} size="sm" /> */}
                     </div>
                   )
                 ) : (

diff --git a/web/core/constants/empty-state.tsx b/web/core/constants/empty-state.tsx
@@ -37,10 +37,6 @@ export enum EmptyStateType {
   WORKSPACE_CUSTOM_VIEW = "workspace-custom-view",
   WORKSPACE_NO_PROJECTS = "workspace-no-projects",
   WORKSPACE_PROJECT_NOT_FOUND = "workspace-project-not-found",
-  WORKSPACE_SETTINGS_API_TOKENS = "workspace-settings-api-tokens",
-  WORKSPACE_SETTINGS_WEBHOOKS = "workspace-settings-webhooks",
-  WORKSPACE_SETTINGS_EXPORT = "workspace-settings-export",
-  WORKSPACE_SETTINGS_IMPORT = "workspace-settings-import",
   // stickies
   STICKIES = "stickies",
   STICKIES_SEARCH = "stickies-search",
@@ -178,32 +174,6 @@ const emptyStateDetails: Record<EmptyStateType, EmptyStateDetails> = {
     accessType: "workspace",
     access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
   },
-  // workspace settings
-  [EmptyStateType.WORKSPACE_SETTINGS_API_TOKENS]: {
-    key: EmptyStateType.WORKSPACE_SETTINGS_API_TOKENS,
-    title: "No API tokens created",
-    description:
-      "Plane APIs can be used to integrate your data in Plane with any external system. Create a token to get started.",
-    path: "/empty-state/workspace-settings/api-tokens",
-  },
-  [EmptyStateType.WORKSPACE_SETTINGS_WEBHOOKS]: {
-    key: EmptyStateType.WORKSPACE_SETTINGS_WEBHOOKS,
-    title: "No webhooks added",
-    description: "Create webhooks to receive real-time updates and automate actions.",
-    path: "/empty-state/workspace-settings/webhooks",
-  },
-  [EmptyStateType.WORKSPACE_SETTINGS_EXPORT]: {
-    key: EmptyStateType.WORKSPACE_SETTINGS_EXPORT,
-    title: "No previous exports yet",
-    description: "Anytime you export, you will also have a copy here for reference.",
-    path: "/empty-state/workspace-settings/exports",
-  },
-  [EmptyStateType.WORKSPACE_SETTINGS_IMPORT]: {
-    key: EmptyStateType.WORKSPACE_SETTINGS_IMPORT,
-    title: "No previous imports yet",
-    description: "Find all your previous imports here and download them.",
-    path: "/empty-state/workspace-settings/imports",
-  },
   // empty filters
   [EmptyStateType.STICKIES]: {
     key: EmptyStateType.STICKIES,