#306

backend/app/controllers/posts_controller.rb

@@ -140,11 +140,10 @@ class PostsController < ApplicationController
     original_created_from = params[:original_created_from]
     original_created_before = params[:original_created_before]
     parent_post_ids = parse_parent_post_ids
-    resized_thumbnail = thumbnail.present? ? Post.resized_thumbnail_attachment(thumbnail) : nil
 
     post = Post.new(title:, url:, thumbnail_base: nil, uploaded_user: current_user,
                     original_created_from:, original_created_before:)
-    post.thumbnail.attach(resized_thumbnail) if resized_thumbnail
+    post.thumbnail.attach(thumbnail) if thumbnail.present?
 
     ApplicationRecord.transaction do
       post.save!
@@ -157,6 +156,8 @@ class PostsController < ApplicationController
 
       sync_parent_posts!(post, parent_post_ids)
 
+      post.resized_thumbnail!
+
       PostVersionRecorder.record!(post:, event_type: :create, created_by_user: current_user)
     end
 
@@ -166,8 +167,6 @@ class PostsController < ApplicationController
     render_validation_error fields: { tags: 'ニコニコ・タグは直接指定できません．' }
   rescue Tag::DeprecatedTagNormalisationError
     render_unprocessable_entity '廃止済みタグは付与できません．', field: :tags
-  rescue MiniMagick::Error
-    render_validation_error fields: { thumbnail: ['サムネイル画像の変換に失敗しました．'] }
   rescue ArgumentError => e
     render_validation_error fields: { parent_post_ids: [e.message] }
   rescue ActiveRecord::RecordInvalid => e

backend/app/models/post.rb

@@ -1,19 +1,5 @@
 class Post < ApplicationRecord
   require 'mini_magick'
-  require 'stringio'
-
-  def self.resized_thumbnail_attachment(upload)
-    upload.rewind
-    image = MiniMagick::Image.read(upload.read)
-    image.resize '180x180'
-    image.format 'jpg'
-
-    { io: StringIO.new(image.to_blob),
-      filename: 'resized_thumbnail.jpg',
-      content_type: 'image/jpeg' }
-  ensure
-    upload.rewind
-  end
 
   belongs_to :uploaded_user, class_name: 'User', optional: true
 
@@ -101,7 +87,12 @@ class Post < ApplicationRecord
   def resized_thumbnail!
     return unless thumbnail.attached?
 
-    thumbnail.attach(self.class.resized_thumbnail_attachment(StringIO.new(thumbnail.download)))
+    image = MiniMagick::Image.read(thumbnail.download)
+    image.resize '180x180'
+    thumbnail.purge
+    thumbnail.attach(io:            File.open(image.path),
+                     filename:      'resized_thumbnail.jpg',
+                     content_type:  'image/jpeg')
   end
 
   private

backend/app/services/google_drive/api_client.rb

@@ -26,19 +26,13 @@ module GoogleDrive
 
     def list_material_files_under_folder folder_id
       files = []
-      each_material_file_under_folder(folder_id) { |entry| files << entry }
-      files
-    end
-
-    def each_material_file_under_folder folder_id
-      return enum_for(__method__, folder_id) unless block_given?
-
       walk_folder(folder_id, nil) do |entry, relative_path|
         next if entry['mimeType'] == FOLDER_MIME_TYPE
         next if native_file?(entry['mimeType'])
 
-        yield build_file_entry(entry, relative_path)
+        files << build_file_entry(entry, relative_path)
       end
+      files
     end
 
     def fetch_material_file file_id
@@ -50,10 +44,9 @@ module GoogleDrive
 
     def download_to_tempfile file_id, filename:
       tempfile = Tempfile.new(['material-sync', File.extname(filename.to_s)])
-      tempfile.binmode
       request_binary("/files/#{ file_id }",
                      { alt: 'media', supportsAllDrives: true }) do |chunk|
