#268

Reviewed-on: #397
Co-authored-by: miteruzo <miteruzo@naver.com>
Co-committed-by: miteruzo <miteruzo@naver.com>

backend/db/schema.rb

@@ -72,6 +72,7 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["correct_post_id"], name: "index_gekanator_games_on_correct_post_id"
     t.index ["guessed_post_id"], name: "index_gekanator_games_on_guessed_post_id"
     t.index ["user_id"], name: "index_gekanator_games_on_user_id"
+    t.check_constraint "`question_count` >= 0", name: "chk_gekanator_games_question_count_nonnegative"
   end
 
   create_table "gekanator_question_examples", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -274,9 +275,10 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.datetime "created_at", null: false
     t.bigint "created_by_user_id"
     t.index ["created_at"], name: "index_nico_tag_versions_on_created_at"
-    t.index ["created_by_user_id", "created_at"], name: "index_nico_tag_versions_on_created_by_user_id_and_created_at"
-    t.index ["tag_id", "created_at"], name: "index_nico_tag_versions_on_tag_id_and_created_at"
+    t.index ["created_by_user_id", "created_at"], name: "index_nico_tag_versions_on_created_by_user_id_and_created_at", order: { created_at: :desc }
+    t.index ["tag_id", "created_at"], name: "index_nico_tag_versions_on_tag_id_and_created_at", order: { created_at: :desc }
     t.index ["tag_id", "version_no"], name: "index_nico_tag_versions_on_tag_id_and_version_no", unique: true
+    t.check_constraint "`version_no` > 0", name: "nico_tag_versions_version_no_positive"
   end
 
   create_table "post_implications", primary_key: ["post_id", "parent_post_id"], charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -285,13 +287,14 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.datetime "created_at", null: false
     t.datetime "updated_at", null: false
     t.index ["parent_post_id"], name: "index_post_implications_on_parent_post_id"
+    t.check_constraint "`post_id` <> `parent_post_id`", name: "chk_post_implications_no_self"
   end
 
   create_table "post_similarities", primary_key: ["post_id", "target_post_id"], charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
     t.bigint "post_id", null: false
     t.bigint "target_post_id", null: false
     t.float "cos", null: false
-    t.index ["post_id", "cos"], name: "index_post_similarities_on_post_id_and_cos"
+    t.index ["post_id", "cos"], name: "index_post_similarities_on_post_id_and_cos", order: { cos: :desc }
     t.index ["target_post_id"], name: "index_post_similarities_on_target_post_id"
   end
 
@@ -347,6 +350,8 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["post_id"], name: "index_post_versions_on_post_id"
     t.index ["video_ms", "post_id"], name: "idx_post_versions_video_ms_post_id"
     t.check_constraint "(`video_ms` is null) or (`video_ms` > 0)", name: "chk_post_versions_video_ms_positive"
+    t.check_constraint "`event_type` in (_utf8mb4'create',_utf8mb4'update',_utf8mb4'discard',_utf8mb4'restore')", name: "post_versions_event_type_valid"
+    t.check_constraint "`version_no` > 0", name: "post_versions_version_no_positive"
   end
 
   create_table "posts", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -364,6 +369,7 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["url"], name: "index_posts_on_url", unique: true
     t.index ["video_ms", "id"], name: "idx_posts_video_ms_id"
     t.check_constraint "(`video_ms` is null) or (`video_ms` > 0)", name: "chk_posts_video_ms_positive"
+    t.check_constraint "`version_no` > 0", name: "chk_posts_version_no_positive"
   end
 
   create_table "settings", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -377,6 +383,19 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["user_id"], name: "index_settings_on_user_id", unique: true
   end
 
+  create_table "wiki_assets", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
+    t.bigint "wiki_page_id", null: false
+    t.integer "no", null: false
+    t.string "alt_text"
+    t.binary "sha256", limit: 32, null: false
+    t.bigint "created_by_user_id", null: false
+    t.datetime "created_at", null: false
+    t.datetime "updated_at", null: false
+    t.index ["created_by_user_id"], name: "index_wiki_assets_on_created_by_user_id"
+    t.index ["wiki_page_id", "no"], name: "index_wiki_assets_on_wiki_page_id_and_no", unique: true
+    t.index ["wiki_page_id", "sha256"], name: "index_wiki_assets_on_wiki_page_id_and_sha256", unique: true
+  end
+
   create_table "tag_implications", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
     t.bigint "tag_id", null: false
     t.bigint "parent_tag_id", null: false
@@ -412,7 +431,7 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.bigint "tag_id", null: false
     t.bigint "target_tag_id", null: false
     t.float "cos", null: false
-    t.index ["tag_id", "cos"], name: "index_tag_similarities_on_tag_id_and_cos"
+    t.index ["tag_id", "cos"], name: "index_tag_similarities_on_tag_id_and_cos", order: { cos: :desc }
     t.index ["target_tag_id"], name: "index_tag_similarities_on_target_tag_id"
   end
 
@@ -428,9 +447,10 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.datetime "created_at", null: false
     t.bigint "created_by_user_id"
     t.index ["created_at"], name: "index_tag_versions_on_created_at"
-    t.index ["created_by_user_id", "created_at"], name: "index_tag_versions_on_created_by_user_id_and_created_at"
-    t.index ["tag_id", "created_at"], name: "index_tag_versions_on_tag_id_and_created_at"
+    t.index ["created_by_user_id", "created_at"], name: "index_tag_versions_on_created_by_user_id_and_created_at", order: { created_at: :desc }
+    t.index ["tag_id", "created_at"], name: "index_tag_versions_on_tag_id_and_created_at", order: { created_at: :desc }
     t.index ["tag_id", "version_no"], name: "index_tag_versions_on_tag_id_and_version_no", unique: true
+    t.check_constraint "`version_no` > 0", name: "tag_versions_version_no_positive"
   end
 
   create_table "tags", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -446,6 +466,7 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["discarded_at"], name: "index_tags_on_discarded_at"
     t.index ["tag_name_id"], name: "index_tags_on_tag_name_id", unique: true
     t.check_constraint "(`deprecated_at` is null) or (`category` <> _utf8mb4'nico')", name: "chk_tags_deprecated_at_not_nico"
+    t.check_constraint "`version_no` > 0", name: "chk_tags_version_no_positive"
   end
 
   create_table "theatre_comments", primary_key: ["theatre_id", "no"], charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -599,11 +620,13 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.datetime "created_at", null: false
     t.datetime "updated_at", null: false
     t.datetime "discarded_at"
+    t.integer "next_asset_no", default: 1, null: false
     t.integer "version_no", null: false
     t.index ["created_user_id"], name: "index_wiki_pages_on_created_user_id"
     t.index ["discarded_at"], name: "index_wiki_pages_on_discarded_at"
     t.index ["tag_name_id"], name: "index_wiki_pages_on_tag_name_id", unique: true
     t.index ["updated_user_id"], name: "index_wiki_pages_on_updated_user_id"
+    t.check_constraint "`version_no` > 0", name: "chk_wiki_pages_version_no_positive"
   end
 
   create_table "wiki_revision_lines", charset: "utf8mb4", collation: "utf8mb4_0900_ai_ci", force: :cascade do |t|
@@ -648,6 +671,8 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
     t.index ["created_by_user_id"], name: "index_wiki_versions_on_created_by_user_id"
     t.index ["wiki_page_id", "version_no"], name: "index_wiki_versions_on_wiki_page_id_and_version_no", unique: true
     t.index ["wiki_page_id"], name: "index_wiki_versions_on_wiki_page_id"
+    t.check_constraint "`event_type` in (_utf8mb4'create',_utf8mb4'update',_utf8mb4'discard',_utf8mb4'restore')", name: "wiki_versions_event_type_valid"
+    t.check_constraint "`version_no` > 0", name: "wiki_versions_version_no_positive"
   end
 
   add_foreign_key "active_storage_attachments", "active_storage_blobs", column: "blob_id"
