miteruzo/btrc-hub
1
0
フォーク 0
コード 課題 61 Pull リクエスト 1 リリース Wiki アクティビティ

#399

ソースを参照
このコミットが含まれているのは:
みてるぞ
2026-07-13 00:58:02 +09:00
親 aa96ec95d1
コミット ac82adc6b3
12個のファイルの変更，789行の追加，256行の削除
Patchファイルをダウンロード Diffファイルをダウンロード すべてのファイルを展開 すべてのファイルを折り畳む
backend/app/controllers/post_imports_controller.rb
+6 -7
ファイルの表示
@@ -2,7 +2,7 @@ class PostImportsController < ApplicationController
before_action :require_member!
def preview
rows = PostImportPreviewer.new(existing: params[:existing]).preview_rows(
rows = PostImportPreviewer.new.preview_rows(
rows: PostImportUrlListParser.parse(params[:source]))
render json: { rows: }
rescue ArgumentError => e
@@ -13,18 +13,17 @@ class PostImportsController < ApplicationController
rows = normalised_import_rows(allow_warning_fields: true)
changed_row = Integer(params[:changed_row], exception: false)
result =
PostImportPreviewer.new(existing: params[:existing])
.preview_rows(rows:, fetch_metadata: changed_row, metadata_cache: {})
PostImportPreviewer.new.preview_rows(rows:,
fetch_metadata: changed_row,
metadata_cache: { })
render json: { rows: result }
rescue ArgumentError => e
render_bad_request(e.message)
end
def create
result = PostImportRunner.new(
actor: current_user,
rows: normalised_import_rows,
existing: params[:existing]).run
result = PostImportRunner.new(actor: current_user,
rows: normalised_import_rows).run
render json: result, status: result[:created].positive? ? :created : :ok
rescue ArgumentError => e
render_bad_request(e.message)
backend/app/services/post_import_previewer.rb
+76 -37
ファイルの表示
@@ -8,9 +8,11 @@ class PostImportPreviewer
'tags',
'parent_post_ids',
].freeze
def initialize existing: 'skip'
@existing = existing == 'error' ? 'error' : 'skip'
end
FETCH_WARNING_FIELDS = ['url', 'title', 'thumbnail_base'].freeze
EXISTING_SKIP_WARNING = '既存投稿のためスキップします．'.freeze
TITLE_FETCH_WARNING = 'タイトルを取得できませんでした．'.freeze
THUMBNAIL_FETCH_WARNING = 'サムネールを取得できませんでした．'.freeze
METADATA_FETCH_WARNING = 'メタデータを取得できませんでした．'.freeze
def preview_rows rows:, fetch_metadata: true, metadata_cache: { }
urls = {}
@@ -30,48 +32,60 @@ class PostImportPreviewer
attributes = initial_attributes(row)
provenance = initial_provenance(row)
tag_sources = initial_tag_sources(row, attributes, provenance)
field_warnings = initial_field_warnings(row)
base_warnings = initial_base_warnings(row)
url = row[:url].to_s.strip
provenance['url'] = 'manual'
normal_url = normalised_url(url)
url_for_metadata = normal_url || url
existing_post = normal_url.present? && Post.exists?(url: normal_url)
validation_warnings = []
validation_errors = {}
validation_errors[:url] = ['URL が不正です．'] if normal_url.blank?
validation_errors[:url] = ['URL が重複しています．'] if normal_url.present? && urls.key?(normal_url)
urls[normal_url] = true if normal_url.present?
if normal_url.present? && existing_post
if @existing == 'error'
validation_errors[:url] = ['既存投稿です．']
else
validation_warnings << '既存投稿のためスキップします．'
end
end
if row[:metadata_url].present? && row[:metadata_url] != url_for_metadata
clear_automatic_values!(attributes, provenance, tag_sources)
clear_fetch_warnings!(field_warnings)
end
if normal_url.present? && existing_post
add_field_warning!(field_warnings, 'url', EXISTING_SKIP_WARNING)
attributes['tags'] = merged_tags(tag_sources, provenance['tags'])
warnings_present = field_warnings.values.any?(&:present?) || base_warnings.present?
return {
source_row: row[:source_row],
url: normal_url,
attributes:,
provenance:,
tag_sources:,
metadata_url: url_for_metadata,
field_warnings:,
base_warnings:,
validation_errors:,
status: validation_errors.present? ? 'error' : (warnings_present ? 'warning' : 'ready'),
}
end
fetch_warnings = Array(row[:fetch_warnings]).dup
should_fetch = should_fetch_metadata?(fetch_metadata, row[:source_row].to_i)
if should_fetch && !(existing_post && @existing == 'skip')
metadata, fetch_warnings =
metadata_for(url_for_metadata, metadata_cache, fetch_warnings)
apply_metadata!(attributes, provenance, tag_sources, metadata)
if should_fetch
clear_fetch_warnings!(field_warnings)
metadata = metadata_for(url_for_metadata, metadata_cache)
apply_metadata!(attributes, provenance, tag_sources, metadata[:data])
apply_fetch_warnings!(field_warnings, metadata[:warnings])
end
attributes['url'] = url
validate_basic_data(attributes, validation_errors)
validate_preview_tags(
merged_tags(tag_sources, provenance['tags']),
validate_preview_tags(merged_tags(tag_sources, provenance['tags']),
validation_errors,
validation_warnings,
)
field_warnings)
validate_parents(attributes['parent_post_ids'], validation_errors)
attributes.delete('url')
attributes['tags'] = merged_tags(tag_sources, provenance['tags'])
warnings_present = field_warnings.values.any?(&:present?) || base_warnings.present?
{
source_row: row[:source_row],
url: normal_url || url,
@@ -79,14 +93,10 @@ class PostImportPreviewer
provenance:,
tag_sources:,
metadata_url: url_for_metadata,
fetch_warnings:,
validation_warnings:,
warnings: fetch_warnings + validation_warnings,
field_warnings:,
base_warnings:,
validation_errors:,
status: validation_errors.present? \
? 'error' \
: ((fetch_warnings + validation_warnings).present? ? 'warning' : 'ready'),
existing: existing_post,
status: validation_errors.present? ? 'error' : (warnings_present ? 'warning' : 'ready'),
}
end
@@ -118,6 +128,14 @@ class PostImportPreviewer
sources
end
def initial_field_warnings row
(row[:field_warnings] || { }).stringify_keys.transform_values { |value| Array(value).map(&:to_s) }
end
def initial_base_warnings row
Array(row[:base_warnings]).map(&:to_s)
end
def clear_automatic_values! attributes, provenance, tag_sources
['title', 'thumbnail_base', 'original_created_from',
'original_created_before', 'duration'].each do |field|
@@ -127,18 +145,24 @@ class PostImportPreviewer
attributes['tags'] = merged_tags(tag_sources, provenance['tags'])
end
def metadata_for url, cache, previous_warnings
def clear_fetch_warnings! field_warnings
FETCH_WARNING_FIELDS.each do |field|
field_warnings.delete(field)
end
end
def metadata_for url, cache
cache[url] ||= fetch_metadata(url)
end
def fetch_metadata url
return [{}, ['URL が空です．']] if url.blank?
return { data: { }, warnings: { 'url' => ['URL が空です．'] } } if url.blank?
data = PostMetadataFetcher.fetch(url).stringify_keys
warnings = []
warnings << 'タイトルを取得できませんでした．' if data['title'].blank?
warnings << 'サムネールを取得できませんでした．' if data['thumbnail_base'].blank?
[data.compact, warnings]
data = PostMetadataFetcher.fetch(url).stringify_keys.compact
warnings = { }
add_field_warning!(warnings, 'title', TITLE_FETCH_WARNING) if data['title'].blank?
add_field_warning!(warnings, 'thumbnail_base', THUMBNAIL_FETCH_WARNING) if data['thumbnail_base'].blank?
{ data:, warnings: }
rescue Preview::UrlSafety::UnsafeUrl,
Preview::HttpFetcher::FetchFailed,
Preview::HttpFetcher::ResponseTooLarge => e
@@ -146,7 +170,7 @@ class PostImportPreviewer
"post_import_metadata_fetch_failure "\
"#{ { error: e.class.name, message: e.message }.to_json }",
)
[{}, ['メタデータを取得できませんでした．']]
{ data: { }, warnings: { 'url' => [METADATA_FETCH_WARNING] } }
end
def apply_metadata! attributes, provenance, tag_sources, metadata
@@ -165,13 +189,26 @@ class PostImportPreviewer
end
end
def apply_fetch_warnings! field_warnings, warnings
warnings.each do |field, values|
values.each do |value|
add_field_warning!(field_warnings, field, value)
end
end
end
def add_field_warning! field_warnings, field, message
field_warnings[field] ||= []
field_warnings[field] << message unless field_warnings[field].include?(message)
end
def merged_tags sources, origin = nil
return sources['manual'].to_s if origin == 'manual'
sources['automatic'].to_s
end
def validate_preview_tags raw, errors, warnings
def validate_preview_tags raw, errors, field_warnings
names = raw.to_s.split
return if names.empty?
if names.any? { _1.downcase.start_with?('nico:') }
@@ -185,7 +222,9 @@ class PostImportPreviewer
errors[:tags] = ["廃止済みタグがあります: #{ deprecated.join(' ') }"] if deprecated.present?
known = existing.reject(&:deprecated?).map(&:name)
new_tags = parsed.uniq - known
warnings << "新規タグを作成します: #{ new_tags.join(' ') }" if new_tags.present?
if new_tags.present?
add_field_warning!(field_warnings, 'tags', "新規タグを作成します: #{ new_tags.join(' ') }")
end
rescue Tag::SectionLiteralParseError
errors[:tags] = ['タグ区間の記法が不正です．']
end
backend/app/services/post_import_row_normaliser.rb
+18 -8
ファイルの表示
@@ -64,10 +64,10 @@ class PostImportRowNormaliser
return keys unless allow_warning_fields
keys + [
{ fetch_warnings: [] },
{ fetchWarnings: [] },
{ validation_warnings: [] },
{ validationWarnings: [] },
{ field_warnings: {} },
{ fieldWarnings: {} },
{ base_warnings: [] },
{ baseWarnings: [] },
]
end
private_class_method :permitted_keys
@@ -141,10 +141,12 @@ class PostImportRowNormaliser
def self.normalise_warning_values! normalised, allow_warning_fields:
return unless allow_warning_fields
%w[fetch_warnings validation_warnings].each do |field|
values = normalised[field]
next if values.nil?
field_warnings = normalised['field_warnings']
unless field_warnings.nil? || field_warnings.is_a?(Hash)
raise ArgumentError, '警告の形式が不正です．'
end
field_warnings&.each do |key, values|
raise ArgumentError, '警告の形式が不正です．' unless ATTRIBUTE_FIELDS.include?(key) || key == 'url'
unless values.is_a?(Array) && values.all? { _1.is_a?(String) }
raise ArgumentError, '警告の形式が不正です．'
end
@@ -152,6 +154,14 @@ class PostImportRowNormaliser
raise ArgumentError, '警告が大きすぎます．'
end
end
base_warnings = normalised['base_warnings']
return if base_warnings.nil?
unless base_warnings.is_a?(Array) && base_warnings.all? { _1.is_a?(String) }
raise ArgumentError, '警告の形式が不正です．'
end
raise ArgumentError, '警告が大きすぎます．' if base_warnings.any? { _1.bytesize > PostImportUrlListParser::MAX_URL_BYTES }
end
private_class_method :normalise_warning_values!
backend/app/services/post_import_runner.rb
+3 -5
ファイルの表示
@@ -1,8 +1,7 @@
class PostImportRunner
def initialize actor:, rows:, existing: 'skip'
def initialize actor:, rows:
@actor = actor
@rows = rows
@existing = existing == 'error' ? 'error' : 'skip'
end
def run
@@ -21,8 +20,7 @@ class PostImportRunner
def run_row row
attributes = row.fetch('attributes', { }).transform_keys { _1.to_s.underscore }
preview = PostImportPreviewer.new(existing: @existing)
.preview_rows(
preview = PostImportPreviewer.new.preview_rows(
rows: [{
source_row: row['source_row'],
url: row['url'],
@@ -31,7 +29,7 @@ class PostImportRunner
tag_sources: row['tag_sources'],
}],
fetch_metadata: false).first
if @existing == 'skip' && preview[:existing]
if Array(preview.dig(:field_warnings, 'url')).include?(PostImportPreviewer::EXISTING_SKIP_WARNING)
return row.slice('source_row').merge(status: 'skipped')
end
backend/app/services/post_import_url_list_parser.rb
+1 -1
ファイルの表示
@@ -11,7 +11,7 @@ class PostImportUrlListParser
url = line.strip
next if url.blank?
raise ArgumentError, 'URL が長すぎます．' if url.bytesize > MAX_URL_BYTES
raise ArgumentError, "#{ index + 1 } 行目: URL が長すぎます．" if url.bytesize > MAX_URL_BYTES
{ source_row: index + 1, url: }
}
frontend/src/components/posts/import/PostImportRowDialog.tsx
+59 -4
ファイルの表示
@@ -49,6 +49,10 @@ const buildDraft = (row: PostImportRow): Draft => ({
tags: String (row.attributes.tags ?? ''),
parentPostIds: String (row.attributes.parentPostIds ?? '') })
const warningClass =
'mt-1 rounded-md border border-amber-300 bg-amber-50 px-3 py-2 text-sm '
+ 'text-amber-700 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-200'
const PostImportRowDialog: FC<Props> = (
{ open, row, saving, onOpenChange, onSave },
@@ -102,46 +106,81 @@ const PostImportRowDialog: FC<Props> = (
label="URL"
value={draft.url}
origin={originOf (row, 'url')}
warnings={row.fieldWarnings.url}
errors={[
...(row.validationErrors.url ?? []),
...(row.importErrors?.url ?? [])]}
onChange={value => update ('url', value)}/>
<DialogField
label="タイトル"
value={draft.title}
origin={originOf (row, 'title')}
warnings={row.fieldWarnings.title}
errors={[
...(row.validationErrors.title ?? []),
...(row.importErrors?.title ?? [])]}
onChange={value => update ('title', value)}/>
<DialogField
label="サムネール基底 URL"
value={draft.thumbnailBase}
origin={originOf (row, 'thumbnailBase')}
warnings={row.fieldWarnings.thumbnailBase}
errors={[
...(row.validationErrors.thumbnailBase ?? []),
...(row.importErrors?.thumbnailBase ?? [])]}
onChange={value => update ('thumbnailBase', value)}/>
<div className="grid gap-4 md:grid-cols-2">
<DialogField
label="作成日時 From"
value={draft.originalCreatedFrom}
origin={originOf (row, 'originalCreatedFrom')}
errors={[
...(row.validationErrors.originalCreatedFrom ?? []),
...(row.importErrors?.originalCreatedFrom ?? [])]}
onChange={value => update ('originalCreatedFrom', value)}/>
<DialogField
label="作成日時 Before"
value={draft.originalCreatedBefore}
origin={originOf (row, 'originalCreatedBefore')}
errors={[
...(row.validationErrors.originalCreatedBefore ?? []),
...(row.importErrors?.originalCreatedBefore ?? [])]}
onChange={value => update ('originalCreatedBefore', value)}/>
</div>
<DialogField
label="動画時間"
value={draft.duration}
origin={originOf (row, 'duration')}
errors={[
...(row.validationErrors.duration ?? []),
...(row.validationErrors.videoMs ?? []),
...(row.importErrors?.duration ?? []),
...(row.importErrors?.videoMs ?? [])]}
onChange={value => update ('duration', value)}/>
<DialogArea
label="タグ"
value={draft.tags}
origin={originOf (row, 'tags')}
warnings={row.fieldWarnings.tags}
errors={[
...(row.validationErrors.tags ?? []),
...(row.importErrors?.tags ?? [])]}
onChange={value => update ('tags', value)}/>
<DialogField
label="親投稿"
value={draft.parentPostIds}
origin={originOf (row, 'parentPostIds')}
errors={[
...(row.validationErrors.parentPostIds ?? []),
...(row.importErrors?.parentPostIds ?? [])]}
onChange={value => update ('parentPostIds', value)}/>
<FieldError messages={Object.values (row.validationErrors ?? { }).flat ()}/>
<FieldError messages={Object.values (row.importErrors ?? { }).flat ()}/>
{row.baseWarnings.length > 0 && (
<div className={warningClass}>
{row.baseWarnings.map ((message, index) => (
<div key={`${ message }-${ index }`}>{message}</div>))}
</div>)}
<FieldError messages={row.validationErrors.base}/>
<FieldError messages={row.importErrors?.base}/>
</div>
</div>
@@ -164,10 +203,12 @@ const PostImportRowDialog: FC<Props> = (
}
const DialogField = (
{ label, value, origin, onChange }: {
{ label, value, origin, warnings, errors, onChange }: {
label: string
value: string
origin: PostImportOrigin
warnings?: string[]
errors?: string[]
onChange: (value: string) => void },
) => (
<label className="block space-y-1">
@@ -179,13 +220,21 @@ const DialogField = (
value={value}
onChange={ev => onChange (ev.target.value)}
className={inputClass (false)}/>
{warnings && warnings.length > 0 && (
<div className={warningClass}>
{warnings.map ((message, index) => (
<div key={`${ message }-${ index }`}>{message}</div>))}
</div>)}
<FieldError messages={errors}/>
</label>)
const DialogArea = (
{ label, value, origin, onChange }: {
{ label, value, origin, warnings, errors, onChange }: {
label: string
value: string
origin: PostImportOrigin
warnings?: string[]
errors?: string[]
onChange: (value: string) => void },
) => (
<label className="block space-y-1">
@@ -198,6 +247,12 @@ const DialogArea = (
rows={4}
onChange={ev => onChange (ev.target.value)}
className={inputClass (false)}/>
{warnings && warnings.length > 0 && (
<div className={warningClass}>
{warnings.map ((message, index) => (
<div key={`${ message }-${ index }`}>{message}</div>))}
</div>)}
<FieldError messages={errors}/>
</label>)
export default PostImportRowDialog
frontend/src/components/posts/import/PostImportRowSummary.tsx
+35 -1
ファイルの表示
@@ -1,6 +1,7 @@
import { Button } from '@/components/ui/button'
import { cn } from '@/lib/utils'
import PrefetchLink from '@/components/PrefetchLink'
import PostImportStatusBadge from '@/components/posts/import/PostImportStatusBadge'
import ThumbnailPreview from '@/components/posts/import/ThumbnailPreview'
@@ -48,6 +49,11 @@ const summaryError = (row: PostImportRow): string | null => {
return Object.values (row.importErrors ?? { }).flat ()[0] ?? null
}
const summaryWarning = (row: PostImportRow): string | null =>
Object.values (row.fieldWarnings ?? { }).flat ()[0]
?? row.baseWarnings?.[0]
?? null
const summaryDate = (row: PostImportRow): string =>
[row.attributes.originalCreatedFrom, row.attributes.originalCreatedBefore]
.filter (_1 => typeof _1 === 'string' && _1 !== '')
@@ -56,6 +62,7 @@ const summaryDate = (row: PostImportRow): string =>
const PostImportRowSummary: FC<Props> = ({ row, onEdit }) => {
const error = summaryError (row)
const warning = error == null ? summaryWarning (row) : null
const importStatus = row.importStatus ?? 'pending'
return (
@@ -89,6 +96,21 @@ const PostImportRowSummary: FC<Props> = ({ row, onEdit }) => {
{summaryDate (row) || '日時未取得'}
{row.attributes.duration ? ` / ${ row.attributes.duration }` : ''}
</div>
{row.createdPostId && (
<PrefetchLink
to={`/posts/${ row.createdPostId }`}
className="inline-block text-xs text-sky-700 underline
dark:text-sky-300">
投稿 #{row.createdPostId}
</PrefetchLink>)}
{warning && (
<div className="text-xs text-amber-700 dark:text-amber-200">
{warning}
</div>)}
{error && (
<div className="text-xs text-red-700 dark:text-red-200">
{error}
</div>)}
</div>
<div className="space-y-1">
<PostImportStatusBadge value={importStatus}/>
@@ -96,7 +118,7 @@ const PostImportRowSummary: FC<Props> = ({ row, onEdit }) => {
<div className="space-y-1">
{error
? <PostImportStatusBadge value="error"/>
: <PostImportStatusBadge value="ready"/>}
: (warning ? <PostImportStatusBadge value="warning"/> : <PostImportStatusBadge value="ready"/>)}
</div>
<div className="flex justify-end">
<Button
@@ -128,11 +150,23 @@ const PostImportRowSummary: FC<Props> = ({ row, onEdit }) => {
<div className="flex flex-wrap gap-2">
<PostImportStatusBadge value={row.status}/>
<PostImportStatusBadge value={importStatus}/>
{warning && <PostImportStatusBadge value="warning"/>}
</div>
{row.createdPostId && (
<PrefetchLink
to={`/posts/${ row.createdPostId }`}
className="inline-block text-xs text-sky-700 underline
dark:text-sky-300">
投稿 #{row.createdPostId}
</PrefetchLink>)}
{error && (
<div className="text-xs text-red-700 dark:text-red-200">
{error}
</div>)}
{warning && (
<div className="text-xs text-amber-700 dark:text-amber-200">
{warning}
</div>)}
</div>
</div>
<Button
frontend/src/components/posts/import/ThumbnailPreview.tsx
+4 -3
ファイルの表示
@@ -31,9 +31,10 @@ const ThumbnailPreview: FC<Props> = ({ url, alt = 'サムネール', className =
return (
<div
className={`${ className } flex items-center justify-center rounded border
border-red-300 bg-red-50 p-2 text-center text-xs text-red-700
dark:border-red-900 dark:bg-red-950 dark:text-red-200`}>
表示不可
border-amber-300 bg-amber-50 p-2 text-center text-xs
text-amber-700 dark:border-amber-900 dark:bg-amber-950
dark:text-amber-200`}>
サムネールを表示できません
</div>)
}
frontend/src/lib/postImportSession.ts
+468 -75
ファイルの表示
@@ -12,13 +12,13 @@ export type PostImportRow = {
sourceRow: number
url: string
attributes: Record<string, PostImportAttributeValue>
warnings: string[]
fieldWarnings: Record<string, string[]>
baseWarnings: string[]
validationErrors: Record<string, string[]>
importErrors?: Record<string, string[]>
provenance: Record<string, PostImportOrigin>
tagSources?: Record<PostImportOrigin, string>
status: 'ready' | 'warning' | 'error'
existing: boolean
metadataUrl?: string
createdPostId?: number
importStatus?: PostImportStatus }
@@ -33,13 +33,223 @@ export type PostImportSession = {
version: number
savedAt: string
source: string
existing: 'skip' | 'error'
rows: PostImportRow[]
repairMode: PostImportRepairMode }
const SESSION_VERSION = 1
export type PostImportSourceIssue = {
sourceRow: number
message: string
url: string }
type StorageErrorHandler = (message: string) => void
const SESSION_VERSION = 2
const SESSION_PREFIX = 'post-import-session:'
const SOURCE_DRAFT_KEY = 'post-import-source-draft'
const SESSION_MAX_AGE_MS = 24 * 60 * 60 * 1000
const MAX_ROWS = 100
const MAX_URL_BYTES = 20 * 1024
const isPlainObject = (value: unknown): value is Record<string, unknown> =>
typeof value === 'object' && value != null && !(Array.isArray (value))
const sessionKey = (sessionId: string): string => `${ SESSION_PREFIX }${ sessionId }`
const readStorage = (
key: string,
onError?: StorageErrorHandler,
): string | null => {
if (typeof window === 'undefined')
return null
try
{
return sessionStorage.getItem (key)
}
catch
{
onError?.('保存済みデータを読み込めませんでした．')
return null
}
}
const writeStorage = (
key: string,
value: string,
onError?: StorageErrorHandler,
): boolean => {
if (typeof window === 'undefined')
return false
try
{
sessionStorage.setItem (key, value)
return true
}
catch
{
onError?.('ブラウザへ保存できませんでした．')
return false
}
}
const removeStorage = (
key: string,
onError?: StorageErrorHandler,
) => {
if (typeof window === 'undefined')
return
try
{
sessionStorage.removeItem (key)
}
catch
{
onError?.('保存済みデータを削除できませんでした．')
}
}
const truncateUrl = (value: string): string =>
value.length > 120 ? `${ value.slice (0, 117) }…` : value
const bytesize = (value: string): number =>
new TextEncoder ().encode (value).length
const normaliseImportUrl = (value: string): string | null => {
const trimmed = value.trim ()
if (!(trimmed))
return null
try
{
const url = new URL (trimmed)
if (!(url.protocol === 'http:' || url.protocol === 'https:'))
return null
if (!(url.host))
return null
url.hostname = url.hostname.toLowerCase ()
if (url.pathname.endsWith ('/'))
url.pathname = url.pathname.replace (/\/+$/, '')
return url.toString ()
}
catch
{
return null
}
}
const ensureStringListRecord = (value: unknown): Record<string, string[]> | null => {
if (!(isPlainObject (value)))
return null
const result: Record<string, string[]> = { }
for (const [key, entry] of Object.entries (value))
{
if (!(Array.isArray (entry)) || !(entry.every (_1 => typeof _1 === 'string')))
return null
result[key] = entry
}
return result
}
const isValidStatus = (
value: unknown,
): value is PostImportRow['status'] =>
value === 'ready' || value === 'warning' || value === 'error'
const isValidImportStatus = (
value: unknown,
): value is PostImportStatus =>
value === 'pending'
|| value === 'created'
|| value === 'skipped'
|| value === 'failed'
const isValidOrigin = (
value: unknown,
): value is PostImportOrigin =>
value === 'automatic' || value === 'manual'
const sanitiseRow = (value: unknown): PostImportRow | null => {
if (!(isPlainObject (value)))
return null
if (!(Number.isInteger (value.sourceRow)) || Number (value.sourceRow) <= 0)
return null
if (typeof value.url !== 'string')
return null
if (!(isPlainObject (value.attributes)))
return null
if (!(isPlainObject (value.provenance)))
return null
if (!(isValidStatus (value.status)))
return null
if (value.importStatus != null && !(isValidImportStatus (value.importStatus)))
return null
const validationErrors = ensureStringListRecord (value.validationErrors)
const fieldWarnings = ensureStringListRecord (value.fieldWarnings)
if (validationErrors == null || fieldWarnings == null)
return null
const importErrors =
value.importErrors == null
? undefined
: ensureStringListRecord (value.importErrors)
if (value.importErrors != null && importErrors == null)
return null
if (!(Array.isArray (value.baseWarnings))
|| !(value.baseWarnings.every (_1 => typeof _1 === 'string')))
return null
const provenanceEntries = Object.entries (value.provenance)
if (!(provenanceEntries.every (([, origin]) => isValidOrigin (origin))))
return null
if (value.tagSources != null)
{
if (!(isPlainObject (value.tagSources)))
return null
if (!(Object.values (value.tagSources).every (_1 => typeof _1 === 'string')))
return null
}
return {
sourceRow: Number (value.sourceRow),
url: value.url,
attributes: value.attributes as Record<string, PostImportAttributeValue>,
fieldWarnings,
baseWarnings: value.baseWarnings,
validationErrors,
importErrors,
provenance: value.provenance as Record<string, PostImportOrigin>,
tagSources: value.tagSources as Record<PostImportOrigin, string> | undefined,
status: value.status,
metadataUrl: typeof value.metadataUrl === 'string' ? value.metadataUrl : undefined,
createdPostId:
Number.isInteger (value.createdPostId) ? Number (value.createdPostId) : undefined,
importStatus: value.importStatus }
}
const isExpiredSession = (savedAt: string): boolean => {
const value = Date.parse (savedAt)
return Number.isNaN (value) || Date.now () - value > SESSION_MAX_AGE_MS
}
export const createPostImportSessionId = (): string =>
@@ -48,82 +258,122 @@ export const createPostImportSessionId = (): string =>
: `${ Date.now () }-${ Math.random ().toString (36).slice (2) }`
export const loadPostImportSourceDraft = (): {
source: string
existing: 'skip' | 'error' } => {
export const cleanupExpiredPostImportSessions = (
onError?: StorageErrorHandler,
) => {
if (typeof window === 'undefined')
return { source: '', existing: 'skip' }
return
try
{
const raw = sessionStorage.getItem (SOURCE_DRAFT_KEY)
if (raw == null)
return { source: '', existing: 'skip' }
for (let i = 0; i < sessionStorage.length; ++i)
{
const key = sessionStorage.key (i)
if (key == null || !(key.startsWith (SESSION_PREFIX)))
continue
const value = JSON.parse (raw) as {
source?: string
existing?: 'skip' | 'error' }
return {
source: typeof value.source === 'string' ? value.source : '',
existing: value.existing === 'error' ? 'error' : 'skip' }
const raw = sessionStorage.getItem (key)
if (raw == null)
continue
try
{
const value = JSON.parse (raw) as { savedAt?: string }
if (typeof value.savedAt !== 'string' || isExpiredSession (value.savedAt))
{
sessionStorage.removeItem (key)
--i
}
}
catch
{
return { source: '', existing: 'skip' }
sessionStorage.removeItem (key)
--i
}
}
}
catch
{
onError?.('保存済みデータを整理できませんでした．')
}
}
export const loadPostImportSourceDraft = (
onError?: StorageErrorHandler,
): { source: string } => {
const raw = readStorage (SOURCE_DRAFT_KEY, onError)
if (raw == null)
return { source: '' }
try
{
const value = JSON.parse (raw) as { source?: string }
return { source: typeof value.source === 'string' ? value.source : '' }
}
catch
{
return { source: '' }
}
}
export const savePostImportSourceDraft = (
source: string,
existing: 'skip' | 'error',
onError?: StorageErrorHandler,
): boolean =>
writeStorage (SOURCE_DRAFT_KEY, JSON.stringify ({ source }), onError)
export const clearPostImportSourceDraft = (
onError?: StorageErrorHandler,
) => {
if (typeof window === 'undefined')
return
sessionStorage.setItem (SOURCE_DRAFT_KEY, JSON.stringify ({ source, existing }))
removeStorage (SOURCE_DRAFT_KEY, onError)
}
const sessionKey = (sessionId: string): string => `${ SESSION_PREFIX }${ sessionId }`
export const savePostImportSession = (
sessionId: string,
session: Omit<PostImportSession, 'version' | 'savedAt'>,
) => {
if (typeof window === 'undefined')
return
sessionStorage.setItem (sessionKey (sessionId), JSON.stringify ({
onError?: StorageErrorHandler,
): boolean =>
writeStorage (
sessionKey (sessionId),
JSON.stringify ({
...session,
version: SESSION_VERSION,
savedAt: new Date ().toISOString () }))
}
savedAt: new Date ().toISOString () }),
onError,
)
export const loadPostImportSession = (
sessionId: string,
onError?: StorageErrorHandler,
): PostImportSession | null => {
if (typeof window === 'undefined')
const raw = readStorage (sessionKey (sessionId), onError)
if (raw == null)
return null
try
{
const raw = sessionStorage.getItem (sessionKey (sessionId))
if (raw == null)
return null
const value = JSON.parse (raw) as Partial<PostImportSession>
if (value.version !== SESSION_VERSION || !(Array.isArray (value.rows)))
return null
if (typeof value.savedAt !== 'string' || isExpiredSession (value.savedAt))
{
removeStorage (sessionKey (sessionId), onError)
return null
}
const rows = value.rows.map (sanitiseRow)
if (rows.some (_1 => _1 == null))
return null
return {
version: SESSION_VERSION,
savedAt: typeof value.savedAt === 'string' ? value.savedAt : '',
savedAt: value.savedAt,
source: typeof value.source === 'string' ? value.source : '',
existing: value.existing === 'error' ? 'error' : 'skip',
rows: value.rows as PostImportRow[],
rows: rows as PostImportRow[],
repairMode: value.repairMode === 'failed' ? 'failed' : 'all' }
}
catch
@@ -133,44 +383,122 @@ export const loadPostImportSession = (
}
const rowChanged = (
previous: PostImportRow,
next: PostImportRow,
): boolean =>
previous.url !== next.url
|| JSON.stringify (previous.attributes) !== JSON.stringify (next.attributes)
|| JSON.stringify (previous.provenance) !== JSON.stringify (next.provenance)
|| JSON.stringify (previous.tagSources ?? { }) !== JSON.stringify (next.tagSources ?? { })
export const mergeValidatedImportRows = (
current: PostImportRow[],
validated: PostImportRow[],
): PostImportRow[] =>
current
.map (previous => {
): PostImportRow[] => {
const validatedMap = new Map (validated.map (row => [row.sourceRow, row]))
return current.map (previous => {
if (previous.importStatus === 'created')
return previous
const row = validated.find (_1 => _1.sourceRow === previous.sourceRow)
return row
? {
...row,
importStatus: previous.importStatus,
createdPostId: previous.createdPostId,
importErrors: previous.importErrors,
validationErrors: row.validationErrors ?? { } }
: previous
const row = validatedMap.get (previous.sourceRow)
if (row == null)
return previous
const fieldWarnings =
Object.keys (row.fieldWarnings).length > 0 || row.metadataUrl !== previous.metadataUrl
? { ...row.fieldWarnings }
: { ...previous.fieldWarnings }
for (const [field, origin] of Object.entries (row.provenance))
{
if (origin === 'manual' && String (row.attributes[field] ?? '') !== '')
delete fieldWarnings[field]
}
return {
...previous,
url: row.url,
attributes: row.attributes,
provenance: row.provenance,
tagSources: row.tagSources,
fieldWarnings,
baseWarnings:
row.baseWarnings.length > 0 || row.metadataUrl !== previous.metadataUrl
? row.baseWarnings
: previous.baseWarnings,
validationErrors: row.validationErrors,
status: row.status,
metadataUrl: row.metadataUrl }
})
.concat (validated.filter (row =>
!(current.some (_1 => _1.sourceRow === row.sourceRow))))
}
export const mergePreviewImportRows = (
current: PostImportRow[],
preview: PostImportRow[],
): PostImportRow[] => {
const currentMap = new Map (current.map (row => [row.sourceRow, row]))
return preview.map (row => {
const previous = currentMap.get (row.sourceRow)
if (previous == null)
return row
if (previous.importStatus === 'created')
return previous
const mergedAttributes = { ...row.attributes }
const mergedProvenance = { ...row.provenance }
for (const [field, origin] of Object.entries (previous.provenance))
{
if (origin !== 'manual' || field === 'url')
continue
if (field in previous.attributes)
mergedAttributes[field] = previous.attributes[field]
mergedProvenance[field] = 'manual'
}
const mergedTagSources =
previous.provenance.tags === 'manual'
? {
automatic: row.tagSources?.automatic ?? '',
manual: previous.tagSources?.manual ?? String (previous.attributes.tags ?? '') }
: row.tagSources
const nextRow = {
...row,
attributes: mergedAttributes,
provenance: mergedProvenance,
tagSources: mergedTagSources,
createdPostId: previous.createdPostId,
importStatus: previous.importStatus,
importErrors: previous.importErrors }
if (rowChanged (previous, nextRow))
{
nextRow.importStatus = 'pending'
nextRow.importErrors = undefined
}
return nextRow
})
}
export const mergeImportResults = (
rows: PostImportRow[],
results: PostImportResultRow[],
): PostImportRow[] =>
rows.map (row => {
const result = results.find (_1 => _1.sourceRow === row.sourceRow)
): PostImportRow[] => {
const resultMap = new Map (results.map (row => [row.sourceRow, row]))
return rows.map (row => {
const result = resultMap.get (row.sourceRow)
return result
? {
...row,
importStatus: result.status,
createdPostId: result.post?.id,
importErrors: result.errors,
validationErrors: row.validationErrors }
importErrors: result.errors }
: row
})
}
export const retryImportRow = (
@@ -183,12 +511,6 @@ export const retryImportRow = (
: row)
export const rowMessages = (row: PostImportRow): string[] => [
...row.warnings,
...Object.values (row.validationErrors ?? { }).flat (),
...Object.values (row.importErrors ?? { }).flat ()]
export const countImportSourceLines = (source: string): number =>
source
.split (/\r\n|\n|\r/)
@@ -197,25 +519,96 @@ export const countImportSourceLines = (source: string): number =>
.length
export const countImportSourceValidLines = (source: string): number =>
source
.split (/\r\n|\n|\r/)
.map (_1 => _1.trim ())
.filter (_1 => /^https?:\/\//.test (_1))
.length
export const validateImportSource = (
source: string,
): PostImportSourceIssue[] => {
const lines = source.split (/\r\n|\n|\r/)
const issues: PostImportSourceIssue[] = []
const seen = new Map<string, number> ()
let count = 0
lines.forEach ((rawLine, index) => {
const value = rawLine.trim ()
if (!(value))
return
++count
const sourceRow = index + 1
const displayUrl = truncateUrl (value)
const normalised = normaliseImportUrl (value)
if (count > MAX_ROWS)
{
issues.push ({
sourceRow,
message: `取込件数は ${ MAX_ROWS } 件までです．`,
url: displayUrl })
return
}
if (!(value.startsWith ('http://') || value.startsWith ('https://')))
{
issues.push ({
sourceRow,
message: 'HTTP または HTTPS の URL ではありません．',
url: displayUrl })
return
}
if (bytesize (value) > MAX_URL_BYTES)
{
issues.push ({
sourceRow,
message: 'URL が長すぎます．',
url: displayUrl })
return
}
if (normalised == null)
{
issues.push ({
sourceRow,
message: 'URL の形式が不正です．',
url: displayUrl })
return
}
const duplicateRow = seen.get (normalised)
if (duplicateRow != null)
{
issues.push ({
sourceRow,
message: `${ duplicateRow } 行目と同じ URL です．`,
url: displayUrl })
return
}
seen.set (normalised, sourceRow)
})
return issues
}
const hasSkipWarning = (row: PostImportRow): boolean =>
(row.fieldWarnings.url ?? []).includes ('既存投稿のためスキップします．')
export const submittableImportRows = (rows: PostImportRow[]): PostImportRow[] =>
rows.filter (row => row.importStatus == null || row.importStatus === 'pending')
rows.filter (row => {
if (row.importStatus === 'created')
return false
if (row.importStatus === 'skipped')
return false
if (hasSkipWarning (row))
return false
if (row.importStatus === 'failed')
return false
return row.importStatus == null || row.importStatus === 'pending'
})
export const reviewSummaryCounts = (rows: PostImportRow[]) => ({
total: rows.length,
submittable: rows.filter (row =>
(row.importStatus == null || row.importStatus === 'pending')
submittableImportRows ([row]).length > 0
&& Object.keys (row.validationErrors ?? { }).length === 0).length,
invalid: rows.filter (row => Object.keys (row.validationErrors ?? { }).length > 0).length,
skipPlanned: rows.filter (row =>
row.existing && row.importStatus !== 'created' && row.status !== 'error').length,
hasSkipWarning (row) && row.importStatus !== 'created').length,
created: rows.filter (row => row.importStatus === 'created').length,
failed: rows.filter (row => row.importStatus === 'failed').length })
frontend/src/pages/posts/PostImportResultPage.tsx
+29 -8
ファイルの表示
@@ -13,7 +13,8 @@ import { toast } from '@/components/ui/use-toast'
import { SITE_TITLE } from '@/config'
import { apiPost } from '@/lib/api'
import { canEditContent } from '@/lib/users'
import { loadPostImportSession,
import { clearPostImportSourceDraft,
loadPostImportSession,
mergeImportResults,
retryImportRow,
savePostImportSession,
@@ -63,7 +64,8 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
if (!(sessionId))
return
const loaded = loadPostImportSession (sessionId)
const loaded = loadPostImportSession (sessionId, message =>
toast ({ title: '取込状態を復元できませんでした', description: message }))
setSession (loaded)
setMissing (loaded == null)
}, [sessionId])
@@ -72,7 +74,8 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
if (!(sessionId) || !(session))
return
savePostImportSession (sessionId, session)
savePostImportSession (sessionId, session, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
}, [session, sessionId])
const counts = useMemo (() => ({
@@ -104,8 +107,7 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
attributes: target.attributes,
provenance: target.provenance,
tagSources: target.tagSources,
metadataUrl: target.metadataUrl }],
existing: session.existing })
metadataUrl: target.metadataUrl }] })
setSession (current =>
current
? { ...current, rows: mergeImportResults (current.rows, result.rows) }
@@ -126,7 +128,12 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
const nextSession = { ...session, repairMode: 'failed' as const }
setSession (nextSession)
if (sessionId)
savePostImportSession (sessionId, nextSession)
{
const saved = savePostImportSession (sessionId, nextSession, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
if (!(saved))
return
}
navigate (`/posts/import/${ sessionId }/review?edit=${ sourceRow }`)
}
@@ -185,6 +192,13 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
<div className="text-xs text-neutral-500 dark:text-neutral-400">
{row.url}
</div>
{row.createdPostId && (
<PrefetchLink
to={`/posts/${ row.createdPostId }`}
className="inline-block text-xs text-sky-700 underline
dark:text-sky-300">
投稿 #{row.createdPostId}
</PrefetchLink>)}
<FieldError messages={Object.values (row.importErrors ?? { }).flat ()}/>
</div>
@@ -222,7 +236,10 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
onClick={() => {
const nextSession = { ...session, repairMode: 'all' as const }
setSession (nextSession)
savePostImportSession (sessionId, nextSession)
const saved = savePostImportSession (sessionId, nextSession, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
if (!(saved))
return
navigate (`/posts/import/${ sessionId }/review`)
}}>
確認画面へ戻る
@@ -230,7 +247,11 @@ const PostImportResultPage: FC<Props> = ({ user }) => {
<Button
type="button"
variant="outline"
onClick={() => navigate ('/posts/import')}>
onClick={() => {
clearPostImportSourceDraft (message =>
toast ({ title: '入力内容を削除できませんでした', description: message }))
navigate ('/posts/import')
}}>
新しい URL リストを入力
</Button>
</div>
frontend/src/pages/posts/PostImportReviewPage.tsx
+21 -61
ファイルの表示
@@ -19,7 +19,6 @@ import { loadPostImportSession,
mergeImportResults,
mergeValidatedImportRows,
reviewSummaryCounts,
rowMessages,
savePostImportSession,
submittableImportRows,
type PostImportResultRow,
@@ -59,7 +58,8 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
if (!(sessionId))
return
const loaded = loadPostImportSession (sessionId)
const loaded = loadPostImportSession (sessionId, message =>
toast ({ title: '取込状態を復元できませんでした', description: message }))
setSession (loaded)
setMissing (loaded == null)
}, [sessionId])
@@ -68,7 +68,8 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
if (!(sessionId) || !(session))
return
savePostImportSession (sessionId, session)
savePostImportSession (sessionId, session, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
}, [session, sessionId])
const rows = session?.rows ?? []
@@ -160,8 +161,15 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
try
{
const validated = await apiPost<{ rows: PostImportRow[] }> ('/posts/import/validate', {
rows: nextRows.filter (row => row.importStatus !== 'created'),
existing: session.existing,
rows: nextRows
.filter (row => row.importStatus !== 'created')
.map (row => ({
sourceRow: row.sourceRow,
url: row.url,
attributes: row.attributes,
provenance: row.provenance,
tagSources: row.tagSources,
metadataUrl: row.metadataUrl })),
changed_row: urlChanged ? editingRow.sourceRow : -1 })
updateSessionRows (mergeValidatedImportRows (nextRows, validated.rows))
setSearchParams ({ })
@@ -178,33 +186,6 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
}
}
const updateExisting = async (value: 'skip' | 'error') => {
if (!(session))
return
const pendingRows = session.rows.map (row =>
row.importStatus === 'created'
? row
: {
...row,
importStatus: 'pending' as const,
importErrors: undefined })
setSession ({ ...session, existing: value, rows: pendingRows })
setLoading (true)
try
{
const validated = await apiPost<{ rows: PostImportRow[] }> ('/posts/import/validate', {
rows: pendingRows.filter (row => row.importStatus !== 'created'),
existing: value,
changed_row: -1 })
updateSessionRows (mergeValidatedImportRows (pendingRows, validated.rows))
}
finally
{
setLoading (false)
}
}
const submit = async () => {
if (!(sessionId) || !(session) || submittable.length === 0)
return
@@ -223,12 +204,14 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
attributes: row.attributes,
provenance: row.provenance,
tagSources: row.tagSources,
metadataUrl: row.metadataUrl })),
existing: session.existing })
metadataUrl: row.metadataUrl })) })
const nextRows = mergeImportResults (session.rows, result.rows)
const nextSession = { ...session, rows: nextRows, repairMode: 'all' as const }
setSession (nextSession)
savePostImportSession (sessionId, nextSession)
const saved = savePostImportSession (sessionId, nextSession, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
if (!(saved))
return
navigate (`/posts/import/${ sessionId }/result`)
}
catch
@@ -264,7 +247,7 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
<title>{`投稿インポート確認 | ${ SITE_TITLE }`}</title>
</Helmet>
<div className="mx-auto max-w-6xl space-y-4 p-4 pb-28">
<div className="mx-auto flex max-w-6xl flex-col gap-4 p-4 pb-8">
<PageTitle>投稿情報の確認</PageTitle>
<div className="rounded-lg border bg-white p-4 dark:border-neutral-700
@@ -279,26 +262,7 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
</div>
</div>
<div className="rounded-lg border bg-white p-4 dark:border-neutral-700
dark:bg-neutral-900">
<div className="flex flex-wrap items-center justify-between gap-3">
<div className="text-sm text-neutral-600 dark:text-neutral-300">
URL {rows.length} 件
</div>
<label className="flex items-center gap-2 text-sm">
<span>既存投稿</span>
<select
value={session.existing}
onChange={ev => updateExisting (ev.target.value as 'skip' | 'error')}
className="rounded border border-border bg-background px-3 py-2">
<option value="skip">スキップ</option>
<option value="error">エラー</option>
</select>
</label>
</div>
</div>
<div className="space-y-3">
<div className="flex-1 space-y-3 pb-24">
{reviewRows.map (row => (
<div key={row.sourceRow} id={`post-import-row-${ row.sourceRow }`}>
<PostImportRowSummary
@@ -306,16 +270,12 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
onEdit={() => {
setSearchParams ({ edit: String (row.sourceRow) })
}}/>
{rowMessages (row).length > 0 && (
<div className="mt-2 md:max-w-3xl">
<FieldError messages={rowMessages (row)}/>
</div>)}
</div>))}
</div>
</div>
<div
className="fixed inset-x-0 bottom-0 border-t bg-white/95 p-4 backdrop-blur
className="sticky bottom-0 border-t bg-white/95 p-4 backdrop-blur
dark:border-neutral-700 dark:bg-neutral-950/95">
<div className="mx-auto flex max-w-6xl flex-col gap-3 md:flex-row
md:items-center md:justify-between">
frontend/src/pages/posts/PostImportSourcePage.tsx
+60 -37
ファイルの表示
@@ -1,4 +1,4 @@
import { useEffect, useMemo, useState } from 'react'
import { useEffect, useMemo, useRef, useState } from 'react'
import { Helmet } from 'react-helmet-async'
import { useNavigate } from 'react-router-dom'
@@ -13,11 +13,12 @@ import { apiPost, isApiError } from '@/lib/api'
import { canEditContent } from '@/lib/users'
import { inputClass } from '@/lib/utils'
import { countImportSourceLines,
countImportSourceValidLines,
cleanupExpiredPostImportSessions,
createPostImportSessionId,
loadPostImportSourceDraft,
savePostImportSession,
savePostImportSourceDraft,
validateImportSource,
type PostImportRow } from '@/lib/postImportSession'
import Forbidden from '@/pages/Forbidden'
@@ -33,38 +34,58 @@ const MAX_ROWS = 100
const PostImportSourcePage: FC<Props> = ({ user }) => {
const editable = canEditContent (user)
const navigate = useNavigate ()
const draft = useMemo (() => loadPostImportSourceDraft (), [])
const draft = useMemo (() => loadPostImportSourceDraft (message =>
toast ({ title: '保存済み入力を復元できませんでした', description: message })), [])
const [source, setSource] = useState (draft.source)
const [existing, setExisting] = useState<'skip' | 'error'> (draft.existing)
const [loading, setLoading] = useState (false)
const [error, setError] = useState<string | null> (null)
const [touched, setTouched] = useState (false)
const saveTimer = useRef<number | null> (null)
const lineCount = countImportSourceLines (source)
const validLineCount = countImportSourceValidLines (source)
const issues = useMemo (() => validateImportSource (source), [source])
const messages = [
...(lineCount === 0 ? ['URL を入力してください．'] : []),
...(lineCount > MAX_ROWS ? [`最大 ${ MAX_ROWS } 件までです．`] : []),
...(((touched) && lineCount === 0) ? ['URL を入力してください．'] : []),
...(error ? [error] : [])]
useEffect (() => {
savePostImportSourceDraft (source, existing)
}, [existing, source])
cleanupExpiredPostImportSessions (message =>
toast ({ title: '保存済みデータを整理できませんでした', description: message }))
}, [])
useEffect (() => {
if (saveTimer.current != null)
window.clearTimeout (saveTimer.current)
saveTimer.current = window.setTimeout (() => {
savePostImportSourceDraft (source, message =>
toast ({ title: '入力内容を保存できませんでした', description: message }))
}, 300)
return () => {
if (saveTimer.current != null)
window.clearTimeout (saveTimer.current)
}
}, [source])
const preview = async () => {
setTouched (true)
if (lineCount === 0 || issues.length > 0)
return
setLoading (true)
setError (null)
try
{
const data = await apiPost<{ rows: PostImportRow[] }> ('/posts/import/preview', {
source,
existing })
source })
const sessionId = createPostImportSessionId ()
savePostImportSession (sessionId, {
const saved = savePostImportSession (sessionId, {
source,
existing,
rows: data.rows,
repairMode: 'all' })
repairMode: 'all' }, message =>
toast ({ title: '取込状態を保存できませんでした', description: message }))
if (!(saved))
return
navigate (`/posts/import/${ sessionId }/review`)
}
catch (requestError)
@@ -99,48 +120,50 @@ const PostImportSourcePage: FC<Props> = ({ user }) => {
<div className="rounded-lg border bg-white p-4 dark:border-neutral-700
dark:bg-neutral-900 md:p-6">
<div className="space-y-4">
<div className="space-y-2">
<h2 className="text-lg font-semibold">URL リストを入力</h2>
<p className="text-sm text-neutral-600 dark:text-neutral-300">
一行につき一つの URL を入力してください．
</p>
</div>
<FormField label="URL リスト">
{() => (
<textarea
value={source}
rows={14}
className={inputClass (
messages.length > 0,
messages.length > 0 || issues.length > 0,
'font-mono text-sm',
)}
onChange={ev => setSource (ev.target.value)}/>)}
onBlur={() => {
setTouched (true)
savePostImportSourceDraft (source, message =>
toast ({
title: '入力内容を保存できませんでした',
description: message }))
}}
onChange={ev => {
setSource (ev.target.value)
setError (null)
}}/>)}
</FormField>
<FieldError messages={messages}/>
<div className="space-y-2">
{issues.map (issue => (
<div
key={`${ issue.sourceRow }-${ issue.message }-${ issue.url }`}
className="rounded-md border border-red-300 bg-red-50 p-3 text-sm
text-red-700 dark:border-red-900 dark:bg-red-950
dark:text-red-200">
<div>{issue.sourceRow} 行目: {issue.message}</div>
<div className="mt-1 break-all font-mono text-xs">{issue.url}</div>
</div>))}
</div>
<div className="flex flex-wrap items-center justify-between gap-3 text-sm
text-neutral-600 dark:text-neutral-300">
<div>有効行数: {validLineCount}</div>
<div>最大 {MAX_ROWS} 件</div>
<div>入力件数 {lineCount} / {MAX_ROWS}</div>
</div>
<label className="block space-y-1">
<span className="text-sm font-medium">既存投稿</span>
<select
value={existing}
onChange={ev => setExisting (ev.target.value as typeof existing)}
className={inputClass (false, 'w-full md:w-auto')}>
<option value="skip">スキップ</option>
<option value="error">エラー</option>
</select>
</label>
<div className="flex justify-end">
<Button
type="button"
onClick={preview}
disabled={loading || lineCount === 0 || lineCount > MAX_ROWS}>
disabled={loading || lineCount === 0 || issues.length > 0}>
投稿情報を取得
</Button>
</div>