#63

backend/app/controllers/tags_controller.rb

@@ -1,3 +1,7 @@
+require 'net/http'
+require 'uri'
+
+
 class TagsController < ApplicationController
   def index
     post_id = params[:post]
@@ -182,7 +186,8 @@ class TagsController < ApplicationController
              .find_by(id: params[:id])
     return head :not_found unless tag
 
-    render json: DeerjikistRepr.many(tag.deerjikists)
+    render json: { tag: TagRepr.base(tag),
+                   deerjikists: DeerjikistRepr.many(tag.deerjikists) }
   end
 
   def deerjikists_by_name
@@ -194,7 +199,31 @@ class TagsController < ApplicationController
              .find_by(tag_names: { name: })
     return head :not_found unless tag
 
-    render json: DeerjikistRepr.many(tag.deerjikists)
+    render json: { tag: TagRepr.base(tag),
+                   deerjikists: DeerjikistRepr.many(tag.deerjikists) }
+  end
+
+  def update_deerjikists
+    return head :unauthorized unless current_user
+    return head :forbidden unless current_user.gte_member?
+
+    tag = Tag.joins(:tag_name)
+             .includes(:tag_name, tag_name: :wiki_page)
+             .find_by(id: params[:id])
+    return head :not_found unless tag
+
+    ApplicationRecord.transaction do
+      tag.deerjikists = []
+      params[:_json].each do
+        platform = _1[:platform]
+        code = normalise_deerjikist_code(platform, _1[:code])
+        deerjikist = Deerjikist.find_or_initialize_by(platform:, code:)
+        deerjikist.tag = tag
+        deerjikist.save!
+      end
+    end
+
+    render json: DeerjikistRepr.many(tag.reload.deerjikists)
   end
 
   def materials_by_name
@@ -391,4 +420,19 @@ class TagsController < ApplicationController
       TagImplication.create!(tag:, parent_tag:)
     end
   end
+
+  def normalise_deerjikist_code platform, code
+    return code if platform != 'youtube' || code[0] != '@'
+
+    url = "https://www.youtube.com/#{ code }"
+
+    html = Net::HTTP.get(URI(url))
+
+    canonical = html[
+        /<link rel="canonical" href="https:\/\/www\.youtube\.com\/channel\/(UC[a-zA-Z0-9_-]{22})"/,
+        1]
+    return canonical if canonical
+
+    html[/"channelId":"(UC[a-zA-Z0-9_-]{22})"/, 1] || html[/\bUC[a-zA-Z0-9_-]{22}\b/]
+  end
 end

backend/app/models/tag.rb

@@ -79,6 +79,8 @@ class Tag < ApplicationRecord
 
   def material_id = materials.first&.id
 
+  def has_deerjikists = deerjikists.present?
+
   def self.tagme = find_or_create_by_tag_name!('タグ希望', category: :meta)
   def self.bot = find_or_create_by_tag_name!('bot操作', category: :meta)
   def self.no_deerjikist = find_or_create_by_tag_name!('ニジラー情報不詳', category: :meta)

backend/app/representations/tag_repr.rb

@@ -3,7 +3,7 @@
 
 module TagRepr
   BASE = { only: [:id, :category, :post_count, :created_at, :updated_at],
-           methods: [:name, :has_wiki, :material_id] }.freeze
+           methods: [:name, :has_wiki, :material_id, :has_deerjikists] }.freeze
 
   module_function
 

backend/config/routes.rb

@@ -24,6 +24,7 @@ Rails.application.routes.draw do
       patch '', action: :update
 
       get :deerjikists
+      put :deerjikists, action: :update_deerjikists
     end
   end
 

frontend/src/App.tsx

@@ -10,6 +10,7 @@ import RouteBlockerOverlay from '@/components/RouteBlockerOverlay'
 import TopNav from '@/components/TopNav'
 import { Toaster } from '@/components/ui/toaster'
 import { apiPost, isApiError } from '@/lib/api'
+import DeerjikistDetailPage from '@/pages/deerjikists/DeerjikistDetailPage'
 import MaterialBasePage from '@/pages/materials/MaterialBasePage'
 import MaterialDetailPage from '@/pages/materials/MaterialDetailPage'
 import MaterialListPage from '@/pages/materials/MaterialListPage'