@@ -729,6 +754,8 @@ ActiveRecord::Schema[8.0].define(version: 2026_07_05_000000) do
   add_foreign_key "user_post_views", "posts"
   add_foreign_key "user_post_views", "users"
   add_foreign_key "user_theme_slots", "users"
+  add_foreign_key "wiki_assets", "users", column: "created_by_user_id"
+  add_foreign_key "wiki_assets", "wiki_pages"
   add_foreign_key "wiki_pages", "tag_names"
   add_foreign_key "wiki_pages", "users", column: "created_user_id"
   add_foreign_key "wiki_pages", "users", column: "updated_user_id"

backend/spec/models/setting_spec.rb

@@ -0,0 +1,34 @@
+require 'rails_helper'
+
+RSpec.describe Setting, type: :model do
+  it 'accepts the default typed user settings' do
+    setting = described_class.new({ user: create(:user) }.merge(described_class.defaults))
+
+    expect(setting).to be_valid
+  end
+
+  it 'requires one settings row per user' do
+    user = create(:user)
+    described_class.create!({ user: }.merge(described_class.defaults))
+
+    duplicate = described_class.new({ user: }.merge(described_class.defaults))
+
+    expect(duplicate).not_to be_valid
+    expect(duplicate.errors[:user_id]).to be_present
+  end
+
+  it 'validates enum-like settings columns' do
+    setting = described_class.new(
+        { user: create(:user),
+          theme: 'neon',
+          auto_fetch_title: 'sometimes',
+          auto_fetch_thumbnail: 'sometimes',
+          wiki_editor_mode: 'sideways' })
+
+    expect(setting).not_to be_valid
+    expect(setting.errors[:theme]).to be_present
+    expect(setting.errors[:auto_fetch_title]).to be_present
+    expect(setting.errors[:auto_fetch_thumbnail]).to be_present
+    expect(setting.errors[:wiki_editor_mode]).to be_present
+  end
+end

backend/spec/models/user_theme_slot_spec.rb

@@ -0,0 +1,40 @@
+require 'rails_helper'
+
+RSpec.describe UserThemeSlot, type: :model do
+  it 'accepts a theme slot for one user, base theme, and slot number' do
+    slot = described_class.new(user: create(:user),
+                               base_theme: 'light',
+                               slot_no: 1,
+                               tokens: { 'background' => '0 0% 100%' })
+
+    expect(slot).to be_valid
+  end
+
+  it 'requires unique slot numbers per user and base theme' do
+    user = create(:user)
+    described_class.create!(user:,
+                            base_theme: 'dark',
+                            slot_no: 2,
+                            tokens: { 'background' => '222.2 84% 4.9%' })
+
+    duplicate = described_class.new(user:,
+                                    base_theme: 'dark',
+                                    slot_no: 2,
+                                    tokens: { 'background' => '0 0% 100%' })
+
+    expect(duplicate).not_to be_valid
+    expect(duplicate.errors[:user_id]).to be_present
+  end
+
+  it 'validates base theme, slot number, and token object shape' do
+    slot = described_class.new(user: create(:user),
+                               base_theme: 'system',
+                               slot_no: 4,
+                               tokens: 'not-object')
+
+    expect(slot).not_to be_valid
+    expect(slot.errors[:base_theme]).to be_present
+    expect(slot.errors[:slot_no]).to be_present
+    expect(slot.errors[:tokens]).to be_present
+  end
+end

backend/spec/requests/user_settings_spec.rb

@@ -0,0 +1,98 @@
+require 'rails_helper'
+
+RSpec.describe 'user settings', type: :request do
+  describe 'GET /users/settings' do
+    it 'requires a current user' do
+      sign_out
+
+      get '/users/settings'
+
+      expect(response).to have_http_status(:unauthorized)
+    end
+
+    it 'returns defaults and creates a missing settings row' do
+      user = create(:user)
+      sign_in_as(user)
+
+      expect {
+        get '/users/settings'
+      }.to change(Setting, :count).by(1)
+
+      expect(response).to have_http_status(:ok)
+      expect(json).to eq(
+          'theme' => 'system',
+          'auto_fetch_title' => 'manual',
+          'auto_fetch_thumbnail' => 'manual',
+          'wiki_editor_mode' => 'split')
+      expect(user.reload.setting).to be_present
+    end
+  end
+
+  describe 'PATCH /users/settings' do
+    it 'requires a current user' do
+      sign_out
+
+      patch '/users/settings', params: { theme: 'dark' }, as: :json
+
+      expect(response).to have_http_status(:unauthorized)
+    end
+
+    it 'updates multiple typed settings at once' do
+      user = create(:user)
+      sign_in_as(user)
+
+      patch '/users/settings',
+            params: {
+              theme: 'dark',
+              auto_fetch_title: 'auto',
+              auto_fetch_thumbnail: 'off',
+              wiki_editor_mode: 'preview' },
+            as: :json
+
+      expect(response).to have_http_status(:ok)
+      expect(json).to include(
+          'theme' => 'dark',
+          'auto_fetch_title' => 'auto',
+          'auto_fetch_thumbnail' => 'off',
+          'wiki_editor_mode' => 'preview')
+      expect(user.reload.setting).to have_attributes(
+          theme: 'dark',
+          auto_fetch_title: 'auto',
+          auto_fetch_thumbnail: 'off',
+          wiki_editor_mode: 'preview')
+    end
+
+    it 'does not treat Rails parameter wrapping as an editable setting' do
+      user = create(:user)
+      sign_in_as(user)
+
+      patch '/users/settings',
+            params: { theme: 'light', user_setting: { theme: 'dark' } },
+            as: :json
+
+      expect(response).to have_http_status(:ok)
+      expect(user.reload.setting.theme).to eq('light')
+    end
+
+    it 'returns validation_error for type mismatches' do
+      sign_in_as(create(:user))
+
+      patch '/users/settings', params: { theme: 1 }, as: :json
+
+      expect(response).to have_http_status(:unprocessable_entity)
+      expect(json).to include('type' => 'validation_error')
+      expect(json.fetch('errors')).to include(
+          'theme' => ['値の型が不正です．'])
+    end
+
+    it 'returns validation_error for invalid enum values' do
+      sign_in_as(create(:user))
+
+      patch '/users/settings', params: { theme: 'neon' }, as: :json
+
+      expect(response).to have_http_status(:unprocessable_entity)
+      expect(json).to include('type' => 'validation_error')
+      expect(json.fetch('errors').fetch('theme')).to be_present
+    end
+  end
+end

backend/spec/requests/user_theme_slots_spec.rb