-        tempfile.write(chunk.b)
+        tempfile.write(chunk)
       end
       tempfile.rewind
       tempfile
@@ -146,7 +139,7 @@ module GoogleDrive
         end
 
         response.read_body do |chunk|
-          yield chunk.b
+          yield chunk
         end
       end
     end

backend/app/services/material_sync_runner.rb

@@ -21,14 +21,10 @@ class MaterialSyncRunner
     result = Result.new(imported: 0, updated: 0, unchanged: 0,
                         suppressed: 0, failed: 0, errors: [])
 
-    if @source.source_kind == 'google_drive_path'
-      sync_google_drive_path!(result)
-    else
-      candidates.each do |candidate|
-        next if candidate.blank?
+    candidates.each do |candidate|
+      next if candidate.blank?
 
-        sync_candidate!(candidate, result)
-      end
+      sync_candidate!(candidate, result)
     end
 
     @source.update!(last_synced_at: Time.current)
@@ -47,6 +43,8 @@ class MaterialSyncRunner
     case @source.source_kind
     when 'uri'
       [uri_candidate]
+    when 'google_drive_path'
+      google_drive_path_candidates
     when 'google_drive_file'
       [google_drive_file_candidate]
     when 'legacy_drive_path'
@@ -106,25 +104,12 @@ class MaterialSyncRunner
   def google_drive_path_candidates
     folder_id = google_drive_folder_id
     Enumerator.new do |entries|
-      drive_client.each_material_file_under_folder(folder_id).each do |entry|
+      drive_client.list_material_files_under_folder(folder_id).each do |entry|
         entries << build_google_drive_candidate(entry)
       end
     end
   end
 
-  def sync_google_drive_path! result
-    folder_id = google_drive_folder_id
-    scanned_count = 0
-
-    drive_client.each_material_file_under_folder(folder_id) do |entry|
-      scanned_count += 1
-      sync_candidate!(build_google_drive_candidate(entry), result)
-      log_google_drive_progress(folder_id, scanned_count, result) if progress_log_scan_count?(scanned_count)
-    end
-
-    log_google_drive_progress(folder_id, scanned_count, result, summary: true)
-  end
-
   def google_drive_file_candidate
     entry = drive_client.fetch_material_file(google_drive_file_id)
     return nil unless entry
@@ -228,22 +213,6 @@ class MaterialSyncRunner
                                         failed: result.failed))
   end
 
-  def progress_log_scan_count? scanned_count
-    scanned_count == 1 || (scanned_count % 50).zero?
-  end
-
-  def log_google_drive_progress folder_id, scanned_count, result, summary: false
-    Rails.logger.info(
-        material_sync_log(folder_id:,
-                          scanned_count:,
-                          imported: result.imported,
-                          updated: result.updated,
-                          unchanged: result.unchanged,
-                          suppressed: result.suppressed,
-                          failed: result.failed,
-                          progress: summary ? 'summary' : 'scan'))
-  end
-
   def material_sync_log fields
     { material_sync_source_id: @source.id,
       material_sync_source_name: @source.name }.merge(fields).to_json

backend/spec/requests/posts_spec.rb

@@ -1,5 +1,4 @@
 require 'rails_helper'
-require 'base64'
 require 'set'
 
 include ActiveSupport::Testing::TimeHelpers
@@ -9,11 +8,6 @@ RSpec.describe 'Posts API', type: :request do
   # resized_thumbnail! が MiniMagick 依存でコケやすいので request spec ではスタブしとくのが無難。
   before do
     allow_any_instance_of(Post).to receive(:resized_thumbnail!).and_return(true)
-    allow(Post).to receive(:resized_thumbnail_attachment).and_return(
-      io: StringIO.new('dummy'),
-      filename: 'resized_thumbnail.jpg',
-      content_type: 'image/jpeg'
-    )
   end
 
   def create_nico_tag!(name)
