#32

frontend/src/components/TagDetailSidebar.tsx

@@ -47,7 +47,7 @@ export default ({ post }: Props) => {
       <SidebarComponent>
         <TagSearch />
         {CATEGORIES.map ((cat: Category) => cat in tags && (
-            <div className="my-3">
+            <div className="my-3" key={cat}>
               <SubsectionTitle>{categoryNames[cat]}</SubsectionTitle>
               <ul>
                 {tags[cat].map (tag => (

frontend/src/components/TagSidebar.tsx

@@ -32,18 +32,18 @@ export default ({ posts }: Props) => {
   loop:
     for (const post of posts)
       {
-        for (const tag of post.tags)
-          {
-            if (!(tag.category in tagsTmp))
-              tagsTmp[tag.category] = []
-            if (!(tagsTmp[tag.category].map (t => t.id).includes (tag.id)))
-              {
-                tagsTmp[tag.category].push (tag)
-                ++cnt
-                if (cnt >= 25)
-                  break loop
-              }
-          }
+	for (const tag of post.tags)
+	  {
+	    if (!(tag.category in tagsTmp))
+	      tagsTmp[tag.category] = []
+	    if (!(tagsTmp[tag.category].map (t => t.id).includes (tag.id)))
+	      {
+		tagsTmp[tag.category].push (tag)
+		++cnt
+		if (cnt >= 25)
+		  break loop
+	      }
+	  }
       }
     for (const cat of Object.keys (tagsTmp))
       tagsTmp[cat].sort ((tagA, tagB) => tagA.name < tagB.name ? -1 : 1)
@@ -52,40 +52,38 @@ export default ({ posts }: Props) => {
 
   return (
       <SidebarComponent>
-        <TagSearch />
-        <SectionTitle>タグ</SectionTitle>
-        <ul>
-          {CATEGORIES.map (cat => cat in tags && (
-              <>
-                {tags[cat].map (tag => (
-                    <li key={tag.id} className="mb-1">
-                      <Link to={`/posts?${ (new URLSearchParams ({ tags: tag.name })).toString () }`}>
-                        {tag.name}
-                      </Link>
-                      <span className="ml-1">{tag.postCount}</span>
-                    </li>))}
-              </>))}
-        </ul>
-        <SectionTitle>関聯</SectionTitle>
-        {posts.length && (
-            <a href="#"
-               onClick={ev => {
-                 ev.preventDefault ()
-                 void ((async () => {
-                   try
-                   {
-                     const { data } = await axios.get (`${ API_BASE_URL }/posts/random`,
-                         { params: { tags:  tagsQuery.split (' ').filter (e => e !== '').join (','),
-                                     match: (anyFlg ? 'any' : 'all') } })
-                     navigate (`/posts/${ (data as Post).id }`)
-                   }
-                   catch
-                   {
-                     ;
-                   }
-                 }) ())
-               }}>
-              ランダム
-            </a>)}
+	<TagSearch />
+	<SectionTitle>タグ</SectionTitle>
+	<ul>
+	  {CATEGORIES.flatMap (cat => cat in tags ? (
+	      tags[cat].map (tag => (
+		  <li key={tag.id} className="mb-1">
+		    <Link to={`/posts?${ (new URLSearchParams ({ tags: tag.name })).toString () }`}>
+		      {tag.name}
+		    </Link>
+		    <span className="ml-1">{tag.postCount}</span>
+		  </li>))) : [])}
+	</ul>
+	<SectionTitle>関聯</SectionTitle>
+	{posts.length && (
+	    <a href="#"
+	       onClick={ev => {
+		 ev.preventDefault ()
+		 void ((async () => {
+		   try
+		   {
+		     const { data } = await axios.get (`${ API_BASE_URL }/posts/random`,
+			 { params: { tags:  tagsQuery.split (' ').filter (e => e !== '').join (','),
+				     match: (anyFlg ? 'any' : 'all') } })
+		     navigate (`/posts/${ (data as Post).id }`)
+		   }
+		   catch
+		   {
+		     ;
+		   }
+		 }) ())
+	       }}>
+	      ランダム
+	    </a>)}
       </SidebarComponent>)
 }

frontend/src/components/users/InheritDialogue.tsx

@@ -0,0 +1,21 @@
+import { Button } from '@/components/ui/button'
+import { Dialog,
+         DialogContent,
+         DialogDescription,
+         DialogTitle,
+         DialogTrigger } from '@/components/ui/dialog'
+
+type Props = { visible:         boolean
+	       onVisibleChange: (visible: boolean) => void
+	       user:            User | null,
+	       setUser:         (user: User) => void }
+
+
+export default ({ visible, onVisibleChange, user, setUser }: Props) => {
+  return (
+      <Dialog open={visible} onOpenChange={onVisibleChange}>
+        <DialogContent className="space-y-6">
+          <DialogTitle>ほかのブラウザから引継ぐ</DialogTitle>
+	</DialogContent>
+      </Dialog>)
+}

frontend/src/components/users/UserCodeDialogue.tsx

@@ -0,0 +1,32 @@
+import { Button } from '@/components/ui/button'
+import { Dialog,
+         DialogContent,
+         DialogDescription,
+         DialogTitle,
+         DialogTrigger } from '@/components/ui/dialog'
+
+type Props = { visible:         boolean
+	       onVisibleChange: (visible: boolean) => void
+	       user:            User | null }
+
+
+export default ({ visible, onVisibleChange, user }: Props) => {
+  return (
+      <Dialog open={visible} onOpenChange={onVisibleChange}>
+        <DialogContent className="space-y-6">
+          <DialogTitle>引継ぎコード</DialogTitle>
+	  <div>
+	    <p>あなたの引継ぎコードはこちらです：</p>
+	    <div className="m-2">{user?.inheritanceCode}</div>
+	    <p className="mt-1 text-sm text-red-500">
+	      このコードはほかの人には教えないでください!
+	    </p>
+	    <div className="my-4">
+	      <Button className="px-4 py-2 bg-red-600 text-white rounded disabled:bg-gray-400">
+		引継ぎコードを変更する
+	      </Button>
+	    </div>
+	  </div>
+	</DialogContent>
+      </Dialog>)
+}