@@ -0,0 +1,104 @@
+require 'rails_helper'
+
+RSpec.describe 'user theme slots', type: :request do
+  describe 'GET /users/theme_slots' do
+    it 'requires a current user' do
+      sign_out
+
+      get '/users/theme_slots'
+
+      expect(response).to have_http_status(:unauthorized)
+    end
+
+    it 'returns only the current user slots in stable order' do
+      user = create(:user)
+      other_user = create(:user)
+      sign_in_as(user)
+      UserThemeSlot.create!(user:, base_theme: 'light', slot_no: 2, tokens: { 'a' => 1 })
+      UserThemeSlot.create!(user:, base_theme: 'dark', slot_no: 1, tokens: { 'b' => 2 })
+      UserThemeSlot.create!(user: other_user,
+                            base_theme: 'dark',
+                            slot_no: 3,
+                            tokens: { 'c' => 3 })
+
+      get '/users/theme_slots'
+
+      expect(response).to have_http_status(:ok)
+      expect(json.map { |slot| [slot.fetch('base_theme'), slot.fetch('slot_no')] }).to eq(
+          [['dark', 1], ['light', 2]])
+      expect(json.map { |slot| slot.fetch('tokens') }).to eq(
+          [{ 'b' => 2 }, { 'a' => 1 }])
+    end
+  end
+
+  describe 'PUT /users/theme_slots/:base_theme/:slot_no' do
+    it 'requires a current user' do
+      sign_out
+
+      put '/users/theme_slots/light/1',
+          params: { tokens: { background: '0 0% 100%' } },
+          as: :json
+
+      expect(response).to have_http_status(:unauthorized)
+    end
+
+    it 'creates a theme slot' do
+      user = create(:user)
+      sign_in_as(user)
+
+      expect {
+        put '/users/theme_slots/light/1',
+            params: { tokens: { background: '0 0% 100%', tagColours: { nico: '#ffffff' } } },
+            as: :json
+      }.to change(UserThemeSlot, :count).by(1)
+
+      expect(response).to have_http_status(:ok)
+      expect(json).to include('base_theme' => 'light', 'slot_no' => 1)
+      expect(json.fetch('tokens')).to include(
+          'background' => '0 0% 100%',
+          'tagColours' => { 'nico' => '#ffffff' })
+      expect(user.theme_slots.find_by!(base_theme: 'light', slot_no: 1).tokens).to include(
+          'background' => '0 0% 100%')
+    end
+
+    it 'updates an existing theme slot instead of creating a duplicate' do
+      user = create(:user)
+      sign_in_as(user)
+      UserThemeSlot.create!(user:, base_theme: 'dark', slot_no: 2, tokens: { 'old' => true })
+
+      expect {
+        put '/users/theme_slots/dark/2',
+            params: { tokens: { background: '222.2 84% 4.9%' } },
+            as: :json
+      }.not_to change(UserThemeSlot, :count)
+
+      expect(response).to have_http_status(:ok)
+      expect(user.theme_slots.find_by!(base_theme: 'dark', slot_no: 2).tokens).to eq(
+          'background' => '222.2 84% 4.9%')
+    end
+
+    it 'rejects invalid path parameters and token shapes' do
+      sign_in_as(create(:user))
+
+      put '/users/theme_slots/system/4',
+          params: { tokens: 'not-object' },
+          as: :json
+
+      expect(response).to have_http_status(:unprocessable_entity)
+      expect(json.fetch('errors')).to include(
+          'base_theme' => ['値が不正です．'])
+    end
+
+    it 'rejects non-object tokens for valid slots' do
+      sign_in_as(create(:user))
+
+      put '/users/theme_slots/light/1',
+          params: { tokens: 'not-object' },
+          as: :json
+
+      expect(response).to have_http_status(:unprocessable_entity)
+      expect(json.fetch('errors')).to include(
+          'tokens' => ['JSON object で指定してください．'])
+    end
+  end
+end

frontend/src/components/DraggableDroppableTagRow.test.tsx

@@ -0,0 +1,75 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import DraggableDroppableTagRow from '@/components/DraggableDroppableTagRow'
+import { buildTag } from '@/test/factories'
+import { renderWithProviders } from '@/test/render'
+
+const dndKit = vi.hoisted (() => ({
+  useDraggable: vi.fn (),
+  useDroppable: vi.fn (),
+}))
+
+vi.mock ('@dnd-kit/core', () => dndKit)
+
+const tag = buildTag ({ id: 7, name: 'ドラッグ元', postCount: 3 })
+
+const renderRow = (activeDndId?: string) => {
+  renderWithProviders (
+      <DraggableDroppableTagRow
+          activeDndId={activeDndId}
+          tag={tag}
+          nestLevel={2}
+          pathKey="cat-general-7"
+          suppressClickRef={{ current: false }}/>,
+  )
+}
+
+const tagBody = (): HTMLElement => {
+  const link = document.querySelector<HTMLElement> ('a[title="ドラッグ元"]')
+
+  if (link == null)
+    throw new Error ('tag link not found')
+
+  const body = link.closest ('div')
+
+  if (body == null)
+    throw new Error ('tag body not found')
+
+  return body
+}
+
+describe ('DraggableDroppableTagRow', () => {
+  beforeEach (() => {
+    vi.clearAllMocks ()
+    dndKit.useDraggable.mockReturnValue ({
+        attributes: { 'aria-describedby': 'drag-source' },
+        listeners:  { onPointerDown: vi.fn () },
+        setNodeRef: vi.fn (),
+        transform:  null })
+    dndKit.useDroppable.mockReturnValue ({
+        isOver:     false,
+        setNodeRef: vi.fn () })
+  })
+
+  it ('passes dndId through draggable data for active-row tracking', () => {
+    renderRow ()
+
+    expect (dndKit.useDraggable).toHaveBeenCalledWith (
+        expect.objectContaining ({
+            id:   'tag-node:cat-general-7',
+            data: expect.objectContaining ({
+                dndId:     'tag-node:cat-general-7',
+                nestLevel: 2,
+                tagId:     7 }) }))
+  })
+
+  it ('hides only the active drag source from the explicit active dnd id', () => {
+    renderRow ('tag-node:cat-general-7')
+    expect (tagBody ()).toHaveStyle ({ visibility: 'hidden' })
+  })
+
+  it ('keeps inactive tag rows visible while another tag is dragged', () => {
+    renderRow ('tag-node:other')
+    expect (tagBody ()).toHaveStyle ({ visibility: 'visible' })
+  })
+})

frontend/src/components/DraggableDroppableTagRow.tsx

@@ -13,6 +13,7 @@ import type { CSSProperties, FC, MutableRefObject } from 'react'
 import type { Tag } from '@/types'
 
 type Props = {
+    activeDndId?:      string
     tag:              Tag
     nestLevel:        number
     pathKey:          string
@@ -21,7 +22,15 @@ type Props = {
     sp?:              boolean }
 
 
-const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTagId, suppressClickRef, sp }) => {
+const DraggableDroppableTagRow: FC<Props> = ({
+    activeDndId,
+    tag,
+    nestLevel,
+    pathKey,
+    parentTagId,
+    suppressClickRef,
+    sp,
+}) => {
   const behaviourSettings = useClientBehaviourSettings ()
   const animationMode = behaviourSettings.animation ?? 'normal'
   const layoutTransition = clientAnimationTransition (
@@ -53,18 +62,23 @@ const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTa
   const { attributes,
 	  listeners,
 	  setNodeRef: setDragRef,
-	  transform,
-	  isDragging: dragging } = useDraggable ({ id:    dndId,
-						   data:  { kind:   'tag',
-							    tagId:  tag.id,
-							    parentTagId } })
+	  transform } = useDraggable ({ id:    dndId,
+					data:  { kind:   'tag',
+						 dndId,
+						 tagId:  tag.id,
+						 parentTagId,
+						 nestLevel } })
 
   const { setNodeRef: setDropRef, isOver: over } = useDroppable ({
       id:   dndId,
       data: { kind: 'tag', tagId: tag.id } })
 
+  const activeDragging = activeDndId === dndId
   const style: CSSProperties = { transform:   CSS.Translate.toString (transform),
-				 visibility:  dragging ? 'hidden' : 'visible' }
+				 visibility:  activeDragging ? 'hidden' : 'visible' }
+  const innerClassName = cn (
+      'inline-flex min-w-0 max-w-full items-baseline overflow-hidden',
+      sp && 'touch-pan-y')
 
   return (
       <div
@@ -77,12 +91,16 @@ const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTa
 	      return
 	    const dx = e.clientX - p.x
 	    const dy = e.clientY - p.y
+
 	    if (dx * dx + dy * dy >= 9)
 	      armEatNextClick ()
 	  }}
 	  onPointerUpCapture={() => {
 	    downPosRef.current = null
 	  }}
+	  onPointerCancelCapture={() => {
+	    downPosRef.current = null
+	  }}
 	  onClickCapture={e => {
 	    if (suppressClickRef.current)
 	      {
@@ -90,24 +108,35 @@ const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTa
 		e.stopPropagation ()
 	      }
 	  }}
