diff --git a/.cspell.json b/.cspell.json index 22705a27..0b130d14 100644 --- a/.cspell.json +++ b/.cspell.json @@ -4,20 +4,22 @@ "words": [ "autoincrement", "bunx", + "chrono", "coursemate", + "daisyui", "datasource", "direnv", "ECCS", "isready", "lockb", + "mytheme", "notistack", "psql", "qiita", + "reqwest", "safify", "supabase", - "swiper", - "reqwest", - "chrono" + "swiper" ], "dictionaries": [ "softwareTerms", diff --git a/biome.json b/biome.json index 6381c36c..ff3fe524 100644 --- a/biome.json +++ b/biome.json @@ -4,6 +4,13 @@ "indentStyle": "space", "indentWidth": 2 }, + "linter": { + "rules": { + "nursery": { + "useSortedClasses": "warn" + } + } + }, "vcs": { "enabled": true, "clientKind": "git", diff --git a/web/app/chat/layout.tsx b/web/app/chat/layout.tsx index 49f79339..c40e4153 100644 --- a/web/app/chat/layout.tsx +++ b/web/app/chat/layout.tsx @@ -1,6 +1,6 @@ -import { Box } from "@mui/material"; import BottomBar from "~/components/BottomBar"; import Header from "~/components/Header"; +import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; export default function ChatPageLayout({ children, @@ -8,24 +8,12 @@ export default function ChatPageLayout({ children: React.ReactNode; }) { return ( - <> +
- +
{children} - +
- + ); } diff --git a/web/app/chat/page.tsx b/web/app/chat/page.tsx index 09c0b7c7..8546f988 100644 --- a/web/app/chat/page.tsx +++ b/web/app/chat/page.tsx @@ -7,7 +7,6 @@ import { useRoomsOverview } from "~/api/chat/hooks"; import RoomList from "~/components/chat/RoomList"; import { RoomWindow } from "~/components/chat/RoomWindow"; import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress"; -import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; function ChatListContent() { const searchParams = useSearchParams(); @@ -32,10 +31,8 @@ function ChatListContent() { export default function Chat() { return ( - - }> - - - + }> + + ); } diff --git a/web/app/edit/courses/page.tsx b/web/app/edit/courses/page.tsx index b4b9b9b2..e55e6ec7 100644 --- a/web/app/edit/courses/page.tsx +++ b/web/app/edit/courses/page.tsx @@ -1,10 +1,8 @@ "use client"; -import { Box, Button, Typography } from "@mui/material"; import Link from "next/link"; import { useAboutMe } from "~/api/user"; import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress"; -import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import EditableCoursesTable from "~/components/course/EditableCoursesTable"; export default function EditCourses() { @@ -14,65 +12,27 @@ export default function EditCourses() { const error = state.current === "error" ? state.error : null; return ( - - - - 授業編集 - - {loading ? ( - - ) : error ? ( -

Error: {error.message}

- ) : data ? ( - <> - - - ) : ( -

データがありません。

- )} - - - - - -
-
+
+

授業編集

+ {loading ? ( + + ) : error ? ( +

Error: {error.message}

+ ) : data ? ( + <> + + + ) : ( +

データがありません。

+ )} +
+ + 設定画面に戻る + + + プロフィール編集へ + +
+
); } diff --git a/web/app/edit/layout.tsx b/web/app/edit/layout.tsx index 7a6df71e..bc1ad10f 100644 --- a/web/app/edit/layout.tsx +++ b/web/app/edit/layout.tsx @@ -1,5 +1,5 @@ -import { Box } from "@mui/material"; import Header from "~/components/Header"; +import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; export default function EditPageLayout({ children, @@ -7,23 +7,11 @@ export default function EditPageLayout({ children: React.ReactNode; }) { return ( - <> +
- +
{children} - - +
+ ); } diff --git a/web/app/edit/profile/page.tsx b/web/app/edit/profile/page.tsx index 2e0f34e1..55e20763 100644 --- a/web/app/edit/profile/page.tsx +++ b/web/app/edit/profile/page.tsx @@ -3,7 +3,6 @@ import EditIcon from "@mui/icons-material/Edit"; import { Box, - Button, FormControl, IconButton, InputLabel, @@ -21,7 +20,6 @@ import { facultiesAndDepartments } from "~/app/signup/data"; import type { UpdateUser } from "~/common/types"; import { UpdateUserSchema } from "~/common/zod/schemas"; import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress"; -import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import { useAlert } from "~/components/common/alert/AlertProvider"; import PhotoModal from "~/components/config/PhotoModal"; import { PhotoPreviewButton } from "~/components/config/PhotoPreview"; @@ -222,331 +220,321 @@ export default function EditProfile() { }; return ( - - - {loading ? ( - - ) : error ? ( -

Error: {error.message}

- ) : data ? ( - - - プロフィール編集 - - - - setTmpName(e.target.value)} - label="名前" - disabled={!isEditingName} - fullWidth - error={!!nameError} - helperText={nameError} - autoComplete="off" - /> - { - if (isEditingName) { - setName(tmpName); - handleSave({ name: tmpName }); - setIsEditingName(false); - } else { - handleEdit(setIsEditingName); - } - }} - > - {isEditingName ? ( - 保存 - ) : ( - - )} - - - - - - - 性別 - - {genderError && ( - - {genderError} - + + {loading ? ( + + ) : error ? ( +

Error: {error.message}

+ ) : data ? ( + + + プロフィール編集 + + + + setTmpName(e.target.value)} + label="名前" + disabled={!isEditingName} + fullWidth + error={!!nameError} + helperText={nameError} + autoComplete="off" + /> + { + if (isEditingName) { + setName(tmpName); + handleSave({ name: tmpName }); + setIsEditingName(false); + } else { + handleEdit(setIsEditingName); + } + }} + > + {isEditingName ? ( + 保存 + ) : ( + )} - { - if (isEditingGender) { - setGender(tmpGender); - handleSave({ gender: tmpGender }); - setIsEditingGender(false); - } else { - handleEdit(setIsEditingGender); - } - }} - > - {isEditingGender ? ( - 保存 - ) : ( - - )} - - - + + +
- - - 学年 - - {gradeError && ( - - {gradeError} - + + + 性別 + + {genderError && ( + + {genderError} + + )} + { + if (isEditingGender) { + setGender(tmpGender); + handleSave({ gender: tmpGender }); + setIsEditingGender(false); + } else { + handleEdit(setIsEditingGender); + } + }} + > + {isEditingGender ? ( + 保存 + ) : ( + )} - { - if (isEditingGrade) { - setGrade(tmpGrade); - handleSave({ grade: tmpGrade }); - setIsEditingGrade(false); - } else { - handleEdit(setIsEditingGrade); - } - }} - > - {isEditingGrade ? ( - 保存 - ) : ( - - )} - - - + + + - - - 学部 - - {facultyError && ( - - {facultyError} - + + + 学年 + + {gradeError && ( + + {gradeError} + + )} + { + if (isEditingGrade) { + setGrade(tmpGrade); + handleSave({ grade: tmpGrade }); + setIsEditingGrade(false); + } else { + handleEdit(setIsEditingGrade); + } + }} + > + {isEditingGrade ? ( + 保存 + ) : ( + )} + + + - { - if (isEditingFaculty) { - setDepartment(""); - setFaculty(tmpFaculty); - handleSave({ faculty: tmpFaculty, department: "" }); - setIsEditingFaculty(false); - } else { - handleEdit(setIsEditingFaculty); - } - }} - > - {isEditingFaculty ? ( - 保存 - ) : ( - - )} - - - + + + 学部 + + {facultyError && ( + + {facultyError} + + )} - - - 学科 - - {departmentError && ( - - {departmentError} - + { + if (isEditingFaculty) { + setDepartment(""); + setFaculty(tmpFaculty); + handleSave({ faculty: tmpFaculty, department: "" }); + setIsEditingFaculty(false); + } else { + handleEdit(setIsEditingFaculty); + } + }} + > + {isEditingFaculty ? ( + 保存 + ) : ( + )} + + + - { - if (isEditingDepartment) { - setDepartment(tmpDepartment); - handleSave({ department: tmpDepartment }); - setIsEditingDepartment(false); - } else { - handleEdit(setIsEditingDepartment); - } - }} - > - {isEditingDepartment ? ( - 保存 - ) : ( - - )} - - - + + + 学科 + + {departmentError && ( + + {departmentError} + + )} - - - setTmpIntro(e.target.value)} - label="自己紹介" - disabled={!isEditingIntro} - fullWidth - autoComplete="off" - error={!!introError} // エラースタイル適用 - helperText={introError} // エラーメッセージを表示 - /> + { + if (isEditingDepartment) { + setDepartment(tmpDepartment); + handleSave({ department: tmpDepartment }); + setIsEditingDepartment(false); + } else { + handleEdit(setIsEditingDepartment); + } + }} + > + {isEditingDepartment ? ( + 保存 + ) : ( + + )} + + + - { - if (isEditingIntro) { - setIntro(tmpIntro); - handleSave({ intro: tmpIntro }); - setIsEditingIntro(false); - } else { - handleEdit(setIsEditingIntro); - } - }} - > - {isEditingIntro ? ( - 保存 - ) : ( - - )} - - - - {errorMessage && ( - - {errorMessage} - - )} + + + setTmpIntro(e.target.value)} + label="自己紹介" + disabled={!isEditingIntro} + fullWidth + autoComplete="off" + error={!!introError} // エラースタイル適用 + helperText={introError} // エラーメッセージを表示 + /> -
-
- - プロフィール画像 - -
-
{ + if (isEditingIntro) { + setIntro(tmpIntro); + handleSave({ intro: tmpIntro }); + setIsEditingIntro(false); + } else { + handleEdit(setIsEditingIntro); + } }} > -
- -
- setOpen(true)} - /> - setOpen(false)} - afterUpload={afterPhotoUpload} - onError={onPhotoError} + {isEditingIntro ? ( + 保存 + ) : ( + + )} + + + + {errorMessage && ( + + {errorMessage} + + )} + +
+
+ + プロフィール画像 + +
+
+
+
+ setOpen(true)} + /> + setOpen(false)} + afterUpload={afterPhotoUpload} + onError={onPhotoError} + />
+
- + - - + 設定画面に戻る + + - ) : ( -

データがありません。

- )} - - + + ) : ( +

データがありません。

+ )} + ); } diff --git a/web/app/faq/page.tsx b/web/app/faq/page.tsx index 16184255..a6d422fb 100644 --- a/web/app/faq/page.tsx +++ b/web/app/faq/page.tsx @@ -1,96 +1,47 @@ "use client"; -import { ArrowBack } from "@mui/icons-material"; -import { Box, IconButton, Typography } from "@mui/material"; -import { useRouter } from "next/navigation"; import Header from "~/components/Header"; +import TopNavigation from "~/components/common/TopNavigation"; export default function FAQ() { - const router = useRouter(); - return ( - + <>
- router.back()} - > - - - - - - よくある質問 - - - - Q: 東大生以外も利用できますか? -
- A: - 本サービスは東大生のみを対象としています。それゆえ、ECCSアカウントによるログインが必須です。他のGoogleアカウントではログインできません。 -
- - - Q: 授業登録機能はすべての学部に対応していますか? -
- A: - 本サービスの授業登録機能は前期教養学部のみに対応しており、今のところ後期学部には対応しておりません。 -
- - - Q: 収集された個人情報はどのように利用されますか? -
- A: - 収集した個人情報は、サインインおよびサービス提供の目的にのみ使用され、他の目的には使用されません。 -
- - - Q: 東大公式のアプリですか? -
- A: - 本サービスはut.code();によって運営されており、東京大学は運営に関与しておりません -
-
- +
+
+ +
+

+ {/* TODO: この辺の構造を直す */} + Q: 東大生以外も利用できますか? +
+ A: + 本サービスは東大生のみを対象としています。それゆえ、ECCSアカウントによるログインが必須です。他のGoogleアカウントではログインできません。 +

+ +

+ Q: 授業登録機能はすべての学部に対応していますか? +
+ A: + 本サービスの授業登録機能は前期教養学部のみに対応しており、今のところ後期学部には対応しておりません。 +

+ +

+ Q: 収集された個人情報はどのように利用されますか? +
+ A: + 収集した個人情報は、サインインおよびサービス提供の目的にのみ使用され、他の目的には使用されません。 +

+ +

+ Q: 東大公式のアプリですか? +
+ A: + 本サービスはut.code();によって運営されており、東京大学は運営に関与しておりません +

+
+
+
+ ); } diff --git a/web/app/friends/layout.tsx b/web/app/friends/layout.tsx index a471c311..735f5e62 100644 --- a/web/app/friends/layout.tsx +++ b/web/app/friends/layout.tsx @@ -1,4 +1,3 @@ -import { Box } from "@mui/material"; import BottomBar from "~/components/BottomBar"; import Header from "~/components/Header"; @@ -10,21 +9,9 @@ export default function FriendsPageLayout({ return ( <>
- +
{children} - +
); diff --git a/web/app/friends/page.tsx b/web/app/friends/page.tsx index 18817fcb..c9461704 100644 --- a/web/app/friends/page.tsx +++ b/web/app/friends/page.tsx @@ -1,6 +1,6 @@ "use client"; -import { Box, Tab, Tabs } from "@mui/material"; +import { Tab, Tabs } from "@mui/material"; import { useState } from "react"; import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import Matchings from "~/components/match/matching"; @@ -15,34 +15,17 @@ export default function Friends() { return ( - +
- - +
+
{open === 0 ? : open === 1 ? : null} - +
); } @@ -60,7 +43,7 @@ function TabPanel({ id={`tabpanel-${open}`} aria-labelledby={`tab-${open}`} > - {children} +
{children}
); } diff --git a/web/app/globals.css b/web/app/globals.css new file mode 100644 index 00000000..c9334c97 --- /dev/null +++ b/web/app/globals.css @@ -0,0 +1,13 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +.icon-image-preview { + /* TODO: make it flexible */ + max-width: 450px; + max-height: 450px; +} + +.cm-li-btn { + @apply no-animation h-auto w-full justify-start rounded-none border-none bg-white px-4 py-4 text-left font-normal text-base shadow-none hover:bg-zinc-100 focus:bg-zinc-300; +} diff --git a/web/app/index.css b/web/app/index.css deleted file mode 100644 index c29a91ee..00000000 --- a/web/app/index.css +++ /dev/null @@ -1,5 +0,0 @@ -.icon-image-preview { - /* TODO: make it flexible */ - max-width: 450px; - max-height: 450px; -} diff --git a/web/app/layout.tsx b/web/app/layout.tsx index cb24e25a..8c7ac0a6 100644 --- a/web/app/layout.tsx +++ b/web/app/layout.tsx @@ -3,7 +3,7 @@ import { CssBaseline, ThemeProvider, createTheme } from "@mui/material"; import { SnackbarProvider } from "notistack"; import React from "react"; -import "./index.css"; +import "./globals.css"; import "@fontsource/roboto/300.css"; import "@fontsource/roboto/400.css"; import "@fontsource/roboto/500.css"; diff --git a/web/app/settings/aboutUs/page.tsx b/web/app/settings/aboutUs/page.tsx index e742e407..97293496 100644 --- a/web/app/settings/aboutUs/page.tsx +++ b/web/app/settings/aboutUs/page.tsx @@ -1,126 +1,81 @@ -import { GitHub, Language } from "@mui/icons-material"; -import XIcon from "@mui/icons-material/X"; -import { Box, Link, Typography } from "@mui/material"; +import { FaGithub, FaXTwitter } from "react-icons/fa6"; +import { MdLanguage } from "react-icons/md"; import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import TopNavigation from "~/components/common/TopNavigation"; export default function AboutUs() { return ( - +
- - +
+

CourseMateについて - - +

+
大学の授業を受けている際に、一緒に受ける友達がいなくて困ったことはありませんか? 「友達がいないから授業をサボるようになってしまった」、「過去問を共有してくれる人がいない」 などの東大生の悩みを解決したいと思い、CourseMateは開発されました。CourseMateを使うことで みなさまの大学生活がより良くなれば幸いです。ぜひ知り合いの方々に広めていただければと思っています。 - - - - + - +

ut.code();について - - +

+
ut.code();は、2019年設立の東京大学のソフトウェアエンジニアリングコミュニティです。 「学習」、「交流」、「開発」の三つを活動の軸としており、さまざまなアプリを開発しています。 - - - - + +
+
); } diff --git a/web/app/settings/contact/page.tsx b/web/app/settings/contact/page.tsx index 1481d5ac..1b9b1b71 100644 --- a/web/app/settings/contact/page.tsx +++ b/web/app/settings/contact/page.tsx @@ -1,45 +1,25 @@ -import { Box, Button, Typography } from "@mui/material"; import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import TopNavigation from "~/components/common/TopNavigation"; export default function Contact() { return ( - +
- - +
+

ご利用いただきありがとうございます。サービスに関するご意見やバグ報告がございましたら、以下のリンクからお問い合わせください。皆様のフィードバックは、サービスの改善に役立てさせていただきます。 - - - - - + +

+
); } diff --git a/web/app/settings/delete/page.tsx b/web/app/settings/delete/page.tsx index 233be5a4..c32b7ea4 100644 --- a/web/app/settings/delete/page.tsx +++ b/web/app/settings/delete/page.tsx @@ -1,12 +1,10 @@ "use client"; -import { ArrowBack } from "@mui/icons-material"; -import { Box, Button, IconButton, Typography } from "@mui/material"; -import Link from "next/link"; import { useRouter } from "next/navigation"; import { useSnackbar } from "notistack"; import { useCallback } from "react"; import { deleteAccount } from "~/api/user"; +import TopNavigation from "~/components/common/TopNavigation"; import { useAlert } from "~/components/common/alert/AlertProvider"; export default function DeleteAccount() { @@ -36,59 +34,22 @@ export default function DeleteAccount() { }, [showAlert, enqueueSnackbar, router.push]); return ( - - - - - - - - アカウント削除 - - - +
+ +
+

アカウントを削除した場合、マッチングやチャットに関する情報の一切が削除されます。 - - - - - +

+
+ +
+
+
); } diff --git a/web/app/settings/disclaimer/page.tsx b/web/app/settings/disclaimer/page.tsx index 053d2372..1c18f180 100644 --- a/web/app/settings/disclaimer/page.tsx +++ b/web/app/settings/disclaimer/page.tsx @@ -1,59 +1,29 @@ -import { Box, Typography } from "@mui/material"; import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; import TopNavigation from "~/components/common/TopNavigation"; export default function Disclaimer() { return ( - +
- - +
+

本サービスはut.code();によって運営されており、東京大学は運営に関与しておりません。本サービスは東大生のみを対象としており、ECCSアカウントによるログインが必須です。 - +

- +

本サービスの機能の利用に伴ういかなるトラブルや損害について、ut.code();は一切の責任を負いかねます。利用者の自己責任においてご利用ください。 - +

- +

本サービスで収集した個人情報は、サインインおよびサービス提供の目的にのみ使用され、他の目的には使用されません。 - +

- +

本サービスを通じて他の利用者と接触した際のトラブルや、マッチングを通じて生じた問題等に関しても、ut.code();は責任を負いません。ご理解とご協力をお願いいたします。 - - - +

+
+
); } diff --git a/web/app/settings/layout.tsx b/web/app/settings/layout.tsx index a32f0987..1fc99689 100644 --- a/web/app/settings/layout.tsx +++ b/web/app/settings/layout.tsx @@ -1,4 +1,3 @@ -import { Box } from "@mui/material"; import BottomBar from "~/components/BottomBar"; import Header from "~/components/Header"; @@ -10,21 +9,9 @@ export default function SettingsPageLayout({ return ( <>
- +
{children} - +
); diff --git a/web/app/settings/page.tsx b/web/app/settings/page.tsx index 1fb8a79e..abf97e34 100644 --- a/web/app/settings/page.tsx +++ b/web/app/settings/page.tsx @@ -1,10 +1,3 @@ -import { - Box, - Divider, - List, - ListItemButton, - ListItemText, -} from "@mui/material"; import Link from "next/link"; import LogOutButton from "~/components/LogOutButton"; import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; @@ -12,47 +5,56 @@ import { NavigateByAuthState } from "~/components/common/NavigateByAuthState"; export default function Settings() { return ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
+
    +
  • + + あなたのカード + +
  • +
    +
  • + + CourseMateの使い方 + +
  • +
    +
  • + + お問い合わせ + +
  • +
    +
  • + + よくある質問 + +
  • +
    +
  • + + About Us + +
  • +
    +
  • + + 免責事項 + +
  • +
    +
  • + + アカウント削除 + +
  • +
    +
  • + +
  • +
    +
+
); } diff --git a/web/app/settings/profile/page.tsx b/web/app/settings/profile/page.tsx index 9475bc9e..f86d993a 100644 --- a/web/app/settings/profile/page.tsx +++ b/web/app/settings/profile/page.tsx @@ -1,9 +1,8 @@ "use client"; -import EditIcon from "@mui/icons-material/Edit"; -import { Box, Button, Typography } from "@mui/material"; import Link from "next/link"; import { useState } from "react"; +import { MdEdit } from "react-icons/md"; import { useAboutMe } from "~/api/user"; import { Card } from "~/components/Card"; import FullScreenCircularProgress from "~/components/common/FullScreenCircularProgress"; @@ -22,50 +21,30 @@ export default function SettingsProfile() { {loading ? ( ) : error ? ( - Error: {error.message} +

エラーが発生しました。{error.message}

) : !data ? ( - データがありません。 +

データがありません。

) : ( - +
- - - - + +
setBack(back)} /> -
-
+
+
)}
); diff --git a/web/app/signup/common.tsx b/web/app/signup/common.tsx index 84a07e82..c4cdbe32 100644 --- a/web/app/signup/common.tsx +++ b/web/app/signup/common.tsx @@ -1,4 +1,3 @@ -import { Button } from "@mui/material"; export type Caller = "registration" | "configMenu"; export type StepProps = { onSave: (t: T) => void; @@ -20,17 +19,12 @@ export function NextButton({ children: string; }) { return ( - + ); } diff --git a/web/app/signup/steps/step1_profile.tsx b/web/app/signup/steps/step1_profile.tsx index 8314232d..f275c829 100644 --- a/web/app/signup/steps/step1_profile.tsx +++ b/web/app/signup/steps/step1_profile.tsx @@ -2,7 +2,6 @@ import { useState } from "react"; import { Box, - Button, FormControl, InputLabel, MenuItem, @@ -164,9 +163,9 @@ export default function Step1({ onSave, prev, caller }: StepProps) { }} > - + ); diff --git a/web/app/signup/steps/step2_img.tsx b/web/app/signup/steps/step2_img.tsx index 621685ac..d9be0c99 100644 --- a/web/app/signup/steps/step2_img.tsx +++ b/web/app/signup/steps/step2_img.tsx @@ -1,4 +1,4 @@ -import { Box, Button, Typography } from "@mui/material"; +import { Box, Typography } from "@mui/material"; import { enqueueSnackbar } from "notistack"; import { useCallback, useState } from "react"; import type { BackProp, StepProps } from "~/app/signup/common"; @@ -82,12 +82,12 @@ export default function Step2({ width: "100%", }} > - - + + ); diff --git a/web/app/signup/steps/step3_confirmation.tsx b/web/app/signup/steps/step3_confirmation.tsx index a1ad70a7..7a4032e6 100644 --- a/web/app/signup/steps/step3_confirmation.tsx +++ b/web/app/signup/steps/step3_confirmation.tsx @@ -1,4 +1,4 @@ -import { Box, Button, Typography } from "@mui/material"; +import { Box, Typography } from "@mui/material"; import type { BackProp, StepProps } from "~/app/signup/common"; import type { Step1User } from "~/common/zod/types"; import UserAvatar from "~/components/human/avatar"; @@ -69,12 +69,16 @@ export default function Confirmation({ width: "100%", }} > - - + + ); diff --git a/web/app/signup/steps/step4_course.tsx b/web/app/signup/steps/step4_course.tsx index f9d738a4..a8c24d91 100644 --- a/web/app/signup/steps/step4_course.tsx +++ b/web/app/signup/steps/step4_course.tsx @@ -1,4 +1,4 @@ -import { Button, Typography } from "@mui/material"; +import { Typography } from "@mui/material"; import { Box } from "@mui/system"; import Link from "next/link"; import { useMyID } from "~/api/user"; @@ -36,9 +36,9 @@ export default function Step4() { }} > - + ); diff --git a/web/app/tutorial/page.tsx b/web/app/tutorial/page.tsx index 26c0eecb..bf0c6491 100644 --- a/web/app/tutorial/page.tsx +++ b/web/app/tutorial/page.tsx @@ -1,6 +1,6 @@ "use client"; -import { Box, Button, Typography } from "@mui/material"; +import { Box, Typography } from "@mui/material"; import { Navigation, Pagination } from "swiper/modules"; import { Swiper, SwiperSlide } from "swiper/react"; import "swiper/css"; @@ -99,15 +99,9 @@ export default function Tutorial() { ))} - + diff --git a/web/bun.lockb b/web/bun.lockb index fd54ff76..120c913d 100755 Binary files a/web/bun.lockb and b/web/bun.lockb differ diff --git a/web/components/BottomBar.tsx b/web/components/BottomBar.tsx index 84153585..c9aa6c6e 100644 --- a/web/components/BottomBar.tsx +++ b/web/components/BottomBar.tsx @@ -58,7 +58,7 @@ export default function BottomBar(props: Props) { } diff --git a/web/components/LogOutButton.tsx b/web/components/LogOutButton.tsx index 0bff3fc9..01805940 100644 --- a/web/components/LogOutButton.tsx +++ b/web/components/LogOutButton.tsx @@ -1,6 +1,5 @@ "use client"; -import { ListItemButton, ListItemText } from "@mui/material"; import { signOut } from "firebase/auth"; import { useRouter } from "next/navigation"; import { useSnackbar } from "notistack"; @@ -36,8 +35,12 @@ export default function LogOutButton() { }, [showAlert, signOutUser]); return ( - - - + ); } diff --git a/web/components/about.tsx b/web/components/about.tsx deleted file mode 100644 index d6fdc8fc..00000000 --- a/web/components/about.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import { GitHub, Language } from "@mui/icons-material"; -import XIcon from "@mui/icons-material/X"; -import { Button, Link } from "@mui/material"; - -export function About() { - return ( - <> - {/* FAQ comes here*/} -

Contact

- -

About Us

-

- ut.code(); - は、2019年設立の東京大学のソフトウェアエンジニアリングコミュニティです。 -

-

-

- - ウェブサイト - -

-

- - ut.code(); の GitHub - -

-

- - X (旧 Twitter) - -

-

- - ); -} diff --git a/web/components/common/FullScreenCircularProgress.tsx b/web/components/common/FullScreenCircularProgress.tsx index 4a6738ea..dd2241a0 100644 --- a/web/components/common/FullScreenCircularProgress.tsx +++ b/web/components/common/FullScreenCircularProgress.tsx @@ -1,16 +1,7 @@ -import { Box, CircularProgress } from "@mui/material"; - export default function FullScreenCircularProgress() { return ( - - - +
+ +
); } diff --git a/web/components/common/alert/AlertProvider.tsx b/web/components/common/alert/AlertProvider.tsx index 63c944f8..cf7a0201 100644 --- a/web/components/common/alert/AlertProvider.tsx +++ b/web/components/common/alert/AlertProvider.tsx @@ -1,13 +1,5 @@ "use client"; -import { - Button, - Dialog, - DialogActions, - DialogContent, - DialogContentText, - DialogTitle, -} from "@mui/material"; import { type ReactNode, createContext, useContext, useState } from "react"; export type Alert = { @@ -49,27 +41,34 @@ export const AlertProvider = ({ children }: AlertProviderProps) => { {children} {alertProps && ( - - - {alertProps.AlertMessage} - - - - {alertProps.subAlertMessage} - - - - - - - +
+

{alertProps.AlertMessage}

+

{alertProps.subAlertMessage}

+
+
+
+ + +
+
+
+
+ )}
); diff --git a/web/components/human/humanListItem.tsx b/web/components/human/humanListItem.tsx index 2bcb0e84..bf2a6dae 100644 --- a/web/components/human/humanListItem.tsx +++ b/web/components/human/humanListItem.tsx @@ -1,11 +1,3 @@ -import { - Box, - Button, - ListItem, - ListItemAvatar, - Stack, - Typography, -} from "@mui/material"; import UserAvatar from "./avatar"; import Dots from "../common/Dots"; @@ -49,70 +41,30 @@ export function HumanListItem(props: HumanListItemProps) { }; return ( - - {onAccept && } - {onReject && } - {onCancel && } - - } - sx={{ - pr: 2, - }} - > - +
+

{name}

+ {rollUpName && ( +

+ {lastMessage} +

+ )} +
+
+ + + + {/* TODO: button の中に移す */} {hasDots && ( - +
- +
+ )} + + ); +} + +function ActionMenu({ + onAccept, + onReject, + onCancel, + id, +}: { + onAccept?: (id: number) => void; + onReject?: (id: number) => void; + onCancel?: (id: number) => void; + id: number; +}) { + return ( +
+ {onAccept && ( + + )} + {onReject && ( + + )} + {onCancel && ( + )} - +
); } diff --git a/web/package.json b/web/package.json index 7f6c22ea..2b2576cd 100644 --- a/web/package.json +++ b/web/package.json @@ -22,6 +22,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-easy-crop": "^5.0.8", + "react-icons": "^5.3.0", "socket.io-client": "^4.7.5", "swiper": "^11.1.14", "zod": "^3.23.8" @@ -30,8 +31,12 @@ "@types/css-modules": "^1.0.5", "@types/react": "^18.2.66", "@types/react-dom": "^18.2.22", + "autoprefixer": "^10.4.20", + "daisyui": "^4.12.14", "eslint": "^9.14.0", "globals": "^15.9.0", + "postcss": "^8.4.47", + "tailwindcss": "^3.4.14", "typescript": "^5.2.2" } } diff --git a/web/postcss.config.js b/web/postcss.config.js new file mode 100644 index 00000000..2aa7205d --- /dev/null +++ b/web/postcss.config.js @@ -0,0 +1,6 @@ +export default { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +}; diff --git a/web/tailwind.config.js b/web/tailwind.config.js new file mode 100644 index 00000000..df376d37 --- /dev/null +++ b/web/tailwind.config.js @@ -0,0 +1,27 @@ +/** @type {import('tailwindcss').Config} */ +export default { + content: ["./app/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}"], + theme: { + extend: {}, + }, + daisyui: { + themes: [ + { + mytheme: { + // available options: https://daisyui.com/docs/themes/#-4 + // optional colors: https://daisyui.com/docs/colors/#-2 + primary: "#039BE5", + "primary-content": "#FFFFFF", + secondary: "#E9F8FF", + accent: "#FFC700", + neutral: "#000000", + "base-100": "#ffffff", + + "--rounded-btn": "0.25rem", + "--rounded-box": "0.25rem", + }, + }, + ], + }, + plugins: [require("daisyui")], +};