#11

backend/app/controllers/users_controller.rb

@@ -1,16 +1,25 @@
 class UsersController < ApplicationController
-  def index
-  end
-
-  def show
-  end
-
   def create
+    user = User.create!(inheritance_code: SecureRandom.uuid, role: 'guest')
+    render json: { code: user.inheritance_code,
+                   user: user.slice(:id, :name, :inheritance_code, :role) }
   end
 
-  def update
+  def verify
+    user = User.find_by(inheritance_code: params[:code])
+    render json: if user
+                   { valid: true, user: user.slice(:id, :name, :inheritance_code, :role) }
+                 else
+                   { valid: false }
+                 end
   end
 
-  def destroy
+  def me
+    user = User.find_by(inheritance_code: params[:code])
+    render(if user
+             { json: user.slice(:id, :name, :inheritance_code, :role) }
+           else
+             { json: { error: 'not found' }, status: :not_found }
+           end)
   end
 end

backend/config/routes.rb

@@ -61,7 +61,12 @@ Rails.application.routes.draw do
   resources :tags
   resources :user_ips
   resources :user_post_views
-  resources :users
+  resources :users, only: [:create] do
+    collection do
+      post :verify
+      get :me
+    end
+  end
   resources :wiki_pages
 
   # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html

frontend/src/App.tsx

@@ -6,6 +6,8 @@ import TopNav from './components/TopNav'
 import TagSidebar from './components/TagSidebar'
 import PostPage from './pages/PostPage'
 import PostDetailPage from './pages/PostDetailPage'
+import { API_BASE_URL } from './config'
+import axios from 'axios'
 
 type Tag = { id:        number
              name:      string
@@ -17,18 +19,48 @@ type Post = { id:         number
               thumbnail:  string
               tags:       Tag[] }
 
+type User = { id:               number
+              name:             string | null
+              inheritanceCode:  string
+              role:             string }
+
 
 const App = () => {
   const [posts, setPosts] = useState<Post[]> ([])
+  const [user, setUser] = useState<User | null> (null)
 
   useEffect (() => {
+    const createUser = () => (
+        axios.post (`${ API_BASE_URL }/users`)
+        .then (res => {
+          if (res.data.code)
+            {
+              localStorage.setItem ('user_code', res.data.code)
+              setUser (res.data)
+            }
+        }))
+
+    const code = localStorage.getItem ('user_code')
+    if (code)
+      {
+        void (axios.post (`${ API_BASE_URL }/users/verify`, { code })
+              .then (res => {
+                if (res.data.valid)
+                  setUser (res.data.user)
+                else
+                  createUser ()
+              }))
+      }
+    else
+      createUser ()
+
     alert ('このサイトはまだ作りかけです!!!!\n出てけ!!!!!!!!!!!!!!!!!!!!')
   }, [])
 
   return (
       <Router>
         <div className="flex flex-col h-screen w-screen">
-          <TopNav />
+          <TopNav user={user} />
           <div className="flex flex-1">
             <TagSidebar posts={posts} setPosts={setPosts} />
             <main className="flex-1 overflow-y-auto p-4">

frontend/src/components/TopNav.tsx

@@ -1,7 +1,15 @@
 import React from "react"
 import { Link } from 'react-router-dom'
 
-const TopNav: React.FC = () => (
+type User = { id:               number
+              name:             string | null
+              inheritanceCode:  string
+              role:             string }
+
+type Props = { user: User }
+
+
+const TopNav: React.FC = ({ user }: Props) => (
     <nav className="bg-gray-800 text-white p-3 flex justify-between items-center w-full">
       <div className="flex items-center gap-4">
         <Link to="/" className="text-xl font-bold text-orange-500">ぼざクリ タグ広場</Link>
@@ -11,8 +19,9 @@ const TopNav: React.FC = () => (
         <Link to="/wiki" className="hover:text-orange-500">Wiki</Link>
       </div>
       <div className="ml-auto pr-4">
-        <Link to="/login" className="hover:text-orange-500">ログイン</Link>
+        <Link to="/setting" className="hover:text-orange-500">{user?.name || '名もなきニジラー'}</Link>
       </div>
     </nav>)
 
+
 export default TopNav