-	  ref={node => {
-	    setDragRef (node)
-	    setDropRef (node)
-	  }}
-	  style={style}
+	  ref={setDropRef}
 	  className={cn (
 	      'min-w-0 max-w-full overflow-hidden rounded select-none',
+	      sp && 'touch-pan-y',
 	      over && 'ring-2 ring-offset-2')}
-	  {...attributes}
-	  {...listeners}>
-	<motion.div
-	    className="flex min-w-0 max-w-full items-baseline overflow-hidden"
-	    transition={{ layout: layoutTransition }}
-	    layoutId={animationMode === 'off'
-		? undefined
-		: `tag-${ sp ? 'sp-' : '' }${ tag.id }`}>
-	  <TagLink tag={tag} nestLevel={nestLevel}/>
-	</motion.div>
+	  >
+	{activeDragging
+	 ? (
+	    <div
+		ref={setDragRef}
+		style={style}
+		className={innerClassName}
+		{...attributes}
+		{...listeners}>
+	      <TagLink tag={tag} nestLevel={nestLevel}/>
+	    </div>)
+	 : (
+	    <motion.div
+		ref={setDragRef}
+		style={style}
+		className={innerClassName}
+		{...attributes}
+		{...listeners}
+		transition={{ layout: layoutTransition }}
+		layoutId={animationMode === 'off'
+		    ? undefined
+		    : `tag-${ sp ? 'sp-' : '' }${ tag.id }`}>
+	      <TagLink tag={tag} nestLevel={nestLevel}/>
+	    </motion.div>)}
       </div>)
 }
 

frontend/src/components/TagDetailSidebar.tsx

@@ -1,11 +1,13 @@
 import { DndContext,
 	 DragOverlay,
+	 MeasuringStrategy,
 	 MouseSensor,
 	 TouchSensor,
+	 pointerWithin,
 	 useDroppable,
 	 useSensor,
 	 useSensors } from '@dnd-kit/core'
-import { restrictToWindowEdges } from '@dnd-kit/modifiers'
+import { restrictToWindowEdges, snapCenterToCursor } from '@dnd-kit/modifiers'
 import { useQueryClient } from '@tanstack/react-query'
 import { motion } from 'framer-motion'
 import { useEffect, useMemo, useRef, useState } from 'react'
@@ -25,15 +27,23 @@ import { postsKeys, tagsKeys } from '@/lib/queryKeys'
 import { useClientBehaviourSettings } from '@/lib/useClientBehaviourSettings'
 import { dateString, originalCreatedAtString } from '@/lib/utils'
 
-import type { DragEndEvent } from '@dnd-kit/core'
+import type { CollisionDetection, DragEndEvent } from '@dnd-kit/core'
 import type { FC, MutableRefObject, ReactNode } from 'react'
 
 import type { Category, Post, TagWithSections } from '@/types'
 
 type TagByCategory = { [key in Category]: TagWithSections[] }
 
+const tagCollisionDetection: CollisionDetection = args => {
+  return pointerWithin (args)
+}
+
+const alwaysMeasureDroppables = {
+    droppable: { strategy: MeasuringStrategy.Always } } as const
+
 
 const renderTagTree = (
+    activeDndId:       string | undefined,
     tag:              TagWithSections,
     nestLevel:        number,
     path:             string,
@@ -45,6 +55,7 @@ const renderTagTree = (
   const self = (
       <li key={key} className="mb-1">
 	<DraggableDroppableTagRow
+	    activeDndId={activeDndId}
 	    tag={tag}
 	    nestLevel={nestLevel}
 	    pathKey={key}
@@ -58,7 +69,14 @@ const renderTagTree = (
       ...((tag.children
 	   ?.sort ((a, b) => a.name < b.name ? -1 : 1)
 	   .flatMap (child =>
-	      renderTagTree (child, nestLevel + 1, key, suppressClickRef, tag.id, sp)))
+	      renderTagTree (
+		  activeDndId,
+		  child,
+		  nestLevel + 1,
+		  key,
+		  suppressClickRef,
+		  tag.id,
+		  sp)))
 	  ?? [])]
 }
 
@@ -177,12 +195,35 @@ const DropSlot = ({ cat }: { cat: Category }) => {
       </li>)
 }
 
+const EmptyCategoryDropSection = (
+    { cat, children }: { cat: Category
+			 children: ReactNode }) => {
+  const { setNodeRef, isOver: over } = useDroppable ({
+      id:   `slot:${ cat }`,
+      data: { kind: 'slot', cat } })
+
+  return (
+      <div ref={setNodeRef} className="my-3">
+	{children}
+	<ul>
+	  <li className="h-1">
+	    {over && <div className="h-0.5 w-full rounded bg-sky-400"/>}
+	  </li>
+	</ul>
+      </div>)
+}
+
 
 type Props = {
     className?: string
     post:       Post
     sp?:        boolean }
 
+type ActiveTagDrag = {
+    dndId:       string
+    tagId:      number
+    nestLevel:  number }
+
 
 const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
   sp = Boolean (sp)
@@ -212,7 +253,7 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
     return tagsTmp
   }, [post])
 
-  const [activeTagId, setActiveTagId] = useState<number | null> (null)
+  const [activeTagDrag, setActiveTagDrag] = useState<ActiveTagDrag | null> (null)
   const [dragging, setDragging] = useState (false)
   const [saving, setSaving] = useState (false)
   const [tags, setTags] = useState (baseTags)
@@ -220,6 +261,7 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
       () => buildFlatTagByCategory (tags),
       [tags],
   )
+  const activeDndId = activeTagDrag?.dndId
 
   const suppressClickRef = useRef (false)
 
@@ -328,9 +370,19 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
 	<TagSearch/>
 	<DndContext
 	    sensors={sensors}
