#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/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)
 

frontend/src/components/TopNav.tsx

@@ -58,7 +58,6 @@ export const menuOutline = (
       { name: '素材', to: '/materials', visible: true, subMenu: [
 	  { name: '一覧', to: '/materials' },
 	  { name: '追加', to: '/materials/new' },
-	  { name: '抑止', to: '/materials/suppressions' },
 	  { name: '全体履歴', to: '/materials/changes' },
 	  { name: 'ヘルプ', to: '/wiki/ヘルプ:素材管理' },
 	  { component: <Separator/>, visible: materialFlg },

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) => {
@@ -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>