From 87fcf90484c4824865b1f56c06306fd7de190830 Mon Sep 17 00:00:00 2001 From: Wayne Date: Thu, 28 Mar 2024 22:54:57 +0900 Subject: [PATCH] Add locale to theme --- src/app/(main)/projects/create/page.tsx | 1 - src/app/layout.tsx | 2 +- .../CreateProject/ResourceAllocation.tsx | 27 ++++++++++++++++++- .../SearchResults/SearchResults.tsx | 13 --------- src/theme/ThemeRegistry.tsx | 21 +++++++++++++-- 5 files changed, 46 insertions(+), 18 deletions(-) diff --git a/src/app/(main)/projects/create/page.tsx b/src/app/(main)/projects/create/page.tsx index fef65c1..c737430 100644 --- a/src/app/(main)/projects/create/page.tsx +++ b/src/app/(main)/projects/create/page.tsx @@ -1,4 +1,3 @@ -"use client"; import { fetchProjectCategories } from "@/app/api/projects"; import { preloadStaff } from "@/app/api/staff"; import { fetchAllTasks, fetchTaskTemplates } from "@/app/api/tasks"; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 43b60c1..3577b30 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -17,7 +17,7 @@ export default async function RootLayout({ return ( - {children} + {children} ); diff --git a/src/components/CreateProject/ResourceAllocation.tsx b/src/components/CreateProject/ResourceAllocation.tsx index 33b92bb..4877a1d 100644 --- a/src/components/CreateProject/ResourceAllocation.tsx +++ b/src/components/CreateProject/ResourceAllocation.tsx @@ -8,6 +8,7 @@ import { ListItemButton, ListItemText, TextField, + Alert, } from "@mui/material"; import { useState, useCallback, useEffect, useMemo } from "react"; import { useTranslation } from "react-i18next"; @@ -230,4 +231,28 @@ const ResourceAllocation: React.FC = ({ ); }; -export default ResourceAllocation; +const NoTaskState: React.FC = () => { + const { t } = useTranslation(); + return ( + <> + + {t("Task Breakdown")} + + + {t('Please add some tasks in "Project Task Setup" first!')} + + + ); +}; + +const ResourceAllocationWrapper: React.FC = (props) => { + const { getValues } = useFormContext(); + + if (Object.keys(getValues("tasks")).length === 0) { + return ; + } + + return ; +}; + +export default ResourceAllocationWrapper; diff --git a/src/components/SearchResults/SearchResults.tsx b/src/components/SearchResults/SearchResults.tsx index 8d3e2ca..4c82280 100644 --- a/src/components/SearchResults/SearchResults.tsx +++ b/src/components/SearchResults/SearchResults.tsx @@ -12,8 +12,6 @@ import TablePagination, { } from "@mui/material/TablePagination"; import TableRow from "@mui/material/TableRow"; import IconButton from "@mui/material/IconButton"; -import { ThemeProvider, createTheme } from "@mui/material"; -import { zhTW, enUS } from '@mui/material/locale'; export interface ResultWithId { id: string | number; @@ -67,18 +65,8 @@ function SearchResults({ setPage(0); }; - - const theme = createTheme( - - // locale - //TODO: May need to know what locale the client is using - // localStorage.getItem("locale")?.includes("zh") ? zhTW : enUS - zhTW - ); - const table = ( <> - @@ -129,7 +117,6 @@ function SearchResults({ onPageChange={handleChangePage} onRowsPerPageChange={handleChangeRowsPerPage} /> - ); diff --git a/src/theme/ThemeRegistry.tsx b/src/theme/ThemeRegistry.tsx index 1c3f593..3765675 100644 --- a/src/theme/ThemeRegistry.tsx +++ b/src/theme/ThemeRegistry.tsx @@ -1,19 +1,36 @@ "use client"; import * as React from "react"; -import { ThemeProvider } from "@mui/material/styles"; +import { ThemeProvider, createTheme } from "@mui/material/styles"; import CssBaseline from "@mui/material/CssBaseline"; import NextAppDirEmotionCacheProvider from "./EmotionCache"; import theme from "./devias-material-kit"; +import { zhHK, enUS } from "@mui/material/locale"; + +const getLocalizationFromLang = (lang: string) => { + switch (lang) { + case "zh": + return zhHK; + default: + return enUS; + } +}; // Copied from https://github.com/mui/material-ui/blob/master/examples/material-ui-nextjs-ts/src/components/ThemeRegistry/ThemeRegistry.tsx export default function ThemeRegistry({ children, + lang, }: { children: React.ReactNode; + lang: string; }) { + const themeWithLocale = React.useMemo( + () => createTheme(theme, getLocalizationFromLang(lang)), + [lang], + ); + return ( - + {children}