@@ -25,18 +19,6 @@ RSpec.describe 'Posts API', type: :request do
     Rack::Test::UploadedFile.new(StringIO.new('dummy'), 'image/jpeg', original_filename: 'dummy.jpg')
   end
 
-  def real_thumbnail_upload
-    gif =
-        Base64.decode64(
-            'R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAACAkQBADs=')
-
-    Rack::Test::UploadedFile.new(
-      StringIO.new(gif),
-      'image/gif',
-      original_filename: 'thumbnail.gif'
-    )
-  end
-
   def post_write_params params = { }
     { parent_post_ids: '' }.merge(params)
   end
@@ -714,66 +696,6 @@ RSpec.describe 'Posts API', type: :request do
       expect(json['tags'][0]).to have_key('name')
     end
 
-    it '201 when posting manually with a thumbnail' do
-      sign_in_as(member)
-      allow(Post).to receive(:resized_thumbnail_attachment).and_call_original
-
-      post '/posts', params: post_write_params(
-        title: 'thumbnail post',
-        url: 'https://example.com/thumbnail-post',
-        tags: 'spec_tag',
-        thumbnail: real_thumbnail_upload
-      )
-
-      expect(response).to have_http_status(:created)
-      post_record = Post.find(json.fetch('id'))
-      expect(post_record.thumbnail).to be_attached
-      expect(post_record.thumbnail.blob.content_type).to eq('image/jpeg')
-      expect { post_record.thumbnail.download }.not_to raise_error
-    end
-
-    it 'resizes the thumbnail before the create transaction begins' do
-      sign_in_as(member)
-
-      open_transactions = []
-      baseline_open_transactions = Post.connection.open_transactions
-      allow(Post).to receive(:resized_thumbnail_attachment) do |_upload|
-        open_transactions << Post.connection.open_transactions
-        { io: StringIO.new('dummy'),
-          filename: 'resized_thumbnail.jpg',
-          content_type: 'image/jpeg' }
-      end
-
-      post '/posts', params: post_write_params(
-        title: 'transaction post',
-        url: 'https://example.com/transaction-post',
-        tags: 'spec_tag',
-        thumbnail: dummy_upload
-      )
-
-      expect(response).to have_http_status(:created)
-      expect(open_transactions).to eq([baseline_open_transactions])
-    end
-
-    it 'returns 422 and does not create a post when thumbnail resize fails' do
-      sign_in_as(member)
-      allow(Post).to receive(:resized_thumbnail_attachment).and_raise(MiniMagick::Error)
-
-      expect {
-        post '/posts', params: post_write_params(
-          title: 'broken thumbnail post',
-          url: 'https://example.com/broken-thumbnail-post',
-          tags: 'spec_tag',
-          thumbnail: dummy_upload
-        )
-      }.not_to change(Post, :count)
-
-      expect(response).to have_http_status(:unprocessable_entity)
-      expect(json.fetch('errors')).to include(
-        'thumbnail' => ['サムネイル画像の変換に失敗しました．']
-      )
-    end
-
     it '201 and creates post + tags when member and tags have aliases' do
       sign_in_as(member)
 

backend/spec/services/material_sync_runner_spec.rb

