import React, { useEffect, useState } from "react"; import { useRouter } from "next/router"; import Image from "next/image"; import Link from "next/link"; import useSWR, { mutate } from "swr"; // next-themes import { useTheme } from "next-themes"; // layouts import { WorkspaceAuthorizationLayout } from "layouts/auth-layout"; // services import userService from "services/user.service"; // hooks import useUser from "hooks/use-user"; import useProjects from "hooks/use-projects"; // components import { CompletedIssuesGraph, IssuesList, IssuesPieChart, IssuesStats, } from "components/workspace"; import { TourRoot } from "components/onboarding"; // ui import { PrimaryButton, ProductUpdatesModal } from "components/ui"; // icons import { BoltOutlined, GridViewOutlined } from "@mui/icons-material"; // images import emptyDashboard from "public/empty-state/dashboard.svg"; import githubBlackImage from "/public/logos/github-black.png"; import githubWhiteImage from "/public/logos/github-white.png"; // helpers import { render12HourFormatTime, renderShortDate } from "helpers/date-time.helper"; // types import { ICurrentUserResponse } from "types"; import type { NextPage } from "next"; // fetch-keys import { CURRENT_USER, USER_WORKSPACE_DASHBOARD } from "constants/fetch-keys"; // constants import { DAYS } from "constants/project"; const WorkspacePage: NextPage = () => { const [month, setMonth] = useState(new Date().getMonth() + 1); const [isProductUpdatesModalOpen, setIsProductUpdatesModalOpen] = useState(false); const router = useRouter(); const { workspaceSlug } = router.query; const { theme } = useTheme(); const { user } = useUser(); const { projects } = useProjects(); const { data: workspaceDashboardData } = useSWR( workspaceSlug ? USER_WORKSPACE_DASHBOARD(workspaceSlug as string) : null, workspaceSlug ? () => userService.userWorkspaceDashboard(workspaceSlug as string, month) : null ); const today = new Date(); const greeting = today.getHours() < 12 ? "morning" : today.getHours() < 18 ? "afternoon" : "evening"; useEffect(() => { if (!workspaceSlug) return; mutate(USER_WORKSPACE_DASHBOARD(workspaceSlug as string)); }, [month, workspaceSlug]); return ( Dashboard } right={
GitHub Logo Star us on GitHub
} > {isProductUpdatesModalOpen && ( )} {user && !user.is_tour_completed && (
{ mutate( CURRENT_USER, (prevData) => { if (!prevData) return prevData; return { ...prevData, is_tour_completed: true, }; }, false ); userService.updateUserTourCompleted(user).catch(() => mutate(CURRENT_USER)); }} />
)}

Good {greeting}, {user?.first_name} {user?.last_name}

{greeting === "morning" ? "🌤️" : greeting === "afternoon" ? "🌥️" : "🌙️"}
{DAYS[today.getDay()]}, {renderShortDate(today)} {render12HourFormatTime(today)}
{projects ? ( projects.length > 0 ? (
) : (
Create a project

Manage your projects by creating issues, cycles, modules, views and pages.

{ const e = new KeyboardEvent("keydown", { key: "p", }); document.dispatchEvent(e); }} > Create Project
Empty Dashboard
) ) : null}
); }; export default WorkspacePage;