@@ -58,6 +59,7 @@ const RouteTransitionWrapper = ({ user, setUser }: {
 	  <Route path="/posts/changes" element={<PostHistoryPage/>}/>
 	  <Route path="/tags" element={<TagListPage/>}/>
 	  <Route path="/tags/:id" element={<TagDetailPage/>}/>
+	  <Route path="/tags/:id/deerjikists" element={<DeerjikistDetailPage/>}/>
 	  <Route path="/tags/nico" element={<NicoTagListPage user={user}/>}/>
 	  <Route path="/tags/changes" element={<TagHistoryPage/>}/>
 	  <Route path="/theatres/:id" element={<TheatreDetailPage/>}/>

frontend/src/components/TagLink.tsx

@@ -45,9 +45,9 @@ export default (({ tag,
       <>
 	{(linkFlg && withWiki) && (
 	    <span className="mr-1">
-	      {(tag.materialId != null || tag.hasWiki)
+	      {(tag.materialId != null || tag.hasWiki || tag.hasDeerjikists)
 	       ? (
-		  tag.materialId == null
+		  tag.materialId == null && !(tag.hasDeerjikists)
 		  ? (
 		      <PrefetchLink
 			  to={`/wiki/${ encodeURIComponent (tag.name) }`}
@@ -55,11 +55,19 @@ export default (({ tag,
 			?
 		      </PrefetchLink>)
 		  : (
-		      <PrefetchLink
+		      tag.hasWiki
-			  to={`/materials/${ tag.materialId }`}
+		      ? (
-			  className={linkClass}>
+			  <PrefetchLink
-			?
+			      to={`/materials/${ tag.materialId }`}
-		      </PrefetchLink>))
+			      className={linkClass}>
+			    ?
+			  </PrefetchLink>)
+		      : (
+			  <PrefetchLink
+			      to={`/tags/${ tag.id }/deerjikists`}
+			      className={linkClass}>
+			    ?
+			  </PrefetchLink>)))
 	       : (
 		  ['character', 'material'].includes (tag.category)
 		  ? (
@@ -71,13 +79,23 @@ export default (({ tag,
 			!
 		      </PrefetchLink>)
 		  : (
-		      <PrefetchLink
+		      tag.category === 'deerjikist'
-			  to={`/wiki/${ encodeURIComponent (tag.name) }`}
+		      ? (
-			  className="animate-[wiki-blink_.25s_steps(2,end)_infinite]
+			  <PrefetchLink
-				     dark:animate-[wiki-blink-dark_.25s_steps(2,end)_infinite]"
+			      to={`/tags/${ tag.id }/deerjikists`}
-			  title={`${ tag.name } Wiki が存在しません．`}>
+			      className="animate-[wiki-blink_.25s_steps(2,end)_infinite]
-			!
+					 dark:animate-[wiki-blink-dark_.25s_steps(2,end)_infinite]"
-		      </PrefetchLink>))}
+			      title={`${ tag.name } に関する情報が存在しません．`}>
+			    !
+			  </PrefetchLink>)
+		      : (
+			  <PrefetchLink
+			      to={`/wiki/${ encodeURIComponent (tag.name) }`}
+			      className="animate-[wiki-blink_.25s_steps(2,end)_infinite]
+					 dark:animate-[wiki-blink-dark_.25s_steps(2,end)_infinite]"
+			      title={`${ tag.name } Wiki が存在しません．`}>
+			    !
+			  </PrefetchLink>)))}
 	    </span>)}
 	{nestLevel > 0 && (
 	    <span

frontend/src/consts.ts

@@ -1,4 +1,4 @@
-import type { Category } from 'types'
+import type { Category, Platform } from 'types'
 
 export const LIGHT_COLOUR_SHADE = 800
 export const DARK_COLOUR_SHADE = 300
@@ -31,6 +31,11 @@ export const FETCH_POSTS_ORDER_FIELDS = [
     'updated_at',
     ] as const
 
+export const PLATFORM_NAMES: Record<Platform, string> =
+    { nico: 'ニコニコ', youtube: 'YouTube' } as const
+
+export const PLATFORMS = ['nico', 'youtube'] as const
+
 export const TAG_COLOUR = {
     deerjikist: 'rose',
     meme:       'purple',

frontend/src/lib/queryKeys.ts

@@ -9,11 +9,12 @@ export const postsKeys = {
 		  ['posts', 'changes', p] as const }
 
 export const tagsKeys = {
-    root:     ['tags'] as const,
+    root:         ['tags'] as const,
-    index:    (p: FetchTagsParams) => ['tags', 'index', p] as const,
+    index:        (p: FetchTagsParams) => ['tags', 'index', p] as const,
-    show:     (name: string) => ['tags', name] as const,
+    show:         (name: string) => ['tags', name] as const,
-    changes:  (p: { id?: string; page: number; limit: number }) =>
+    changes:      (p: { id?: string; page: number; limit: number }) =>
-		  ['tags', 'changes', p] as const }
+		      ['tags', 'changes', p] as const,
+    deerjikists:  (id: string) => ['tags', 'deerjikists', id] as const }
 
 export const wikiKeys = {
     root:   ['wiki'] as const,

frontend/src/lib/tags.ts

@@ -1,6 +1,6 @@
 import { apiGet } from '@/lib/api'
 
-import type { FetchTagsParams, Tag, TagVersion } from '@/types'
+import type { Deerjikist, FetchTagsParams, Tag, TagVersion } from '@/types'
 
 
 export const fetchTags = async (
@@ -56,3 +56,9 @@ export const fetchTagChanges = async (
     versions: TagVersion[]
     count:    number }> =>
 	await apiGet ('/tags/versions', { params: { ...(id && { id }), page, limit } })
+
+
+export const fetchDeerjikistsByTag = async (
+    id: string,
+): Promise<{ tag: Tag; deerjikists: Deerjikist[]}> =>
+    await apiGet (`/tags/${ id }/deerjikists`)

frontend/src/pages/deerjikists/DeerjikistDetailPage.tsx

@@ -0,0 +1,155 @@
+import { useQuery, useQueryClient } from '@tanstack/react-query'
+import { useEffect, useState } from 'react'
+import { useParams } from 'react-router-dom'
+
+import TagLink from '@/components/TagLink'
+import Label from '@/components/common/Label'
+import PageTitle from '@/components/common/PageTitle'
+import MainArea from '@/components/layout/MainArea'
+import { toast } from '@/components/ui/use-toast'
+import { PLATFORM_NAMES, PLATFORMS } from '@/consts'
+import { apiPut } from '@/lib/api'
+import { tagsKeys } from '@/lib/queryKeys'
+import { fetchDeerjikistsByTag } from '@/lib/tags'
+import { cn } from '@/lib/utils'
+
+import type { FC, FormEvent } from 'react'
+
+import type { Deerjikist, Platform } from '@/types'
+
+
+export default (() => {
+  const { id } = useParams ()
+  const tagId = String (id ?? '')
+  const tagKey = tagsKeys.deerjikists (tagId)
+
+  const { data: qData, isLoading: loading } =
+      useQuery ({ queryKey: tagKey, queryFn: () => fetchDeerjikistsByTag (tagId) })
+  const tag = qData?.tag
+  const deerjikists = qData?.deerjikists ?? []
+
+  const [data, setData] =
+      useState<(Omit<Deerjikist, 'platform'> & { platform: Platform | null })[]> ([])
+  const [disabled, setDisabled] = useState (true)
+
+  const qc = useQueryClient ()
+
+  const handleSubmit = async (e: FormEvent) => {
+    e.preventDefault ()
+
+    try
+    {
+      setDisabled (true)
+
+      setData (await apiPut<Deerjikist[]> (`/tags/${ id }/deerjikists`, data))
+      qc.invalidateQueries ({ queryKey: tagsKeys.root })
+
+      toast ({ description: '更新しました．' })
+    }
+    catch
+    {
+      toast ({ title: '更新失敗', description: '入力内容を確認してください．' })
+    }
+    finally
+    {
+      setDisabled (false)
+    }
+  }
+
+  useEffect (() => {
+    if (!(tag))
+      {
+	setDisabled (true)
+	return
+      }
+
+    setData (deerjikists)
+    setDisabled (false)
+  }, [deerjikists])
+
+  return (
+      <MainArea>
+	{(loading || !(tag)) ? 'Loading...' : (
+	    <div className="max-w-xl">
+	      <PageTitle>
+		<TagLink tag={tag} withWiki={false} withCount={false}/>
+	      </PageTitle>
+
+	      <form onSubmit={handleSubmit} className="my-4 space-y-2">
+		{data.map ((datum, i) => (
+		    <fieldset key={i} className="min-w-0 rounded-lg border border-gray-300
+						 dark:border-gray-700 p-4">
+		      <legend className="px-2 text-sm font-semibold text-gray-700
+					 dark:text-gray-300">
+			<button
+			    type="button"
+			    disabled={disabled}
+			    onClick={() => setData (prev => [...prev.slice (0, i),
+							     ...prev.slice (i + 1)])}>
+			  #{i + 1}
+			</button>
+		      </legend>
+
+		      {/* プラットフォーム */}
+		      <div>
+			<Label>プラットフォーム</Label>
+			<select
+			    className="w-full border p-2 rounded"
+			    disabled={disabled}
+			    value={datum.platform ?? ''}
+			    onChange={e => setData (prev => {
+			      const rtn = [...prev]
+			      rtn[i] = { ...rtn[i],
+					 platform: (e.target.value || null) as Platform | null }
+			      return rtn
+			    })}>
+			  <option value="">&nbsp;</option>
+			  {PLATFORMS.map (p => (
+			      <option key={p} value={p}>
+				{PLATFORM_NAMES[p]}
+			      </option>))}
+			</select>
+		      </div>
+
+		      {/* コード */}
+		      <div>
+			<Label>コード</Label>
+			<input
+			    type="text"
+			    disabled={disabled}
+			    className="w-full border p-2 rounded"
+			    value={datum.code}
+			    onChange={e => setData (prev => {
+			      const rtn = [...prev]
+			      rtn[i] = { ...rtn[i], code: e.target.value }
+			      return rtn
+			    })}/>
+		      </div>
+		    </fieldset>
+		))}
+
+		<div className="py-3">
+		  <button
+		      type="button"
+		      disabled={disabled}
+		      onClick={() => setData (prev => [...prev, { platform: null, code: '' }])}>
+		    +
+		  </button>
+		</div>
+
+		<div className="py-3">
+		  <button
+		      type="submit"
+		      disabled={disabled}
+		      className={cn ('px-4 py-2 rounded',
+				     (disabled
+				      ? 'text-gray-300 bg-gray-500'
+				      : 'text-white bg-blue-500'))}>
+		    更新
+		  </button>
+		</div>
+	      </form>
+	    </div>
+	)}
+      </MainArea>)
+}) satisfies FC

frontend/src/types.ts

@@ -1,5 +1,6 @@
 import { CATEGORIES,
 	 FETCH_POSTS_ORDER_FIELDS,
+	 PLATFORMS,
 	 USER_ROLES,
 	 ViewFlagBehavior } from '@/consts'
 
@@ -7,6 +8,8 @@ import type { ReactNode } from 'react'
 
 export type Category = typeof CATEGORIES[number]
 
+export type Deerjikist = { platform: Platform; code: string }
+
 export type FetchPostsOrder = `${ FetchPostsOrderField }:${ 'asc' | 'desc' }`
 
 export type FetchPostsOrderField = typeof FETCH_POSTS_ORDER_FIELDS[number]
@@ -114,6 +117,8 @@ export type NiconicoViewerHandle = {
     showComments: () => void
     hideComments: () => void }
 
+export type Platform = typeof PLATFORMS[number]
+
 export type Post = {
     id:                     number
     url:                    string
@@ -179,6 +184,7 @@ export type Tag = {
     updatedAt:      string
     hasWiki:        boolean
     materialId:     number
+    hasDeerjikists: boolean
     children?:      Tag[]
     matchedAlias?:  string | null }