@@ -1,89 +0,0 @@
-require 'rails_helper'
-
-RSpec.describe MaterialSyncRunner do
-  let(:user) { create(:user, :member) }
-  let(:source) do
-    MaterialSyncSource.create!(
-        name: 'Drive source',
-        source_kind: 'google_drive_path',
-        source_file_id: 'folder-123',
-        profile: 'legacy_drive',
-        created_by_user: user,
-        updated_by_user: user)
-  end
-  let(:drive_client) { instance_double(GoogleDrive::ApiClient) }
-
-  describe '#sync!' do
-    it 'imports google drive path candidates as they are yielded' do
-      first_entry = { id: 'file-1',
-                      name: 'a.png',
-                      mime_type: 'image/png',
-                      relative_path: '素材/a.png',
-                      sha256_checksum: 'sha-a',
-                      web_view_link: 'https://drive.google.com/file/d/file-1/view',
-                      web_content_link: nil }
-      second_entry = { id: 'file-2',
-                       name: 'b.png',
-                       mime_type: 'image/png',
-                       relative_path: '素材/b.png',
-                       sha256_checksum: 'sha-b',
-                       web_view_link: 'https://drive.google.com/file/d/file-2/view',
-                       web_content_link: nil }
-      yielded = []
-
-      allow(GoogleDrive::ApiClient).to receive(:new).and_return(drive_client)
-      allow(drive_client).to receive(:each_material_file_under_folder) do |folder_id, &block|
-        expect(folder_id).to eq('folder-123')
-        block.call(first_entry)
-        expect(yielded).to eq(['素材/a.png'])
-        block.call(second_entry)
-      end
-      allow(MaterialSyncImporter).to receive(:import!) do |candidate|
-        yielded << candidate.fetch(:source_path)
-        instance_double(MaterialSyncImporter::Result,
-                        action: yielded.last == '素材/a.png' ? :imported : :updated)
-      end
-
-      result = described_class.new(source).sync!
-
-      expect(yielded).to eq(['素材/a.png', '素材/b.png'])
-      expect(result.imported).to eq(1)
-      expect(result.updated).to eq(1)
-      expect(result.unchanged).to eq(0)
-      expect(source.reload.last_synced_at).to be_present
-    end
-
-    it 'logs google drive path progress at first item and summary' do
-      entry = { id: 'file-1',
-                name: 'a.png',
-                mime_type: 'image/png',
-                relative_path: '素材/a.png',
-                sha256_checksum: 'sha-a',
-                web_view_link: 'https://drive.google.com/file/d/file-1/view',
-                web_content_link: nil }
-      logged = []
-
-      allow(GoogleDrive::ApiClient).to receive(:new).and_return(drive_client)
-      allow(drive_client).to receive(:each_material_file_under_folder) do |_folder_id, &block|
-        block.call(entry)
-      end
-      allow(MaterialSyncImporter).to receive(:import!)
-        .and_return(instance_double(MaterialSyncImporter::Result, action: :imported))
-      allow(Rails.logger).to receive(:info) { |message| logged << JSON.parse(message) }
-
-      described_class.new(source).sync!
-
-      progress_logs = logged.select { |row| row['folder_id'] == 'folder-123' }
-      expect(progress_logs.map { |row| row['progress'] }).to eq(['scan', 'summary'])
-      expect(progress_logs.last).to include(
-          'material_sync_source_id' => source.id,
-          'material_sync_source_name' => 'Drive source',
-          'scanned_count' => 1,
-          'imported' => 1,
-          'updated' => 0,
-          'unchanged' => 0,
-          'suppressed' => 0,
-          'failed' => 0)
-    end
-  end
-end

frontend/src/components/TopNav.tsx

@@ -55,16 +55,15 @@ export const menuOutline = (
 	    visible: tagFlg },
 	  { name: '履歴', to: `/tags/changes?id=${ tag?.id }`,
 	    visible: tagFlg && tag?.category !== 'nico' }] },
-      { name: '素材', to: '/materials', visible: true, subMenu: [
+      { name: '素材', to: '/materials', visible: false, subMenu: [
 	  { name: '一覧', to: '/materials' },
 	  { name: '追加', to: '/materials/new' },
-	  { name: '抑止', to: '/materials/suppressions' },
 	  { name: '全体履歴', to: '/materials/changes' },
 	  { name: 'ヘルプ', to: '/wiki/ヘルプ:素材管理' },
 	  { component: <Separator/>, visible: materialFlg },
 	  { name: `広場 (${ postCount || 0 })`,
 	    to: `/posts?tags=${ encodeURIComponent (material?.tag?.name ?? '') }`,
-	    visible: materialFlg && Boolean (material?.tag) },
+	    visible: materialFlg },
 	  { name: '履歴', to: `/materials/changes?material_id=${ material?.id }`,
 	    visible: materialFlg }] },
       { name: 'Wiki', to: '/wiki/ヘルプ:ホーム', base: '/wiki', subMenu: [

frontend/src/pages/materials/MaterialDetailPage.tsx

@@ -127,12 +127,17 @@ const MaterialDetailPage: FC = () => {
 		      <audio src={material.file} controls/>)))}
 
 	      <TabGroup>