+	    collisionDetection={tagCollisionDetection}
+	    measuring={alwaysMeasureDroppables}
 	    onDragStart={e => {
 	      if (e.active.data.current?.kind === 'tag')
-		setActiveTagId (e.active.data.current?.tagId ?? null)
+		{
+		  const tagId = e.active.data.current?.tagId
+		  const nestLevel = e.active.data.current?.nestLevel
+		  const dndId = e.active.data.current?.dndId
+		  setActiveTagDrag (
+		      tagId == null || nestLevel == null || dndId == null
+		      ? null
+		      : { dndId, tagId, nestLevel })
+		}
 	      setDragging (true)
 	      suppressClickRef.current = true
 	      document.body.style.userSelect = 'none'
@@ -341,13 +393,13 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
 		suppressClickRef.current = false}, { capture: true, once: true })
 	    }}
 	    onDragCancel={() => {
-	      setActiveTagId (null)
+	      setActiveTagDrag (null)
 	      setDragging (false)
 	      document.body.style.userSelect = ''
 	      suppressClickRef.current = false
 	    }}
 	    onDragEnd={async e => {
-	      setActiveTagId (null)
+	      setActiveTagDrag (null)
 	      setDragging (false)
 	      await onDragEnd (e)
 	      document.body.style.userSelect = ''
@@ -362,22 +414,31 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
 	    if (!(categoryTags.length > 0 || dragging))
 	      return null
 
+	    const sectionTitle = (
+		<SubsectionTitle>
+		  <motion.div
+		      layoutId={animationMode === 'off'
+			  ? undefined
+			  : `tag-${ sp ? 'sp-' : '' }${ cat }`}
+		      transition={{ layout: layoutTransition }}>
+		    {CATEGORY_NAMES[cat]}
+		  </motion.div>
+		</SubsectionTitle>)
+
+	    if (!(categoryTags.length > 0))
+	      return (
+		  <EmptyCategoryDropSection cat={cat} key={cat}>
+		    {sectionTitle}
+		  </EmptyCategoryDropSection>)
+
 	    return (
 		<div className="my-3" key={cat}>
-		  <SubsectionTitle>
-		    <motion.div
-			layoutId={animationMode === 'off'
-			    ? undefined
-			    : `tag-${ sp ? 'sp-' : '' }${ cat }`}
-			transition={{ layout: layoutTransition }}>
-		      {CATEGORY_NAMES[cat]}
-		    </motion.div>
-		  </SubsectionTitle>
-
+		  {sectionTitle}
 		  <ul>
 		    {(tagRelationDisplay === 'grouped'
 		      ? (tags[cat] ?? []).flatMap (tag =>
 			    renderTagTree (
+				activeDndId,
 				tag,
 				0,
 				`cat-${ cat }`,
@@ -389,6 +450,7 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
 		      : (flatTagsByCategory[cat] ?? []).map (tag => (
 			  <li key={`flat-${ cat }-${ tag.id }`} className="mb-1">
 			    <DraggableDroppableTagRow
+				activeDndId={activeDndId}
 				tag={tag}
 				nestLevel={0}
 				pathKey={`flat-${ cat }-${ tag.id }`}
@@ -441,11 +503,14 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
 		</ul>
 	      </motion.div>)}
 
-	  <DragOverlay adjustScale={false}>
+	  <DragOverlay
+	      adjustScale={false}
+	      modifiers={[snapCenterToCursor]}
+	      dropAnimation={animationMode === 'off' ? null : undefined}>
 	    <div className="pointer-events-none">
-	      {activeTagId != null && (() => {
-		const tag = findTag (tags, activeTagId)
-		return tag && <TagLink tag={tag}/>
+	      {activeTagDrag != null && (() => {
+		const tag = findTag (tags, activeTagDrag.tagId)
+		return tag && <TagLink tag={tag} nestLevel={activeTagDrag.nestLevel}/>
 	      }) ()}
 	    </div>
 	  </DragOverlay>

frontend/src/components/common/TabGroup.test.tsx

@@ -20,4 +20,16 @@ describe ('TabGroup', () => {
     expect (screen.getByText ('Alpha')).toBeInTheDocument ()
     expect (screen.queryByText ('Beta')).not.toBeInTheDocument ()
   })
+
+  it ('renders tabs as buttons and shows the right addon', () => {
+    render (
+        <TabGroup rightAddon={<span>件数 20</span>}>
+          <Tab name="広場">Plaza</Tab>
+        </TabGroup>,
+    )
+
+    expect (screen.getByRole ('button', { name: '広場' })).toBeInTheDocument ()
+    expect (screen.queryByRole ('link', { name: '広場' })).not.toBeInTheDocument ()
+    expect (screen.getByText ('件数 20')).toBeInTheDocument ()
+  })
 })

frontend/src/lib/keyboardShortcuts.test.ts

@@ -0,0 +1,65 @@
+import { describe, expect, it } from 'vitest'
+
+import { DEFAULT_KEY_BINDINGS,
+	 formatKeyBinding,
+	 getConflictingShortcutActionIds,
+	 isEditableEventTarget,
+	 keyBindingFromKeyboardEvent,
+	 resolveShortcutScope,
+	 SHORTCUT_DEFINITIONS_BY_ID } from '@/lib/keyboardShortcuts'
+
+describe ('keyboardShortcuts', () => {
+  it ('defines the default key bindings used by the settings screen', () => {
+    expect (SHORTCUT_DEFINITIONS_BY_ID['global.openShortcutHelp']).toMatchObject ({
+	label: 'ショートカット一覧を開く',
+	scope: 'global',
+	defaultBinding: { key: '?', shift: true } })
+    expect (DEFAULT_KEY_BINDINGS['global.focusSearch']).toEqual ({ key: '/' })
+    expect (DEFAULT_KEY_BINDINGS['navigation.posts']).toEqual ({ key: 'p' })
+    expect (DEFAULT_KEY_BINDINGS['pagination.next']).toEqual ({ key: 'ArrowRight' })
+    expect (DEFAULT_KEY_BINDINGS['settings.theme']).toEqual ({ key: '3' })
+  })
+
+  it ('formats key bindings for display', () => {
+    expect (formatKeyBinding ({ key: '?', shift: true })).toBe ('Shift + ?')
+    expect (formatKeyBinding ({ key: '/' })).toBe ('/')
+    expect (formatKeyBinding ({ key: 'p' })).toBe ('P')
+    expect (formatKeyBinding ({ key: 'ArrowRight' })).toBe ('ArrowRight')
+    expect (formatKeyBinding (null)).toBe ('未割当')
+  })
+
+  it ('normalises keyboard events without assigning space by default', () => {
+    const event = { key: 'P',
+		    ctrlKey: false,
+		    shiftKey: false,
+		    altKey: false,
+		    metaKey: false } as KeyboardEvent
+
+    expect (keyBindingFromKeyboardEvent (event)).toEqual ({ key: 'p' })
+    expect (DEFAULT_KEY_BINDINGS['pagination.next']).not.toEqual ({ key: ' ' })
+  })
+
+  it ('detects conflicting action bindings', () => {
+    const conflicts = getConflictingShortcutActionIds ({
+	...DEFAULT_KEY_BINDINGS,
+	'navigation.posts': { key: 'p' },
+	'navigation.tags': { key: 'p' } })
+
+    expect (conflicts.has ('navigation.posts')).toBe (true)
+    expect (conflicts.has ('navigation.tags')).toBe (true)
+    expect (conflicts.has ('navigation.wiki')).toBe (false)
+  })
+
+  it ('resolves route scopes and editable event targets', () => {
+    const input = document.createElement ('input')
+    const div = document.createElement ('div')
+    div.setAttribute ('role', 'textbox')
+
+    expect (resolveShortcutScope ('/posts/search')).toBe ('postSearch')
+    expect (resolveShortcutScope ('/users/settings')).toBe ('settings')
+    expect (resolveShortcutScope ('/materials/1')).toBe ('materials')
+    expect (isEditableEventTarget (input)).toBe (true)
+    expect (isEditableEventTarget (div)).toBe (true)
+    expect (isEditableEventTarget (document.createElement ('button'))).toBe (false)
+  })
+})

frontend/src/lib/settings.test.ts

@@ -0,0 +1,108 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { applyClientAnimationMode,
+	 applyThemeTokens,
+	 buildThemeTokens,
+	 CLIENT_SETTINGS_STORAGE_KEY,
+	 DARK_THEME_TOKENS,
+	 DEFAULT_POST_LIST_ORDER,
+	 getClientListLimit,
+	 getClientListOrder,
+	 getClientThemeMode,
+	 LIGHT_THEME_TOKENS,
+	 loadClientSettings,
+	 setClientListSettings,
+	 setClientThemeAppearance } from '@/lib/settings'
+
+import type { FetchPostsOrder } from '@/types'
+
+const installMatchMedia = (matches: boolean) => {
+  Object.defineProperty (window, 'matchMedia', {
+      configurable: true,
+      value: vi.fn ().mockImplementation (() => ({
+	  matches,
+	  addEventListener: vi.fn (),
+	  removeEventListener: vi.fn () })) })
+}
+
+describe ('settings', () => {
+  beforeEach (() => {
+    localStorage.clear ()
+    document.documentElement.removeAttribute ('data-animation')
+    document.documentElement.removeAttribute ('style')
+    document.documentElement.className = ''
+    installMatchMedia (false)
+  })
+
+  it ('stores list settings under the shared client settings key', () => {
+    setClientListSettings ('postSearch', {
+	limit: 50,
+	order: 'title:asc' })
+
+    expect (getClientListLimit ('postSearch')).toBe (50)
+    expect (getClientListOrder<FetchPostsOrder> ('postSearch')).toBe ('title:asc')
+    expect (JSON.parse (localStorage.getItem (CLIENT_SETTINGS_STORAGE_KEY) ?? '{}'))
+	.toMatchObject ({ lists: { postSearch: { limit: 50, order: 'title:asc' } } })
+  })
+
+  it ('ignores invalid list limits and keeps stored order strings', () => {
+    localStorage.setItem (
+	CLIENT_SETTINGS_STORAGE_KEY,
+	JSON.stringify ({ lists: { postList: { limit: 30, order: DEFAULT_POST_LIST_ORDER } } }))
+
+    expect (getClientListLimit ('postList')).toBeNull ()
+    expect (getClientListOrder<FetchPostsOrder> ('postList')).toBe (
+	DEFAULT_POST_LIST_ORDER)
+  })
+
+  it ('stores theme mode and light/dark slot selections in client settings', () => {
+    setClientThemeAppearance ({
+	themeMode: 'dark',
+	activeLightThemeSlotNo: 2,
+	activeDarkThemeSlotNo: 3 })
+
+    expect (getClientThemeMode ()).toBe ('dark')
+    expect (loadClientSettings ().appearance).toMatchObject ({
+	themeMode: 'dark',
+	activeLightThemeSlotNo: 2,
+	activeDarkThemeSlotNo: 3 })
+  })
+
+  it ('applies animation mode to the document dataset', () => {
+    applyClientAnimationMode ('off')
+    expect (document.documentElement.dataset.animation).toBe ('off')
+
+    applyClientAnimationMode ('reduced')
+    expect (document.documentElement.dataset.animation).toBe ('reduced')
+
+    applyClientAnimationMode ('normal')
+    expect (document.documentElement.dataset.animation).toBeUndefined ()
+  })
+
+  it ('normalises TopNav menu link tokens to complete CSS colours', () => {
+    const tokens = buildThemeTokens ('light', {
+	link: '221.2 83.2% 53.3%',
+	topNavMenuLink: '221.2 83.2% 53.3%' })
+
+    expect (tokens.link).toBe ('221.2 83.2% 53.3%')
+    expect (tokens.topNavMenuLink).toBe ('hsl(221.2 83.2% 53.3%)')
+  })
+
+  it ('derives TopNav colours without mixing mobile active backgrounds', () => {
+    expect (buildThemeTokens ('light', { }).topNavMobileActiveBackground).toBe (
+	LIGHT_THEME_TOKENS.topNavRootBackgroundDesktop)
+    expect (buildThemeTokens ('dark', { }).topNavMobileActiveBackground).toBe (
+	DARK_THEME_TOKENS.topNavActiveBackground)
+  })
+
+  it ('sets shadcn tokens and TopNav tokens with their different value formats', () => {
+    const tokens = buildThemeTokens ('dark', { link: '213.1 93.9% 67.8%' })
+
+    applyThemeTokens (tokens)
+
+    expect (document.documentElement.style.getPropertyValue ('--theme-link')).toBe (
+	'213.1 93.9% 67.8%')
+    expect (document.documentElement.style.getPropertyValue ('--top-nav-menu-link')).toBe (
+	'hsl(213.1 93.9% 67.8%)')
+  })
+})

frontend/src/lib/useKeyboardShortcuts.tsx

@@ -291,10 +291,27 @@ export const useKeyboardShortcutSettings = (): KeyboardShortcutsContextValue =>
 
 export const useKeyboardShortcuts = (handlers: ShortcutHandlers): void => {
   const { registerHandlers } = useKeyboardShortcutSettings ()
+  const handlersRef = useRef (handlers)
+  const actionIdsKey = Object.keys (handlers).sort ().join ('|')
+
+  useEffect (() => {
+    handlersRef.current = handlers
+  }, [handlers])
+
+  const stableHandlers = useMemo<ShortcutHandlers> (() => {
+    return actionIdsKey.split ('|').filter (actionId => actionId !== '')
+	.reduce<ShortcutHandlers> ((nextHandlers, actionId) => {
+	  const key = actionId as ShortcutActionId
+	  nextHandlers[key] = () => {
+	    handlersRef.current[key]?.()
+	  }
+	  return nextHandlers
+	}, { })
+  }, [actionIdsKey])
 
   useEffect (
-      () => registerHandlers (handlers),
-      [handlers, registerHandlers],
+      () => registerHandlers (stableHandlers),
+      [registerHandlers, stableHandlers],
   )
 }
 

frontend/src/pages/posts/PostListPage.test.tsx

@@ -1,9 +1,10 @@
 import { fireEvent, screen, waitFor } from '@testing-library/react'
-import { describe, expect, it, vi } from 'vitest'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import PostListPage from '@/pages/posts/PostListPage'
 import { buildPost, buildTag, buildWikiPage } from '@/test/factories'
 import { renderWithProviders } from '@/test/render'
+import { CLIENT_SETTINGS_STORAGE_KEY } from '@/lib/settings'
 
 const postsApi = vi.hoisted (() => ({
   fetchPosts: vi.fn (),
@@ -18,6 +19,11 @@ vi.mock ('@/lib/posts', () => postsApi)
 vi.mock ('@/lib/wiki', () => wikiApi)
 
 describe ('PostListPage', () => {
+  beforeEach (() => {
+    localStorage.clear ()
+    vi.clearAllMocks ()
+  })
+
   it ('loads posts from the current query and renders the plaza tab', async () => {
     const tag = buildTag ({ name: '虹夏' })
     postsApi.fetchPosts.mockResolvedValueOnce ({
@@ -36,6 +42,7 @@ describe ('PostListPage', () => {
             match: 'all',
             page:  2,
             limit: 20,
+            order: 'original_created_at:desc',
           }),
       )
     })
@@ -71,4 +78,36 @@ describe ('PostListPage', () => {
         '/wiki/%E8%99%B9%E5%A4%8F',
     )
   })
+
+  it ('uses stored list limit but keeps the fixed plaza order', async () => {
+    localStorage.setItem (
+        CLIENT_SETTINGS_STORAGE_KEY,
+        JSON.stringify ({ lists: { postList: { limit: 50, order: 'title:asc' } } }))
+    postsApi.fetchPosts.mockResolvedValueOnce ({ posts: [], count: 0 })
+
+    renderWithProviders (<PostListPage/>, { route: '/posts' })
+
+    await waitFor (() => {
+      expect (postsApi.fetchPosts).toHaveBeenCalledWith (
+          expect.objectContaining ({
+            limit: 50,
+            order: 'original_created_at:desc',
+          }),
+      )
+    })
+  })
+
+  it ('updates the limit from the tab right addon and resets to page 1', async () => {
+    postsApi.fetchPosts.mockResolvedValue ({ posts: [], count: 0 })
+
+    renderWithProviders (<PostListPage/>, { route: '/posts?page=3' })
+
+    fireEvent.change (await screen.findByLabelText ('件数'), { target: { value: '100' } })
+
+    await waitFor (() => {
+      expect (postsApi.fetchPosts).toHaveBeenLastCalledWith (
+          expect.objectContaining ({ page: 1, limit: 100 }),
+      )
+    })
+  })
 })

frontend/src/pages/posts/PostNewPage.test.tsx

@@ -30,16 +30,12 @@ describe ('PostNewPage', () => {
     expect (screen.getByText ('403')).toBeInTheDocument ()
   })
 
-  it ('submits a new post with manual title and thumbnail settings', async () => {
+  it ('submits a new post with manual title and thumbnail fetch UI', async () => {
     api.apiPost.mockResolvedValueOnce ({})
     api.apiGet.mockResolvedValue ([])
 
     renderWithProviders (<PostNewPage user={buildUser ({ role: 'member' })}/>)
 
-    const checkboxes = screen.getAllByRole ('checkbox', { name: '自動' })
-    fireEvent.click (checkboxes[0])
-    fireEvent.click (checkboxes[1])
-
     const textboxes = screen.getAllByRole ('textbox')
     fireEvent.change (textboxes[0], { target: { value: 'https://example.com/post' } })
     fireEvent.change (textboxes[1], { target: { value: '投稿タイトル' } })
@@ -97,10 +93,6 @@ describe ('PostNewPage', () => {
 
     renderWithProviders (<PostNewPage user={buildUser ({ role: 'member' })}/>)
 
-    const checkboxes = screen.getAllByRole ('checkbox', { name: '自動' })
-    fireEvent.click (checkboxes[0])
-    fireEvent.click (checkboxes[1])
-
     const textboxes = screen.getAllByRole ('textbox')
     fireEvent.change (textboxes[0], { target: { value: 'https://example.com/post' } })
     fireEvent.change (textboxes[1], { target: { value: '投稿タイトル' } })

frontend/src/pages/posts/PostSearchPage.test.tsx

@@ -4,6 +4,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import PostSearchPage from '@/pages/posts/PostSearchPage'
 import { buildPost, buildTag } from '@/test/factories'
 import { renderWithProviders } from '@/test/render'
+import { CLIENT_SETTINGS_STORAGE_KEY } from '@/lib/settings'
 
 const postsApi = vi.hoisted (() => ({
   fetchPosts: vi.fn (),
@@ -18,6 +19,7 @@ vi.mock ('@/lib/api', () => api)
 
 describe ('PostSearchPage', () => {
   beforeEach (() => {
+    localStorage.clear ()
     vi.clearAllMocks ()
     api.apiGet.mockResolvedValue ([])
   })
@@ -40,6 +42,7 @@ describe ('PostSearchPage', () => {
             tags:  'x',
             match: 'any',
             page:  2,
+            limit: 20,
           }),
       )
     })
@@ -81,4 +84,41 @@ describe ('PostSearchPage', () => {
 
     expect (await screen.findByText ('結果ないよ（笑）')).toBeInTheDocument ()
   })
+
+  it ('uses URL limit before localStorage and stores the active list settings', async () => {
+    localStorage.setItem (
+        CLIENT_SETTINGS_STORAGE_KEY,
+        JSON.stringify ({ lists: { postSearch: { limit: 100, order: 'title:asc' } } }))
+    postsApi.fetchPosts.mockResolvedValueOnce ({ posts: [], count: 0 })
+
+    renderWithProviders (
+        <PostSearchPage/>,
+        { route: '/posts/search?limit=50&order=created_at%3Adesc' },
+    )
+
+    await waitFor (() => {
+      expect (postsApi.fetchPosts).toHaveBeenCalledWith (
+          expect.objectContaining ({ limit: 50, order: 'created_at:desc' }),
+      )
+    })
+    expect (JSON.parse (localStorage.getItem (CLIENT_SETTINGS_STORAGE_KEY) ?? '{}'))
+        .toMatchObject ({ lists: { postSearch: { limit: 50, order: 'created_at:desc' } } })
+  })
+
+  it ('moves the compact limit control outside the search form and resets page on change', async () => {
+    postsApi.fetchPosts.mockResolvedValue ({ posts: [], count: 0 })
+
+    renderWithProviders (<PostSearchPage/>, { route: '/posts/search?page=4' })
+
+    const limitSelect = await screen.findByLabelText ('件数')
+    expect (limitSelect.closest ('form')).toBeNull ()
+
+    fireEvent.change (limitSelect, { target: { value: '100' } })
+
+    await waitFor (() => {
+      expect (postsApi.fetchPosts).toHaveBeenLastCalledWith (
+          expect.objectContaining ({ page: 1, limit: 100 }),
+      )
+    })
+  })
 })

frontend/src/pages/tags/NicoTagListPage.test.tsx

@@ -6,6 +6,7 @@ import { dateString } from '@/lib/utils'
 import { buildTag, buildUser } from '@/test/factories'
 import { renderWithProviders } from '@/test/render'
 
+import type { ReactNode } from 'react'
 import type { NicoTag } from '@/types'
 
 const api = vi.hoisted (() => ({
@@ -27,6 +28,7 @@ const scrollIntoView = vi.fn ()
 vi.mock ('@/lib/api', () => api)
 vi.mock ('@/components/ui/use-toast', () => toastApi)
 vi.mock ('@/components/dialogues/DialogueProvider', () => ({
+  default: ({ children }: { children: ReactNode }) => <>{children}</>,
   useDialogue: () => dialogue,
 }))
 

frontend/src/pages/tags/TagListPage.test.tsx

@@ -1,9 +1,10 @@
 import { fireEvent, screen, waitFor } from '@testing-library/react'
-import { describe, expect, it, vi } from 'vitest'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import TagListPage from '@/pages/tags/TagListPage'
 import { buildTag } from '@/test/factories'
 import { renderWithProviders } from '@/test/render'
+import { CLIENT_SETTINGS_STORAGE_KEY } from '@/lib/settings'
 
 const tagsApi = vi.hoisted (() => ({
   fetchTags: vi.fn (),
@@ -12,6 +13,11 @@ const tagsApi = vi.hoisted (() => ({
 vi.mock ('@/lib/tags', () => tagsApi)
 
 describe ('TagListPage', () => {
+  beforeEach (() => {
+    localStorage.clear ()
+    vi.clearAllMocks ()
+  })
+
   it ('loads tags from URL filters and renders the results table', async () => {
     tagsApi.fetchTags.mockResolvedValueOnce ({
       tags: [buildTag ({
@@ -38,6 +44,8 @@ describe ('TagListPage', () => {
             name:         '虹',
             category:     'character',
             page:         3,
+            limit:        20,
+            order:        'post_count:desc',
             postCountGTE: 5,
             deprecated:   true,
           }),
@@ -48,7 +56,7 @@ describe ('TagListPage', () => {
         '/tags/7',
     )
     expect (screen.getAllByText ('キャラクター').length).toBeGreaterThan (0)
-    expect (screen.getAllByRole ('combobox')[1]).toHaveValue ('1')
+    expect (screen.getAllByRole ('combobox')[2]).toHaveValue ('1')
     expect (screen.getAllByText ('廃止')).toHaveLength (2)
   })
 
@@ -58,7 +66,7 @@ describe ('TagListPage', () => {
     renderWithProviders (<TagListPage/>, { route: '/tags' })
 
     fireEvent.change (screen.getByRole ('textbox'), { target: { value: '虹夏' } })
-    fireEvent.change (screen.getAllByRole ('combobox')[0], {
+    fireEvent.change (screen.getAllByRole ('combobox')[1], {
       target: { value: 'character' },
     })
     fireEvent.submit (screen.getByRole ('button', { name: '検索' }).closest ('form')!)
@@ -82,4 +90,41 @@ describe ('TagListPage', () => {
 
     expect (await screen.findByText ('結果ないよ（笑）')).toBeInTheDocument ()
   })
+
+  it ('uses URL limit before localStorage and preserves the query order', async () => {
+    localStorage.setItem (
+        CLIENT_SETTINGS_STORAGE_KEY,
+        JSON.stringify ({ lists: { tagList: { limit: 100, order: 'name:asc' } } }))
+    tagsApi.fetchTags.mockResolvedValueOnce ({ tags: [], count: 0 })
+
+    renderWithProviders (
+        <TagListPage/>,
+        { route: '/tags?limit=50&order=updated_at%3Adesc' },
+    )
+
+    await waitFor (() => {
+      expect (tagsApi.fetchTags).toHaveBeenCalledWith (
+          expect.objectContaining ({ limit: 50, order: 'updated_at:desc' }),
+      )
+    })
+    expect (JSON.parse (localStorage.getItem (CLIENT_SETTINGS_STORAGE_KEY) ?? '{}'))
+        .toMatchObject ({ lists: { tagList: { limit: 50, order: 'updated_at:desc' } } })
+  })
+
+  it ('keeps the compact limit control outside the search form and resets page on change', async () => {
+    tagsApi.fetchTags.mockResolvedValue ({ tags: [], count: 0 })
+
+    renderWithProviders (<TagListPage/>, { route: '/tags?page=4' })
+
+    const limitSelect = await screen.findByLabelText ('件数')
+    expect (limitSelect.closest ('form')).toBeNull ()
+
+    fireEvent.change (limitSelect, { target: { value: '100' } })
+
+    await waitFor (() => {
+      expect (tagsApi.fetchTags).toHaveBeenLastCalledWith (
+          expect.objectContaining ({ page: 1, limit: 100 }),
+      )
+    })
+  })
 })

frontend/src/pages/theatres/TheatreDetailPage.test.tsx

@@ -41,6 +41,7 @@ const postEmbed = vi.hoisted (() => ({
 vi.mock ('@/lib/api', () => api)
 vi.mock ('@/lib/posts', () => postsApi)
 vi.mock ('@/components/dialogues/DialogueProvider', () => ({
+  default: ({ children }: { children: ReactNode }) => <>{children}</>,
   useDialogue: () => dialogue,
 }))
 vi.mock ('@/components/PostEmbed', () => ({

frontend/src/pages/users/SettingPage.test.tsx

@@ -6,6 +6,7 @@ import { buildUser } from '@/test/factories'
 import { renderWithProviders } from '@/test/render'
 
 const api = vi.hoisted (() => ({
+  apiGet:     vi.fn (),
   apiPut:     vi.fn (),
   isApiError: vi.fn (),
 }))
@@ -27,12 +28,23 @@ describe ('SettingPage', () => {
   beforeEach (() => {
     vi.clearAllMocks ()
     api.isApiError.mockReturnValue (false)
+    api.apiGet.mockImplementation ((path: string) => {
+      if (path === '/users/settings')
+	return Promise.resolve ({
+	    theme: 'system',
+	    auto_fetch_title: 'manual',
+	    auto_fetch_thumbnail: 'manual',
+	    wiki_editor_mode: 'split' })
+      if (path === '/users/theme_slots')
+	return Promise.resolve ([])
+      return Promise.resolve ({})
+    })
   })
 
   it ('shows loading when user is absent', () => {
     renderWithProviders (<SettingPage user={null} setUser={vi.fn ()}/>)
 
-    expect (screen.getByText ('Loading...')).toBeInTheDocument ()
+    expect (screen.getAllByText ('Loading...').length).toBeGreaterThan (0)
   })
 
   it ('updates the current user name', async () => {
@@ -42,8 +54,9 @@ describe ('SettingPage', () => {
 
     renderWithProviders (<SettingPage user={user} setUser={setUser}/>)
 
-    fireEvent.change (screen.getByRole ('textbox'), { target: { value: 'new' } })
-    fireEvent.click (screen.getByRole ('button', { name: '更新' }))
+    const nameInput = (await screen.findAllByRole ('textbox'))[0]
+    fireEvent.change (nameInput, { target: { value: 'new' } })
+    fireEvent.click (screen.getAllByRole ('button', { name: '表示名を更新' })[0])
 
     await waitFor (() => {
       expect (api.apiPut).toHaveBeenCalledWith (
@@ -55,7 +68,7 @@ describe ('SettingPage', () => {
     const formData = api.apiPut.mock.calls[0]?.[1] as FormData
     expect (formData.get ('name')).toBe ('new')
     expect (setUser).toHaveBeenCalled ()
-    expect (toastApi.toast).toHaveBeenCalledWith ({ title: '設定を更新しました．' })
+    expect (toastApi.toast).toHaveBeenCalledWith ({ title: '表示名を更新しました．' })
   })
 
   it ('shows validation errors returned for the name field', async () => {
@@ -75,10 +88,11 @@ describe ('SettingPage', () => {
 
     renderWithProviders (<SettingPage user={user} setUser={vi.fn ()}/>)
 
-    fireEvent.change (screen.getByRole ('textbox'), { target: { value: '' } })
-    fireEvent.click (screen.getByRole ('button', { name: '更新' }))
+    const nameInput = (await screen.findAllByRole ('textbox'))[0]
+    fireEvent.change (nameInput, { target: { value: '' } })
+    fireEvent.click (screen.getAllByRole ('button', { name: '表示名を更新' })[0])
 
-    expect (await screen.findByText ('名前は必須です．')).toBeInTheDocument ()
-    expect (screen.getByRole ('textbox')).toHaveAttribute ('aria-invalid', 'true')
+    expect ((await screen.findAllByText ('名前は必須です．')).length).toBeGreaterThan (0)
+    expect (nameInput).toHaveAttribute ('aria-invalid', 'true')
   })
 })

frontend/src/pages/users/SettingPage.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react'
+import { useCallback, useEffect, useMemo, useState } from 'react'
 import { Helmet } from 'react-helmet-async'
 import { useBeforeUnload, useLocation, useNavigate } from 'react-router-dom'
 
@@ -735,6 +735,9 @@ const SettingPage: FC<Props> = ({ user, setUser }) => {
       state:  SettingsTabDirtyState,
   ) => {
     setDirtyStates (current => {
+      if (!(state.dirty) && current[tab] == null)
+	return current
+
       const next = { ...current }
 
       if (!(state.dirty))
@@ -827,7 +830,7 @@ const SettingPage: FC<Props> = ({ user, setUser }) => {
     }, nextThemeSlots)
   }
 
-  const discardAllDirtyChanges = async (): Promise<void> => {
+  const discardAllDirtyChanges = useCallback (async (): Promise<void> => {
     const currentDirtyStates = Object.values (dirtyStates)
 
     for (const dirtyState of currentDirtyStates)
@@ -837,7 +840,7 @@ const SettingPage: FC<Props> = ({ user, setUser }) => {
       }
 
     setDirtyStates ({ })
-  }
+  }, [dirtyStates])
 
   const discardCurrentTabChanges = async (): Promise<void> => {
     const currentDirtyState = dirtyStates[activeTab]

frontend/src/test/render.tsx

@@ -3,6 +3,10 @@ import { render } from '@testing-library/react'
 import { HelmetProvider } from 'react-helmet-async'
 import { MemoryRouter } from 'react-router-dom'
 
+import DialogueProvider from '@/components/dialogues/DialogueProvider'
+import { KeyboardShortcutsProvider } from '@/lib/useKeyboardShortcuts'
+import { UnsavedChangesGuardProvider } from '@/lib/useUnsavedChangesGuard'
+
 import type { ReactElement, ReactNode } from 'react'
 
 type Options = {
@@ -15,21 +19,25 @@ export const renderWithProviders = (
 ) => {
   const queryClient = new QueryClient ({
     defaultOptions: {
-      queries: { retry: false },
-    },
+      queries: { retry: false } },
   })
 
   const Wrapper = ({ children }: { children: ReactNode }) => (
       <QueryClientProvider client={queryClient}>
         <HelmetProvider>
           <MemoryRouter initialEntries={[options.route ?? '/']}>
-            {children}
+            <DialogueProvider>
+              <UnsavedChangesGuardProvider>
+                <KeyboardShortcutsProvider>
+                  {children}
+                </KeyboardShortcutsProvider>
+              </UnsavedChangesGuardProvider>
+            </DialogueProvider>
           </MemoryRouter>
         </HelmetProvider>
       </QueryClientProvider>)
 
   return {
     queryClient,
-    ...render (ui, { wrapper: Wrapper }),
-  }
+    ...render (ui, { wrapper: Wrapper }) }
 }

frontend/src/test/setup.ts

@@ -20,3 +20,10 @@ window.requestAnimationFrame = callback => {
   callback (0)
   return 0
 }
+
+Object.defineProperty (window, 'matchMedia', {
+    configurable: true,
+    value: vi.fn ().mockImplementation (() => ({
+	addEventListener: vi.fn (),
+	removeEventListener: vi.fn (),
+	matches: false })) })