#32

frontend/src/App.tsx

@@ -12,6 +12,7 @@ import NotFound from '@/pages/NotFound'
 import PostDetailPage from '@/pages/posts/PostDetailPage'
 import PostListPage from '@/pages/posts/PostListPage'
 import PostNewPage from '@/pages/posts/PostNewPage'
+import SettingPage from '@/pages/users/SettingPage'
 import WikiDetailPage from '@/pages/wiki/WikiDetailPage'
 import WikiDiffPage from '@/pages/wiki/WikiDiffPage'
 import WikiEditPage from '@/pages/wiki/WikiEditPage'
@@ -70,6 +71,8 @@ export default () => {
                 <Route path="/wiki/:id/edit" element={<WikiEditPage />} />
                 <Route path="/wiki/:id/diff" element={<WikiDiffPage />} />
                 <Route path="/wiki/changes" element={<WikiHistoryPage />} />
+                <Route path="/users/settings" element={<SettingPage user={user} setUser={setUser} />} />
+                <Route path="/settings" element={<Navigate to="/users/settings" replace />} />
                 <Route path="*" element={<NotFound />} />
               </Routes>
             </div>

frontend/src/pages/users/SettingPage.tsx

@@ -0,0 +1,50 @@
+import { useEffect, useState } from 'react'
+import { Helmet } from 'react-helmet'
+
+import Form from '@/components/common/Form'
+import Label from '@/components/common/Label'
+import PageTitle from '@/components/common/PageTitle'
+import MainArea from '@/components/layout/MainArea'
+import { SITE_TITLE } from '@/config'
+
+import type { User } from '@/types'
+
+type Props = { user:    User
+               setUser: (user: User) => void }
+
+
+export default ({ user, setUser }: Props) => {
+  const [name, setName] = useState ('')
+
+  useEffect (() => {
+    if (!user)
+      return
+
+    setName (user?.name)
+  }, [user])
+
+  return (
+      <MainArea>
+        <Helmet>
+          <meta name="robots" content="noindex" />
+          <title>設定 | {SITE_TITLE}</title>
+        </Helmet>
+        <Form>
+          <PageTitle>設定</PageTitle>
+
+          {/* 名前 */}
+          <div>
+            <Label>表示名</Label>
+            <input type="text"
+                   className="w-full border rounded p-2"
+                   value={name}
+                   placeholder="名もなきニジラー"
+                   onChange={ev => setName (ev.target.value)} />
+            {(user && !(user.name)) && (
+                <p class="mt-1 text-sm text-red-500">
+                  名前が未設定のアカウントは 30 日間アクセスしないと削除されます!!!!
+                </p>)}
+          </div>
+        </Form>
+      </MainArea>)
+}