-		{material.tag && (
-		    <Tab name="Wiki">
+		<Tab name="Wiki">
+		  {material.tag
+		   ? (
 		      <WikiBody
 			  title={material.tag.name}
-			  body={material.wikiPageBody ?? undefined}/>
-		    </Tab>)}
+			  body={material.wikiPageBody ?? undefined}/>)
+		   : (
+		      <p className="text-stone-700 dark:text-stone-300">
+			タグ未設定の素材です．
+		      </p>)}
+		</Tab>
 
 		<Tab name="編輯">
 		  <div className="max-w-wl space-y-4 pt-2">

frontend/src/pages/materials/MaterialListPage.test.tsx

@@ -34,6 +34,10 @@ describe ('MaterialListPage', () => {
       )
     })
     expect (await screen.findByText ('素材はありません。')).toBeInTheDocument ()
+    expect (screen.getByRole ('link', { name: '新規素材を追加' })).toHaveAttribute (
+        'href',
+        '/materials/new',
+    )
   })
 
   it ('shows materials in the default card view', async () => {

frontend/src/pages/materials/MaterialListPage.tsx

@@ -10,7 +10,7 @@ import FormField from '@/components/common/FormField'
 import PageTitle from '@/components/common/PageTitle'
 import Pagination from '@/components/common/Pagination'
 import MainArea from '@/components/layout/MainArea'
-import { SITE_TITLE } from '@/config'
+import { API_BASE_URL, SITE_TITLE } from '@/config'
 import { fetchMaterials, parseMaterialFilter } from '@/lib/materials'
 import { materialsKeys } from '@/lib/queryKeys'
 import { dateString, inputClass } from '@/lib/utils'
@@ -41,16 +41,16 @@ const MEDIA_FILTER_LABELS: Record<MaterialIndexMediaKind, string> = {
     video:      '動画',
     audio:      '音声',
     file_other: 'その他ファイル',
-    url_only:   '外部リンクのみ'}
+    url_only:   'URL のみ'}
 
 const SORT_LABELS: Record<MaterialIndexSort, string> = {
     created_at:     '作成日時',
     updated_at:     '更新日時',
     tag_name:       'タグ名',
     media_kind:     '種類',
-    file_byte_size: '容量',
-    version_no:     '版',
-    id:             'Id.'}
+    file_byte_size: 'ファイルサイズ',
+    version_no:     'バージョン',
+    id:             'ID'}
 
 
 const setIf = (qs: URLSearchParams, key: string, value: string | null) => {
@@ -118,7 +118,7 @@ const MaterialThumb: FC<{ material: Material }> = ({ material }) => (
 		    text-stone-900 shadow-sm dark:border-stone-700 dark:bg-stone-900
 		    dark:text-stone-100`}>
       {material.thumbnail
-       ? <img src={material.thumbnail} alt="" className="block h-full w-full object-cover"/>
+       ? <img src={material.thumbnail} alt="" className="h-full w-full object-contain"/>
        : (
 	  <span
 	      className="px-2 text-2xl leading-tight"
@@ -409,8 +409,21 @@ const MaterialListPage: FC = () => {
 	  <div className="flex flex-wrap items-center justify-between gap-3">
 	    <PageTitle className="my-auto">素材管理</PageTitle>
 	    <div className="flex flex-wrap gap-2">
-	      {/* TODO: 局所出力を可能にする */}
-	      {/* <a
+	      <PrefetchLink
+		  to="/materials/new"
+		  className="rounded-full border border-stone-300 bg-white px-4 py-2 text-sm
+			     text-stone-900 hover:bg-stone-100 dark:border-stone-700
+			     dark:bg-stone-900 dark:text-stone-100 dark:hover:bg-stone-800">
+		新規素材を追加
+	      </PrefetchLink>
+	      <PrefetchLink
+		  to="/materials/suppressions"
+		  className="rounded-full border border-stone-300 bg-white px-4 py-2 text-sm
+			     text-stone-900 hover:bg-stone-100 dark:border-stone-700
+			     dark:bg-stone-900 dark:text-stone-100 dark:hover:bg-stone-800">
+		同期元抑止
+	      </PrefetchLink>
+	      <a
 		  href={`${ API_BASE_URL }/materials/download.zip?profile=legacy_drive`}
 		  target="_blank"
 		  rel="noopener noreferrer"
@@ -418,7 +431,7 @@ const MaterialListPage: FC = () => {
 			     text-stone-900 hover:bg-stone-100 dark:border-stone-700
 			     dark:bg-stone-900 dark:text-stone-100 dark:hover:bg-stone-800">
 		ZIP をダウンロード
-	      </a> */}
+	      </a>
 	    </div>
 	  </div>
 

frontend/src/pages/materials/MaterialSyncSuppressionsPage.tsx

@@ -2,13 +2,17 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
 import { useState } from 'react'
 import { Helmet } from 'react-helmet-async'
 
+import PrefetchLink from '@/components/PrefetchLink'
 import FormField from '@/components/common/FormField'
 import PageTitle from '@/components/common/PageTitle'
 import MainArea from '@/components/layout/MainArea'
 import { Button } from '@/components/ui/button'
 import { toast } from '@/components/ui/use-toast'
 import { SITE_TITLE } from '@/config'
-import { createMaterialSyncSuppression, fetchMaterialSyncSuppressions } from '@/lib/materials'
+import {
+    createMaterialSyncSuppression,
+    fetchMaterialSyncSuppressions,
+} from '@/lib/materials'
 import { materialsKeys } from '@/lib/queryKeys'
 import { dateString, inputClass } from '@/lib/utils'
 
@@ -18,11 +22,11 @@ import type { MaterialSyncSuppressionSourceKind } from '@/types'
 
 const SOURCE_KIND_LABELS: Record<MaterialSyncSuppressionSourceKind, string> = {
     uri:               'URI',
-    google_drive_path: 'Google Drive ファイル',
-    google_drive_path_prefix: 'Google Drive フォルダ',
-    google_drive_file: 'Google Drive ファイル Id.',
-    legacy_drive_path: '汎用ファイル',
-    legacy_drive_path_prefix: '汎用フォルダ' }
+    google_drive_path: 'Google Drive path',
+    google_drive_path_prefix: 'Google Drive path prefix',
+    google_drive_file: 'Google Drive file ID',
+    legacy_drive_path: 'Legacy Drive path',
+    legacy_drive_path_prefix: 'Legacy Drive path prefix'}
 
 const REASONS = [
     'copyright_high_risk',
@@ -32,23 +36,7 @@ const REASONS = [
     'malware_or_dangerous_file',
     'duplicate_or_low_quality',
     'source_owner_request',
-    'other'] as const
-
-type MaterialSyncSuppressionReason = typeof REASONS[number]
-
-const REASON_NAMES: Record<MaterialSyncSuppressionReason, string> = {
-    ['copyright_high_risk']: '著作権への懸念',
-    ['copyright_takedown']: '著作者からの申出',
-    ['adult_or_sensitive']: '成人向け',
-    ['personal_information']: '個人情報',
-    ['malware_or_dangerous_file']: '危険なソフトウェア',
-    ['duplicate_or_low_quality']: '重複',
-    ['source_owner_request']: '同期元管理者からの申出',
-    ['other']: 'その他' } as const
-
-
-const reasonName = (reason: string): string =>
-    REASON_NAMES[reason as MaterialSyncSuppressionReason] ?? reason
+    'other']
 
 
 const MaterialSyncSuppressionsPage: FC = () => {
@@ -58,7 +46,7 @@ const MaterialSyncSuppressionsPage: FC = () => {
   const [sourceUri, setSourceUri] = useState ('')
   const [drivePath, setDrivePath] = useState ('')
   const [driveFileId, setDriveFileId] = useState ('')
-  const [reason, setReason] = useState<MaterialSyncSuppressionReason> (REASONS[0])
+  const [reason, setReason] = useState (REASONS[0])
 
   const { data, isError, isLoading } = useQuery ({
       queryKey: materialsKeys.suppressions (),
@@ -94,11 +82,18 @@ const MaterialSyncSuppressionsPage: FC = () => {
   return (
       <MainArea>
 	<Helmet>
-	  <title>{`素材同期抑止 | ${ SITE_TITLE }`}</title>
+	  <title>{`同期元抑止 | ${ SITE_TITLE }`}</title>
 	</Helmet>
 
 	<div className="space-y-5">
-	  <PageTitle>同期抑止</PageTitle>
+	  <div className="flex flex-wrap items-center justify-between gap-3">
+	    <PageTitle>同期元抑止</PageTitle>
+	    <PrefetchLink
+		to="/materials"
+		className="text-sm text-sky-700 underline underline-offset-2 dark:text-sky-300">
+	      素材一覧へ戻る
+	    </PrefetchLink>
+	  </div>
 
 	  <form
 	      onSubmit={handleSubmit}
@@ -120,7 +115,7 @@ const MaterialSyncSuppressionsPage: FC = () => {
 		    </select>)}
 	      </FormField>
 
-	      <FormField label="同期元 URI">
+	      <FormField label="Source URI">
 		{({ invalid }) => (
 		    <input
 			type="text"
@@ -129,7 +124,7 @@ const MaterialSyncSuppressionsPage: FC = () => {
 			className={inputClass (invalid)}/>)}
 	      </FormField>
 
-	      <FormField label="Google Drive パス">
+	      <FormField label="Drive path">
 		{({ invalid }) => (
 		    <input
 			type="text"
@@ -138,7 +133,7 @@ const MaterialSyncSuppressionsPage: FC = () => {
 			className={inputClass (invalid)}/>)}
 	      </FormField>
 
-	      <FormField label="Google Drive ファイル Id.">
+	      <FormField label="Drive file ID">
 		{({ invalid }) => (
 		    <input
 			type="text"
@@ -147,15 +142,15 @@ const MaterialSyncSuppressionsPage: FC = () => {
 			className={inputClass (invalid)}/>)}
 	      </FormField>
 
-	      <FormField label="事由">
+	      <FormField label="理由">
 		{({ invalid }) => (
 		    <select
 			value={reason}
-			onChange={e => setReason (e.target.value as MaterialSyncSuppressionReason)}
+			onChange={e => setReason (e.target.value)}
 			className={inputClass (invalid)}>
 		      {REASONS.map (value => (
 			  <option key={value} value={value}>
-			    {REASON_NAMES[value]}
+			    {value}
 			  </option>))}
 		    </select>)}
 	      </FormField>
@@ -190,8 +185,7 @@ const MaterialSyncSuppressionsPage: FC = () => {
 		    {suppression.normalizedSourceKey}
 		  </div>
 		  <div className="mt-2 text-sm text-stone-600 dark:text-stone-400">
-		    事由: {reasonName (suppression.reason)} /
-		    登録: {dateString (suppression.createdAt)}
+		    理由: {suppression.reason} / 登録: {dateString (suppression.createdAt)}
 		  </div>
 		</article>))}
 	  </div>