binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-630] refactor: empty state (#3858)

Browse source 
* refactor: empty state global config file added and empty state component refactor

* refactor: empty state component refactor

* chore: empty state refactor

* chore: empty state config file updated

* chore: empty state action button permission logic updated

* chore: empty state config file updated

* chore: cycle and module empty filter state updated

* chore: empty state asset updated

* chore: empty state config file updated

* chore: empty state config file updated

* chore: empty state component improvement

* chore: empty state action button improvement

* fix: merge conflict
This commit is contained in:
Anmol Singh Bhatia 2024-03-06 20:16:54 +05:30 • committed by GitHub
parent 4861be2773
commit a08f401452
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
32 changed files with 759 additions and 1155 deletions
Download patch file Download diff file Expand all files Collapse all files

39
web/components/project/card-list.tsx
View file

@ -1,32 +1,20 @@
import { observer } from "mobx-react-lite";
import { useTheme } from "next-themes";
// hooks
import { useApplication, useEventTracker, useProject } from "hooks/store";
// components
import { EmptyState, getEmptyStateImagePath } from "components/empty-state";
import { EmptyState } from "components/empty-state";
import { ProjectCard } from "components/project";
import { ProjectsLoader } from "components/ui";
// constants
import { WORKSPACE_EMPTY_STATE_DETAILS } from "constants/empty-state";
import { EUserWorkspaceRoles } from "constants/workspace";
import { useApplication, useEventTracker, useProject, useUser } from "hooks/store";
import { EmptyStateType } from "constants/empty-state";
export const ProjectCardList = observer(() => {
// theme
const { resolvedTheme } = useTheme();
// store hooks
const { commandPalette: commandPaletteStore } = useApplication();
const { setTrackElement } = useEventTracker();
const {
membership: { currentWorkspaceRole },
currentUser,
} = useUser();
const { workspaceProjectIds, searchedProjects, getProjectById } = useProject();
const isLightMode = resolvedTheme ? resolvedTheme === "light" : currentUser?.theme.theme === "light";
const emptyStateImage = getEmptyStateImagePath("onboarding", "projects", isLightMode);
const isEditingAllowed = !!currentWorkspaceRole && currentWorkspaceRole >= EUserWorkspaceRoles.MEMBER;
if (!workspaceProjectIds) return <ProjectsLoader />;
return (
@ -49,22 +37,11 @@ export const ProjectCardList = observer(() => {
</div>
) : (
<EmptyState
image={emptyStateImage}
title={WORKSPACE_EMPTY_STATE_DETAILS["projects"].title}
description={WORKSPACE_EMPTY_STATE_DETAILS["projects"].description}
primaryButton={{
text: WORKSPACE_EMPTY_STATE_DETAILS["projects"].primaryButton.text,
onClick: () => {
setTrackElement("Project empty state");
commandPaletteStore.toggleCreateProjectModal(true);
},
type={EmptyStateType.WORKSPACE_PROJECTS}
primaryButtonOnClick={() => {
setTrackElement("Project empty state");
commandPaletteStore.toggleCreateProjectModal(true);
}}
comicBox={{
title: WORKSPACE_EMPTY_STATE_DETAILS["projects"].comicBox.title,
description: WORKSPACE_EMPTY_STATE_DETAILS["projects"].comicBox.description,
}}
size="lg"
disabled={!isEditingAllowed}
/>
)}
</>