[WEB-5248] chore: empty state code refactor and translation fix (#8017)
* chore: empty state code refactor and translation fix * chore: code refactor
This commit is contained in:
parent
3faf768112
commit
cf7f891bcb
29 changed files with 52 additions and 59 deletions
|
|
@ -6,20 +6,18 @@ import { useRouter } from "next/navigation";
|
|||
// plane package imports
|
||||
import { EUserPermissions, EUserPermissionsLevel, PROJECT_TRACKER_ELEMENTS } from "@plane/constants";
|
||||
import { useTranslation } from "@plane/i18n";
|
||||
import { EmptyStateDetailed } from "@plane/propel/empty-state";
|
||||
import { Tabs } from "@plane/ui";
|
||||
import type { TabItem } from "@plane/ui";
|
||||
// components
|
||||
import AnalyticsFilterActions from "@/components/analytics/analytics-filter-actions";
|
||||
import { PageHead } from "@/components/core/page-title";
|
||||
import { ComicBoxButton } from "@/components/empty-state/comic-box-button";
|
||||
import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";
|
||||
// hooks
|
||||
import { captureClick } from "@/helpers/event-tracker.helper";
|
||||
import { useCommandPalette } from "@/hooks/store/use-command-palette";
|
||||
import { useProject } from "@/hooks/store/use-project";
|
||||
import { useWorkspace } from "@/hooks/store/use-workspace";
|
||||
import { useUserPermissions } from "@/hooks/store/user";
|
||||
import { useResolvedAssetPath } from "@/hooks/use-resolved-asset-path";
|
||||
import { getAnalyticsTabs } from "@/plane-web/components/analytics/tabs";
|
||||
|
||||
type Props = {
|
||||
|
|
@ -46,9 +44,6 @@ const AnalyticsPage = observer((props: Props) => {
|
|||
const { currentWorkspace } = useWorkspace();
|
||||
const { allowPermissions } = useUserPermissions();
|
||||
|
||||
// helper hooks
|
||||
const resolvedPath = useResolvedAssetPath({ basePath: "/empty-state/onboarding/analytics" });
|
||||
|
||||
// permissions
|
||||
const canPerformEmptyStateActions = allowPermissions(
|
||||
[EUserPermissions.ADMIN, EUserPermissions.MEMBER],
|
||||
|
|
@ -96,22 +91,20 @@ const AnalyticsPage = observer((props: Props) => {
|
|||
/>
|
||||
</div>
|
||||
) : (
|
||||
<DetailedEmptyState
|
||||
title={t("workspace_analytics.empty_state.general.title")}
|
||||
description={t("workspace_analytics.empty_state.general.description")}
|
||||
assetPath={resolvedPath}
|
||||
customPrimaryButton={
|
||||
<ComicBoxButton
|
||||
label={t("workspace_analytics.empty_state.general.primary_button.text")}
|
||||
title={t("workspace_analytics.empty_state.general.primary_button.comic.title")}
|
||||
description={t("workspace_analytics.empty_state.general.primary_button.comic.description")}
|
||||
onClick={() => {
|
||||
<EmptyStateDetailed
|
||||
assetKey="project"
|
||||
title={t("workspace_projects.empty_state.no_projects.title")}
|
||||
description={t("workspace_projects.empty_state.no_projects.description")}
|
||||
actions={[
|
||||
{
|
||||
label: "Create a project",
|
||||
onClick: () => {
|
||||
toggleCreateProjectModal(true);
|
||||
captureClick({ elementName: PROJECT_TRACKER_ELEMENTS.EMPTY_STATE_CREATE_PROJECT_BUTTON });
|
||||
}}
|
||||
disabled={!canPerformEmptyStateActions}
|
||||
/>
|
||||
}
|
||||
},
|
||||
disabled: !canPerformEmptyStateActions,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -137,8 +137,8 @@ export const InboxSidebar: FC<IInboxSidebarProps> = observer((props) => {
|
|||
{getAppliedFiltersCount > 0 ? (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
assetClassName="size-20"
|
||||
/>
|
||||
) : currentTab === EInboxIssueCurrentTab.OPEN ? (
|
||||
|
|
|
|||
|
|
@ -34,8 +34,8 @@ export const ProjectArchivedEmptyState: React.FC = observer(() => {
|
|||
{archivedWorkItemFilter?.hasActiveFilters ? (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
actions={[
|
||||
{
|
||||
label: t("common.search.cta_secondary"),
|
||||
|
|
|
|||
|
|
@ -89,11 +89,11 @@ export const CycleEmptyState: React.FC = observer(() => {
|
|||
) : cycleWorkItemFilter?.hasActiveFilters ? (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
actions={[
|
||||
{
|
||||
label: t("common.search.cta_secondary"),
|
||||
label: t("common_empty_state.search.cta_secondary"),
|
||||
onClick: cycleWorkItemFilter?.clearFilters,
|
||||
disabled: !canPerformEmptyStateActions || !cycleWorkItemFilter,
|
||||
variant: "outline-primary",
|
||||
|
|
|
|||
|
|
@ -76,11 +76,11 @@ export const ModuleEmptyState: React.FC = observer(() => {
|
|||
{moduleWorkItemFilter?.hasActiveFilters ? (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
actions={[
|
||||
{
|
||||
label: t("common.search.cta_secondary"),
|
||||
label: t("common_empty_state.search.cta_secondary"),
|
||||
onClick: moduleWorkItemFilter?.clearFilters,
|
||||
disabled: !canPerformEmptyStateActions || !moduleWorkItemFilter,
|
||||
variant: "outline-primary",
|
||||
|
|
|
|||
|
|
@ -34,8 +34,8 @@ export const ProjectEmptyState: React.FC = observer(() => {
|
|||
{projectWorkItemFilter?.hasActiveFilters ? (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
actions={[
|
||||
{
|
||||
label: t("project_issues.empty_state.issues_empty_filter.secondary_button.text"),
|
||||
|
|
|
|||
|
|
@ -68,8 +68,8 @@ export const ModulesListView: React.FC = observer(() => {
|
|||
return (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
/>
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -162,8 +162,8 @@ export const PagesListMainContent: React.FC<Props> = observer((props) => {
|
|||
return (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
/>
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -78,13 +78,13 @@ export const ProjectCardList = observer((props: TProjectCardListProps) => {
|
|||
currentWorkspaceDisplayFilters?.archived_projects &&
|
||||
calculateTotalFilters(currentWorkspaceFilters ?? {}) === 0
|
||||
? t("workspace.projects_archived.title")
|
||||
: t("common.search.title")
|
||||
: t("common_empty_state.search.title")
|
||||
}
|
||||
description={
|
||||
currentWorkspaceDisplayFilters?.archived_projects &&
|
||||
calculateTotalFilters(currentWorkspaceFilters ?? {}) === 0
|
||||
? t("workspace.projects_archived.description")
|
||||
: t("common.search.description")
|
||||
: t("common_empty_state.search.description")
|
||||
}
|
||||
assetKey={
|
||||
currentWorkspaceDisplayFilters?.archived_projects &&
|
||||
|
|
|
|||
|
|
@ -37,8 +37,8 @@ export const ProjectViewsList = observer(() => {
|
|||
return (
|
||||
<EmptyStateDetailed
|
||||
assetKey="search"
|
||||
title={t("common.search.title")}
|
||||
description={t("common.search.description")}
|
||||
title={t("common_empty_state.search.title")}
|
||||
description={t("common_empty_state.search.description")}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue