github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

[WEB-1555] fix: analytics empty state flicker (#4754)

Browse Source 
* fix: analytics empty state flicker

* chore: todo added
This commit is contained in:
Anmol Singh Bhatia 2024-06-11 17:35:54 +05:30 committed by GitHub
parent 778fca9db6
commit 1c558eb6b3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 45 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
web/app/[workspaceSlug]/(projects)/analytics/page.tsx
View File

@ -20,53 +20,58 @@ const AnalyticsPage = observer(() => {
// store hooks // store hooks
const { toggleCreateProjectModal } = useCommandPalette(); const { toggleCreateProjectModal } = useCommandPalette();
const { setTrackElement } = useEventTracker(); const { setTrackElement } = useEventTracker();
const { workspaceProjectIds } = useProject(); const { workspaceProjectIds, loader } = useProject();
const { currentWorkspace } = useWorkspace(); const { currentWorkspace } = useWorkspace();
// derived values // derived values
const pageTitle = currentWorkspace?.name ? `${currentWorkspace?.name} - Analytics` : undefined; const pageTitle = currentWorkspace?.name ? `${currentWorkspace?.name} - Analytics` : undefined;
// TODO: refactor loader implementation
return ( return (
<> <>
<PageHead title={pageTitle} /> <PageHead title={pageTitle} />
{workspaceProjectIds && workspaceProjectIds.length > 0 ? ( {workspaceProjectIds && (
<div className="flex h-full flex-col overflow-hidden bg-custom-background-100"> <>
<Tab.Group as={Fragment} defaultIndex={analytics_tab === "custom" ? 1 : 0}> {workspaceProjectIds.length > 0 || loader ? (
<Tab.List as="div" className="flex space-x-2 border-b h-[50px] border-custom-border-200 px-0 md:px-5"> <div className="flex h-full flex-col overflow-hidden bg-custom-background-100">
{ANALYTICS_TABS.map((tab) => ( <Tab.Group as={Fragment} defaultIndex={analytics_tab === "custom" ? 1 : 0}>
<Tab key={tab.key} as={Fragment}> <Tab.List as="div" className="flex space-x-2 border-b h-[50px] border-custom-border-200 px-0 md:px-5">
{({ selected }) => ( {ANALYTICS_TABS.map((tab) => (
<button <Tab key={tab.key} as={Fragment}>
className={`text-sm group relative flex items-center gap-1 h-[50px] px-3 cursor-pointer transition-all font-medium outline-none ${ {({ selected }) => (
selected ? "text-custom-primary-100 " : "hover:text-custom-text-200" <button
}`} className={`text-sm group relative flex items-center gap-1 h-[50px] px-3 cursor-pointer transition-all font-medium outline-none ${
> selected ? "text-custom-primary-100 " : "hover:text-custom-text-200"
{tab.title} }`}
<div >
className={`border absolute bottom-0 right-0 left-0 rounded-t-md ${selected ? "border-custom-primary-100" : "border-transparent group-hover:border-custom-border-200"}`} {tab.title}
/> <div
</button> className={`border absolute bottom-0 right-0 left-0 rounded-t-md ${selected ? "border-custom-primary-100" : "border-transparent group-hover:border-custom-border-200"}`}
)} />
</Tab> </button>
))} )}
</Tab.List> </Tab>
<Tab.Panels as={Fragment}> ))}
<Tab.Panel as={Fragment}> </Tab.List>
<ScopeAndDemand fullScreen /> <Tab.Panels as={Fragment}>
</Tab.Panel> <Tab.Panel as={Fragment}>
<Tab.Panel as={Fragment}> <ScopeAndDemand fullScreen />
<CustomAnalytics fullScreen /> </Tab.Panel>
</Tab.Panel> <Tab.Panel as={Fragment}>
</Tab.Panels> <CustomAnalytics fullScreen />
</Tab.Group> </Tab.Panel>
</div> </Tab.Panels>
) : ( </Tab.Group>
<EmptyState </div>
type={EmptyStateType.WORKSPACE_ANALYTICS} ) : (
primaryButtonOnClick={() => { <EmptyState
setTrackElement("Analytics empty state"); type={EmptyStateType.WORKSPACE_ANALYTICS}
toggleCreateProjectModal(true); primaryButtonOnClick={() => {
}} setTrackElement("Analytics empty state");
/> toggleCreateProjectModal(true);
}}
/>
)}
</>
)} )}
</> </>
); );