Reviewed-on: #413 Co-authored-by: miteruzo <miteruzo@naver.com> Co-committed-by: miteruzo <miteruzo@naver.com>
このコミットはPull リクエスト #413 でマージされました．
このコミットが含まれているのは:
@@ -8,6 +8,7 @@ import type { AxiosError, AxiosRequestConfig } from 'axios'
|
||||
type Opt = {
|
||||
params?: AxiosRequestConfig['params']
|
||||
headers?: Record<string, string>
|
||||
signal?: AbortSignal
|
||||
responseType?: 'blob' }
|
||||
|
||||
const client = axios.create ({ baseURL: API_BASE_URL })
|
||||
|
||||
@@ -0,0 +1,72 @@
|
||||
import { createContext, useContext } from 'react'
|
||||
|
||||
import type { ReactNode } from 'react'
|
||||
|
||||
type DialogueVariant = 'default' | 'danger'
|
||||
|
||||
type ConfirmOptions = { title: string
|
||||
description?: ReactNode
|
||||
confirmText?: string
|
||||
cancelText?: string
|
||||
variant?: DialogueVariant }
|
||||
|
||||
type AlertOptions = { title: string
|
||||
description?: ReactNode
|
||||
okText?: string }
|
||||
|
||||
type Choice<T extends string> = { value: T
|
||||
label: string
|
||||
variant?: DialogueVariant }
|
||||
|
||||
type ChoiceOptions<T extends string> = { title: string
|
||||
description?: ReactNode
|
||||
choices: Choice<T>[]
|
||||
cancelText?: string }
|
||||
|
||||
type DialogueFormAction = {
|
||||
label: string
|
||||
placement?: 'start' | 'end'
|
||||
variant?: DialogueVariant
|
||||
disabled?: boolean
|
||||
onSelect: () => Promise<boolean | void> | boolean | void }
|
||||
|
||||
type DialogueFormControls = {
|
||||
close: () => void
|
||||
setActions: (actions: DialogueFormAction[]) => void
|
||||
confirm: (options: ConfirmOptions) => Promise<boolean> }
|
||||
|
||||
type DialogueFormOptions = { title: string
|
||||
description?: ReactNode
|
||||
body: (controls: DialogueFormControls) => ReactNode
|
||||
cancelText?: string
|
||||
size?: 'default' | 'large' }
|
||||
|
||||
type DialogueAPI =
|
||||
{ confirm: (options: ConfirmOptions) => Promise<boolean>
|
||||
alert: (options: AlertOptions) => Promise<void>
|
||||
choice: <T extends string> (options: ChoiceOptions<T>) => Promise<T | null>
|
||||
form: (options: DialogueFormOptions) => Promise<void> }
|
||||
|
||||
const DialogueContext = createContext<DialogueAPI | null> (null)
|
||||
|
||||
const useDialogue = () => {
|
||||
const dialogue = useContext (DialogueContext)
|
||||
|
||||
if (dialogue == null)
|
||||
throw new Error ('useDialogue must be used inside DialogueProvider')
|
||||
|
||||
return dialogue
|
||||
}
|
||||
|
||||
export { DialogueContext, useDialogue }
|
||||
export default useDialogue
|
||||
export type {
|
||||
AlertOptions,
|
||||
Choice,
|
||||
ChoiceOptions,
|
||||
ConfirmOptions,
|
||||
DialogueAPI,
|
||||
DialogueFormAction,
|
||||
DialogueFormControls,
|
||||
DialogueFormOptions,
|
||||
DialogueVariant }
|
||||
@@ -0,0 +1,292 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
|
||||
import { creatableImportRows,
|
||||
buildNextEditedRow,
|
||||
canEditResultRow,
|
||||
canEditReviewRow,
|
||||
canRetryResultRow,
|
||||
hasExactSourceRows,
|
||||
initialisePreviewRows,
|
||||
mergeImportResults,
|
||||
mergeValidatedImportRow,
|
||||
mergeValidatedImportRows,
|
||||
processableImportRows,
|
||||
replaceImportRow,
|
||||
resultRepairMode,
|
||||
resultRowMessages,
|
||||
resultSummaryCounts,
|
||||
retryImportRow,
|
||||
reviewSummaryCounts } from '@/lib/postImportRows'
|
||||
import { buildPostImportRow } from '@/test/postImportFactories'
|
||||
|
||||
describe ('post import row state', () => {
|
||||
it ('separates processable existing rows from creatable rows', () => {
|
||||
const ready = buildPostImportRow ({ sourceRow: 1 })
|
||||
const existing = buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
skipReason: 'existing',
|
||||
existingPostId: 20 })
|
||||
const manual = buildPostImportRow ({
|
||||
sourceRow: 3,
|
||||
skipReason: 'manual' })
|
||||
const invalid = buildPostImportRow ({
|
||||
sourceRow: 4,
|
||||
status: 'error',
|
||||
validationErrors: { url: ['invalid'] } })
|
||||
const created = buildPostImportRow ({
|
||||
sourceRow: 5,
|
||||
importStatus: 'created',
|
||||
createdPostId: 40 })
|
||||
const rows = [ready, existing, manual, invalid, created]
|
||||
|
||||
expect (processableImportRows (rows)).toEqual ([ready])
|
||||
expect (creatableImportRows (rows)).toEqual ([ready])
|
||||
expect (reviewSummaryCounts (rows)).toEqual ({
|
||||
creatable: 1,
|
||||
manualSkipped: 1,
|
||||
existingSkipped: 1,
|
||||
pendingOrError: 1 })
|
||||
})
|
||||
|
||||
it ('preserves terminal rows while merging validation results', () => {
|
||||
const created = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
importStatus: 'created',
|
||||
createdPostId: 10,
|
||||
attributes: { title: 'created title' } })
|
||||
const pending = buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
fieldWarnings: { title: ['old warning'] },
|
||||
provenance: { title: 'manual' },
|
||||
attributes: { title: 'manual title' } })
|
||||
const validated = [
|
||||
buildPostImportRow ({ sourceRow: 1, attributes: { title: 'changed' } }),
|
||||
buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
fieldWarnings: { title: ['fetch warning'], tags: ['tag warning'] },
|
||||
provenance: { title: 'manual' },
|
||||
attributes: { title: 'manual title' } })]
|
||||
|
||||
const result = mergeValidatedImportRows ([created, pending], validated)
|
||||
|
||||
expect (result[0]).toBe (created)
|
||||
expect (result[1]?.fieldWarnings).toEqual ({ tags: ['tag warning'] })
|
||||
})
|
||||
|
||||
it ('updates the reset snapshot only after metadata URL changes', () => {
|
||||
const current = buildPostImportRow ({
|
||||
attributes: { title: 'manual title' },
|
||||
metadataUrl: 'https://example.com/old' })
|
||||
const validated = buildPostImportRow ({
|
||||
attributes: { title: 'new metadata title' },
|
||||
metadataUrl: 'https://example.com/new',
|
||||
fieldWarnings: { title: ['warning'] },
|
||||
baseWarnings: ['base warning'] })
|
||||
|
||||
const result = mergeValidatedImportRows ([current], [validated])[0]
|
||||
|
||||
expect (result?.resetSnapshot).toMatchObject ({
|
||||
attributes: { title: 'new metadata title' },
|
||||
fieldWarnings: { title: ['warning'] },
|
||||
baseWarnings: ['base warning'],
|
||||
metadataUrl: 'https://example.com/new' })
|
||||
})
|
||||
|
||||
it ('merges result states and clears incompatible post identifiers', () => {
|
||||
const created = mergeImportResults ([buildPostImportRow ({
|
||||
skipReason: 'existing',
|
||||
existingPostId: 2,
|
||||
recoverable: true,
|
||||
importStatus: 'pending' })], [{
|
||||
sourceRow: 1,
|
||||
status: 'created',
|
||||
post: { id: 3 } }])[0]
|
||||
const skipped = mergeImportResults ([buildPostImportRow ({
|
||||
createdPostId: 3,
|
||||
importStatus: 'created',
|
||||
recoverable: true })], [{
|
||||
sourceRow: 1,
|
||||
status: 'skipped',
|
||||
existingPostId: 4 }])[0]
|
||||
const failed = mergeImportResults ([buildPostImportRow ({
|
||||
skipReason: 'existing',
|
||||
existingPostId: 4 })], [{
|
||||
sourceRow: 1,
|
||||
status: 'failed',
|
||||
recoverable: true,
|
||||
errors: { base: ['failure'] } }])[0]
|
||||
|
||||
expect (created).toMatchObject ({
|
||||
importStatus: 'created',
|
||||
createdPostId: 3,
|
||||
existingPostId: undefined,
|
||||
recoverable: undefined,
|
||||
skipReason: undefined })
|
||||
expect (skipped).toMatchObject ({
|
||||
importStatus: 'skipped',
|
||||
existingPostId: 4,
|
||||
createdPostId: undefined,
|
||||
recoverable: undefined,
|
||||
skipReason: 'existing' })
|
||||
expect (failed).toMatchObject ({
|
||||
importStatus: 'failed',
|
||||
recoverable: true,
|
||||
createdPostId: undefined,
|
||||
existingPostId: undefined,
|
||||
skipReason: undefined,
|
||||
importErrors: { base: ['failure'] } })
|
||||
})
|
||||
|
||||
it ('retries only the selected failed row and counts results exclusively', () => {
|
||||
const rows = [
|
||||
buildPostImportRow ({ sourceRow: 1, importStatus: 'created', createdPostId: 1 }),
|
||||
buildPostImportRow ({ sourceRow: 2, importStatus: 'skipped',
|
||||
existingPostId: 2, skipReason: 'existing' }),
|
||||
buildPostImportRow ({ sourceRow: 3, importStatus: 'failed',
|
||||
recoverable: true, importErrors: { base: ['failed'] } }),
|
||||
buildPostImportRow ({ sourceRow: 4, importStatus: 'pending',
|
||||
recoverable: true, validationErrors: { base: ['failed'] } })]
|
||||
|
||||
expect (resultSummaryCounts (rows)).toEqual ({ created: 1, skipped: 1, failed: 2 })
|
||||
expect (retryImportRow (rows, 3)[2]).toMatchObject ({
|
||||
importStatus: 'pending',
|
||||
importErrors: undefined })
|
||||
expect (retryImportRow (rows, 4)[3]).toBe (rows[3])
|
||||
})
|
||||
|
||||
it ('deduplicates messages and keeps repair mode only for repairable rows', () => {
|
||||
const repairable = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
importStatus: 'pending',
|
||||
validationErrors: { title: ['invalid'], base: ['duplicate'] },
|
||||
importErrors: { base: ['duplicate'], url: ['network'] } })
|
||||
const complete = buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
importStatus: 'created',
|
||||
createdPostId: 2 })
|
||||
|
||||
expect (resultRowMessages (repairable)).toEqual (['invalid', 'duplicate', 'network'])
|
||||
expect (resultRepairMode ([repairable, complete])).toBe ('failed')
|
||||
expect (resultRepairMode ([complete])).toBe ('all')
|
||||
})
|
||||
|
||||
it ('classifies editable and retryable rows by terminal and recoverable state', () => {
|
||||
const ready = buildPostImportRow ()
|
||||
const skipped = buildPostImportRow ({
|
||||
importStatus: 'skipped',
|
||||
skipReason: 'existing',
|
||||
existingPostId: 2 })
|
||||
const hardFailed = buildPostImportRow ({
|
||||
importStatus: 'failed',
|
||||
importErrors: { base: ['failed'] } })
|
||||
const pendingInvalid = buildPostImportRow ({
|
||||
importStatus: 'pending',
|
||||
recoverable: true,
|
||||
validationErrors: { title: ['invalid'] } })
|
||||
const pendingValid = buildPostImportRow ({
|
||||
importStatus: 'pending',
|
||||
recoverable: true })
|
||||
|
||||
expect (canEditReviewRow (ready)).toBe (true)
|
||||
expect (canEditReviewRow (skipped)).toBe (false)
|
||||
expect (canEditReviewRow (hardFailed)).toBe (false)
|
||||
expect (canEditResultRow (pendingInvalid)).toBe (true)
|
||||
expect (canRetryResultRow (pendingInvalid)).toBe (false)
|
||||
expect (canRetryResultRow (pendingValid)).toBe (true)
|
||||
})
|
||||
|
||||
it ('detects missing, duplicate, and extra source rows exactly', () => {
|
||||
expect (hasExactSourceRows ([1, 2], [{ sourceRow: 1 }, { sourceRow: 2 }])).toBe (true)
|
||||
expect (hasExactSourceRows ([1, 2], [{ sourceRow: 1 }])).toBe (false)
|
||||
expect (hasExactSourceRows ([1, 2], [{ sourceRow: 1 }, { sourceRow: 1 }])).toBe (false)
|
||||
expect (hasExactSourceRows ([1, 2], [{ sourceRow: 1 }, { sourceRow: 3 }])).toBe (false)
|
||||
})
|
||||
|
||||
it ('merges only the validated source row and preserves other row edits', () => {
|
||||
const edited = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
attributes: { title: 'edited row' },
|
||||
provenance: { title: 'manual' } })
|
||||
const other = buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
attributes: { title: 'keep me' },
|
||||
provenance: { title: 'manual' } })
|
||||
const validated = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
attributes: { title: 'validated row' } })
|
||||
|
||||
const result = mergeValidatedImportRow ([edited, other], validated)
|
||||
|
||||
expect (result[0]?.attributes.title).toBe ('validated row')
|
||||
expect (result[1]?.attributes.title).toBe ('keep me')
|
||||
})
|
||||
|
||||
it ('replaces only the targeted source row and preserves the others', () => {
|
||||
const original = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
importStatus: 'failed',
|
||||
recoverable: true,
|
||||
importErrors: { base: ['failed'] } })
|
||||
const other = buildPostImportRow ({
|
||||
sourceRow: 2,
|
||||
attributes: { title: 'keep edited row' } })
|
||||
const restored = buildPostImportRow ({
|
||||
sourceRow: 1,
|
||||
importStatus: 'failed',
|
||||
recoverable: true,
|
||||
importErrors: { base: ['failed'] } })
|
||||
|
||||
const result = replaceImportRow ([original, other], restored)
|
||||
|
||||
expect (result[0]).toEqual (restored)
|
||||
expect (result[1]?.attributes.title).toBe ('keep edited row')
|
||||
})
|
||||
|
||||
it ('copies reset snapshot values instead of sharing mutable records', () => {
|
||||
const row = buildPostImportRow ({ fieldWarnings: { title: ['warning'] } })
|
||||
const initialised = initialisePreviewRows ([row])[0]
|
||||
expect (initialised).toBeDefined ()
|
||||
if (initialised == null)
|
||||
return
|
||||
|
||||
initialised.attributes.title = 'changed'
|
||||
initialised.fieldWarnings.title?.push ('another')
|
||||
|
||||
expect (initialised.resetSnapshot.attributes.title).toBe ('')
|
||||
expect (initialised.resetSnapshot.fieldWarnings.title).toEqual (['warning'])
|
||||
})
|
||||
|
||||
it ('builds the next edited row with shared repair semantics', () => {
|
||||
const row = buildPostImportRow ({
|
||||
url: 'https://example.com/original',
|
||||
importStatus: 'failed',
|
||||
recoverable: true,
|
||||
importErrors: { base: ['failed'] },
|
||||
attributes: { title: 'old title', tags: 'old-tag', duration: '2' },
|
||||
provenance: { title: 'automatic', tags: 'automatic', url: 'manual' },
|
||||
tagSources: { automatic: 'old-tag', manual: '' } })
|
||||
|
||||
const nextRow = buildNextEditedRow (
|
||||
row,
|
||||
{
|
||||
url: 'https://example.com/edited',
|
||||
title: 'edited title',
|
||||
thumbnailBase: '',
|
||||
originalCreatedFrom: '',
|
||||
originalCreatedBefore: '',
|
||||
duration: '2',
|
||||
tags: 'edited-tag',
|
||||
parentPostIds: '' },
|
||||
true)
|
||||
|
||||
expect (nextRow.importStatus).toBe ('pending')
|
||||
expect (nextRow.importErrors).toBeUndefined ()
|
||||
expect (nextRow.url).toBe ('https://example.com/edited')
|
||||
expect (nextRow.attributes.title).toBe ('edited title')
|
||||
expect (nextRow.attributes.duration).toBe ('2')
|
||||
expect (nextRow.attributes.tags).toBe ('edited-tag')
|
||||
expect (nextRow.provenance.title).toBe ('manual')
|
||||
expect (nextRow.provenance.url).toBe ('manual')
|
||||
expect (nextRow.tagSources?.manual).toBe ('edited-tag')
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,421 @@
|
||||
import type { PostImportEditableDraft,
|
||||
PostImportResultRow,
|
||||
PostImportRow } from '@/lib/postImportTypes'
|
||||
|
||||
const THUMBNAIL_MISSING_WARNING = 'サムネールなし'
|
||||
|
||||
export const hasThumbnailBaseValue = (value: unknown): boolean =>
|
||||
typeof value === 'string' && value.trim () !== ''
|
||||
|
||||
export const hasVideoTag = (value: unknown): boolean =>
|
||||
typeof value === 'string'
|
||||
&& value.split (/\s+/).includes ('動画')
|
||||
|
||||
export const isExistingSkipRow = (row: PostImportRow): boolean =>
|
||||
row.skipReason === 'existing'
|
||||
|
||||
|
||||
export const isManualSkipRow = (row: PostImportRow): boolean =>
|
||||
row.skipReason === 'manual'
|
||||
|
||||
|
||||
const hasSkipReason = (row: PostImportRow): boolean =>
|
||||
row.skipReason != null
|
||||
|
||||
export const compactMessageRecord = (
|
||||
messages: Record<string, string[]>,
|
||||
): Record<string, string[]> =>
|
||||
Object.fromEntries (
|
||||
Object.entries (messages).filter (([, values]) => values.length > 0))
|
||||
|
||||
|
||||
export const hasErrorMessages = (
|
||||
messages: Record<string, string[]>,
|
||||
): boolean =>
|
||||
Object.values (messages).some (values => values.length > 0)
|
||||
|
||||
|
||||
const hasValidationErrors = (row: PostImportRow): boolean =>
|
||||
hasErrorMessages (row.validationErrors ?? { })
|
||||
|
||||
const isRecoverableRow = (row: PostImportRow): boolean =>
|
||||
row.recoverable === true
|
||||
|
||||
const isRepairableImportStatus = (row: PostImportRow): boolean =>
|
||||
isRecoverableRow (row)
|
||||
&& (row.importStatus === 'failed' || row.importStatus === 'pending')
|
||||
|
||||
|
||||
export const isNonRecoverableFailedRow = (row: PostImportRow): boolean =>
|
||||
row.importStatus === 'failed' && row.recoverable !== true
|
||||
|
||||
|
||||
export const isTerminalRow = (row: PostImportRow): boolean =>
|
||||
row.importStatus === 'created'
|
||||
|| row.importStatus === 'skipped'
|
||||
|| isNonRecoverableFailedRow (row)
|
||||
|
||||
|
||||
export const isCompletedReviewRow = (row: PostImportRow): boolean =>
|
||||
row.importStatus === 'created'
|
||||
|| row.importStatus === 'skipped'
|
||||
|| hasSkipReason (row)
|
||||
|
||||
|
||||
export const validatableImportRows = (rows: PostImportRow[]): PostImportRow[] =>
|
||||
rows.filter (row => !(hasSkipReason (row)) && !(isTerminalRow (row)))
|
||||
|
||||
const buildResetSnapshot = (row: PostImportRow) => ({
|
||||
url: row.url,
|
||||
attributes: { ...row.attributes },
|
||||
displayTags: row.displayTags?.map (tag => ({
|
||||
name: tag.name,
|
||||
category: tag.category,
|
||||
sectionLiterals: tag.sectionLiterals == null ? undefined : [...tag.sectionLiterals] })) ?? [],
|
||||
provenance: { ...row.provenance },
|
||||
tagSources: {
|
||||
automatic: row.tagSources?.automatic ?? '',
|
||||
manual: row.tagSources?.manual ?? '' },
|
||||
fieldWarnings: Object.fromEntries (
|
||||
Object.entries (row.fieldWarnings).map (([key, values]) => [key, [...values]])),
|
||||
baseWarnings: [...row.baseWarnings],
|
||||
metadataUrl: row.metadataUrl })
|
||||
|
||||
const deduped = (values: string[]): string[] =>
|
||||
[...new Set (values)]
|
||||
|
||||
|
||||
const thumbnailWarnings = (row: PostImportRow): string[] => {
|
||||
const current = row.fieldWarnings.thumbnailBase ?? []
|
||||
const others = current.filter (message => message !== THUMBNAIL_MISSING_WARNING)
|
||||
return hasThumbnailBaseValue (row.attributes.thumbnailBase) || row.thumbnailFile != null
|
||||
? others
|
||||
: deduped ([...others, THUMBNAIL_MISSING_WARNING])
|
||||
}
|
||||
|
||||
|
||||
export const applyThumbnailWarning = (row: PostImportRow): PostImportRow => ({
|
||||
...row,
|
||||
fieldWarnings: compactMessageRecord ({
|
||||
...row.fieldWarnings,
|
||||
thumbnailBase: thumbnailWarnings (row) }) })
|
||||
|
||||
|
||||
export const applyThumbnailWarnings = (rows: PostImportRow[]): PostImportRow[] =>
|
||||
rows.map (row => applyThumbnailWarning (row))
|
||||
|
||||
|
||||
export const processableImportRows = (rows: PostImportRow[]): PostImportRow[] =>
|
||||
validatableImportRows (rows).filter (row => {
|
||||
if (row.status === 'pending')
|
||||
return false
|
||||
if (row.importStatus === 'created')
|
||||
return false
|
||||
if (row.importStatus === 'skipped')
|
||||
return false
|
||||
if (row.importStatus === 'failed')
|
||||
return false
|
||||
if (hasValidationErrors (row))
|
||||
return false
|
||||
return row.importStatus == null || row.importStatus === 'pending'
|
||||
})
|
||||
|
||||
export const creatableImportRows = (rows: PostImportRow[]): PostImportRow[] =>
|
||||
processableImportRows (rows).filter (row => !(hasSkipReason (row)))
|
||||
|
||||
|
||||
export const reviewSummaryCounts = (rows: PostImportRow[]) => ({
|
||||
creatable: rows.filter (row => creatableImportRows ([row]).length > 0).length,
|
||||
manualSkipped: rows.filter (row => isManualSkipRow (row)).length,
|
||||
existingSkipped: rows.filter (row => isExistingSkipRow (row)).length,
|
||||
pendingOrError: rows.filter (row =>
|
||||
!(isCompletedReviewRow (row))
|
||||
&& creatableImportRows ([row]).length === 0).length })
|
||||
|
||||
|
||||
export const resultSummaryCounts = (rows: PostImportRow[]) =>
|
||||
rows.reduce (
|
||||
(counts, row) => {
|
||||
if (row.importStatus === 'created')
|
||||
{
|
||||
++counts.created
|
||||
return counts
|
||||
}
|
||||
if (row.importStatus === 'skipped')
|
||||
{
|
||||
++counts.skipped
|
||||
return counts
|
||||
}
|
||||
if (row.importStatus === 'failed'
|
||||
|| (row.recoverable === true && row.importStatus === 'pending'))
|
||||
++counts.failed
|
||||
return counts
|
||||
},
|
||||
{ created: 0, skipped: 0, failed: 0 })
|
||||
|
||||
|
||||
export const resultRepairMode = (
|
||||
rows: PostImportRow[],
|
||||
): 'all' | 'failed' =>
|
||||
rows.some (row => hasValidationErrors (row) || isRepairableImportStatus (row))
|
||||
? 'failed'
|
||||
: 'all'
|
||||
|
||||
|
||||
export const canEditReviewRow = (row: PostImportRow): boolean =>
|
||||
!(hasSkipReason (row)
|
||||
|| row.importStatus === 'created'
|
||||
|| row.importStatus === 'skipped'
|
||||
|| (row.importStatus === 'failed' && row.recoverable !== true))
|
||||
|
||||
|
||||
export const canEditResultRow = (row: PostImportRow): boolean =>
|
||||
row.skipReason == null
|
||||
&& row.recoverable === true
|
||||
&& (row.importStatus === 'failed'
|
||||
|| (row.importStatus === 'pending' && hasValidationErrors (row)))
|
||||
|
||||
|
||||
export const canRetryResultRow = (row: PostImportRow): boolean =>
|
||||
row.skipReason == null
|
||||
&& row.recoverable === true
|
||||
&& (row.importStatus === 'failed'
|
||||
|| (row.importStatus === 'pending' && !(hasValidationErrors (row))))
|
||||
|
||||
|
||||
export const resultRowMessages = (row: PostImportRow): string[] =>
|
||||
[...new Set ([
|
||||
...Object.values (row.validationErrors ?? { }).flat (),
|
||||
...Object.values (row.importErrors ?? { }).flat ()])]
|
||||
|
||||
|
||||
export const resultRowWarnings = (row: PostImportRow): string[] =>
|
||||
[...new Set ([
|
||||
...Object.values (row.fieldWarnings ?? { }).flat (),
|
||||
...row.baseWarnings])]
|
||||
|
||||
|
||||
const isManualChange = (
|
||||
current: unknown,
|
||||
next: string,
|
||||
): boolean =>
|
||||
next !== String (current ?? '')
|
||||
|
||||
|
||||
export const buildNextEditedRow = (
|
||||
editingRow: PostImportRow,
|
||||
draft: PostImportEditableDraft,
|
||||
urlChanged: boolean,
|
||||
): PostImportRow => {
|
||||
const nextProvenance = { ...editingRow.provenance }
|
||||
const nextAttributes = { ...editingRow.attributes }
|
||||
const nextTagSources = {
|
||||
automatic: editingRow.tagSources?.automatic ?? '',
|
||||
manual: editingRow.tagSources?.manual ?? '' }
|
||||
const draftFields = [
|
||||
['title', draft.title],
|
||||
['thumbnailBase', draft.thumbnailBase],
|
||||
['originalCreatedFrom', draft.originalCreatedFrom],
|
||||
['originalCreatedBefore', draft.originalCreatedBefore],
|
||||
['duration', draft.duration],
|
||||
['parentPostIds', draft.parentPostIds]] as const
|
||||
draftFields.forEach (([field, value]) => {
|
||||
nextAttributes[field] = value
|
||||
nextProvenance[field] =
|
||||
isManualChange (editingRow.attributes[field], value)
|
||||
? 'manual'
|
||||
: (editingRow.provenance[field] ?? 'automatic')
|
||||
})
|
||||
nextAttributes.tags = draft.tags
|
||||
if (isManualChange (editingRow.attributes.tags, draft.tags))
|
||||
{
|
||||
nextProvenance.tags = 'manual'
|
||||
nextTagSources.manual = draft.tags
|
||||
}
|
||||
else
|
||||
{
|
||||
nextProvenance.tags = editingRow.provenance.tags ?? 'automatic'
|
||||
nextTagSources.manual = editingRow.tagSources?.manual ?? ''
|
||||
}
|
||||
|
||||
return {
|
||||
...editingRow,
|
||||
url: draft.url,
|
||||
attributes: nextAttributes,
|
||||
displayTags:
|
||||
editingRow.displayTags?.map (tag => ({
|
||||
name: tag.name,
|
||||
category: tag.category,
|
||||
sectionLiterals: tag.sectionLiterals == null ? undefined : [...tag.sectionLiterals] })),
|
||||
thumbnailFile: draft.thumbnailFile,
|
||||
provenance: {
|
||||
...nextProvenance,
|
||||
url: urlChanged ? 'manual' : (editingRow.provenance.url ?? 'manual') },
|
||||
tagSources: nextTagSources,
|
||||
importStatus: editingRow.importStatus === 'created' ? 'created' : 'pending',
|
||||
importErrors: undefined }
|
||||
}
|
||||
|
||||
|
||||
export const hasExactSourceRows = (
|
||||
expected: number[],
|
||||
actual: Array<{ sourceRow: number }>,
|
||||
): boolean => {
|
||||
if (expected.length !== actual.length)
|
||||
return false
|
||||
|
||||
const expectedSorted = [...expected].sort ((a, b) => a - b)
|
||||
const actualSorted = actual.map (row => row.sourceRow).sort ((a, b) => a - b)
|
||||
return expectedSorted.every ((value, index) => value === actualSorted[index])
|
||||
}
|
||||
|
||||
|
||||
export const replaceImportRow = (
|
||||
rows: PostImportRow[],
|
||||
nextRow: PostImportRow,
|
||||
): PostImportRow[] =>
|
||||
rows.map (row => row.sourceRow === nextRow.sourceRow ? nextRow : row)
|
||||
|
||||
|
||||
export const mergeValidatedImportRow = (
|
||||
rows: PostImportRow[],
|
||||
validated: PostImportRow,
|
||||
): PostImportRow[] => {
|
||||
const current = rows.find (row => row.sourceRow === validated.sourceRow)
|
||||
if (current == null)
|
||||
return rows
|
||||
|
||||
const [merged] = mergeValidatedImportRows ([current], [validated])
|
||||
return merged == null ? rows : replaceImportRow (rows, merged)
|
||||
}
|
||||
|
||||
|
||||
export const mergeValidatedImportRows = (
|
||||
current: PostImportRow[],
|
||||
validated: PostImportRow[],
|
||||
): PostImportRow[] => {
|
||||
const validatedMap = new Map (validated.map (row => [row.sourceRow, row]))
|
||||
return current.map (previous => {
|
||||
if (
|
||||
previous.importStatus === 'created'
|
||||
|| previous.importStatus === 'skipped'
|
||||
|| previous.importStatus === 'failed')
|
||||
return previous
|
||||
|
||||
const row = validatedMap.get (previous.sourceRow)
|
||||
if (row == null)
|
||||
return previous
|
||||
|
||||
const fieldWarnings =
|
||||
hasErrorMessages (row.fieldWarnings) || row.metadataUrl !== previous.metadataUrl
|
||||
? { ...row.fieldWarnings }
|
||||
: { ...previous.fieldWarnings }
|
||||
for (const [field, origin] of Object.entries (row.provenance))
|
||||
{
|
||||
if (origin === 'manual')
|
||||
delete fieldWarnings[field]
|
||||
}
|
||||
|
||||
return {
|
||||
...previous,
|
||||
url: row.url,
|
||||
attributes: row.attributes,
|
||||
displayTags:
|
||||
row.displayTags?.map (tag => ({
|
||||
name: tag.name,
|
||||
category: tag.category,
|
||||
sectionLiterals:
|
||||
tag.sectionLiterals == null ? undefined : [...tag.sectionLiterals] })),
|
||||
provenance: row.provenance,
|
||||
tagSources: row.tagSources,
|
||||
skipReason: row.skipReason,
|
||||
existingPostId: row.existingPostId,
|
||||
existingPost: row.existingPost,
|
||||
fieldWarnings,
|
||||
baseWarnings:
|
||||
row.baseWarnings.length > 0 || row.metadataUrl !== previous.metadataUrl
|
||||
? row.baseWarnings
|
||||
: previous.baseWarnings,
|
||||
validationErrors: row.validationErrors,
|
||||
status: row.status,
|
||||
metadataUrl: row.metadataUrl,
|
||||
resetSnapshot:
|
||||
row.metadataUrl !== previous.metadataUrl
|
||||
? buildResetSnapshot (row)
|
||||
: previous.resetSnapshot }
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const mergeImportResults = (
|
||||
rows: PostImportRow[],
|
||||
results: PostImportResultRow[],
|
||||
): PostImportRow[] => {
|
||||
const resultMap = new Map (results.map (row => [row.sourceRow, row]))
|
||||
return rows.map (row => {
|
||||
const result = resultMap.get (row.sourceRow)
|
||||
if (result == null)
|
||||
return row
|
||||
|
||||
switch (result.status)
|
||||
{
|
||||
case 'created':
|
||||
return {
|
||||
...row,
|
||||
importStatus: 'created',
|
||||
recoverable: undefined,
|
||||
skipReason: undefined,
|
||||
createdPostId: result.post.id,
|
||||
existingPostId: undefined,
|
||||
existingPost: undefined,
|
||||
fieldWarnings: compactMessageRecord (
|
||||
result.fieldWarnings ?? row.fieldWarnings),
|
||||
baseWarnings: result.baseWarnings ?? row.baseWarnings,
|
||||
importErrors: compactMessageRecord (result.errors ?? { }) }
|
||||
case 'skipped':
|
||||
return {
|
||||
...row,
|
||||
importStatus: 'skipped',
|
||||
recoverable: undefined,
|
||||
skipReason: 'existing',
|
||||
createdPostId: undefined,
|
||||
existingPostId: result.existingPostId,
|
||||
existingPost: result.existingPost ?? row.existingPost,
|
||||
fieldWarnings: compactMessageRecord (
|
||||
result.fieldWarnings ?? row.fieldWarnings),
|
||||
baseWarnings: result.baseWarnings ?? row.baseWarnings,
|
||||
importErrors: compactMessageRecord (result.errors ?? { }) }
|
||||
case 'failed':
|
||||
return {
|
||||
...row,
|
||||
importStatus: 'failed',
|
||||
recoverable: result.recoverable === true ? true : undefined,
|
||||
skipReason: undefined,
|
||||
createdPostId: undefined,
|
||||
existingPostId: undefined,
|
||||
existingPost: undefined,
|
||||
fieldWarnings: compactMessageRecord (
|
||||
result.fieldWarnings ?? row.fieldWarnings),
|
||||
baseWarnings: result.baseWarnings ?? row.baseWarnings,
|
||||
importErrors: compactMessageRecord (result.errors ?? { }) }
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const retryImportRow = (
|
||||
rows: PostImportRow[],
|
||||
sourceRow: number,
|
||||
): PostImportRow[] =>
|
||||
rows.map (row =>
|
||||
row.sourceRow === sourceRow
|
||||
&& row.importStatus === 'failed'
|
||||
&& row.recoverable === true
|
||||
? { ...row, importStatus: 'pending', importErrors: undefined }
|
||||
: row)
|
||||
|
||||
export const initialisePreviewRows = (rows: PostImportRow[]): PostImportRow[] =>
|
||||
applyThumbnailWarnings (
|
||||
rows.map (row => ({
|
||||
...row,
|
||||
resetSnapshot: buildResetSnapshot (row) })))
|
||||
@@ -0,0 +1,52 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
|
||||
import {
|
||||
countImportSourceLines,
|
||||
validateImportSource,
|
||||
} from '@/lib/postImportSourceValidation'
|
||||
|
||||
describe ('post import source validation', () => {
|
||||
it ('counts trimmed non-empty CRLF and LF rows', () => {
|
||||
expect (countImportSourceLines (' one \r\n\r\n two\n')).toBe (2)
|
||||
})
|
||||
|
||||
it ('reports invalid protocols and malformed URLs with original line numbers', () => {
|
||||
const issues = validateImportSource (
|
||||
'\nftp://example.com/file\nhttps://exa mple.com/path')
|
||||
|
||||
expect (issues).toEqual ([
|
||||
{
|
||||
sourceRow: 2,
|
||||
message: 'HTTP または HTTPS の URL ではありません．',
|
||||
url: 'ftp://example.com/file' },
|
||||
{
|
||||
sourceRow: 3,
|
||||
message: 'URL の形式が不正です．',
|
||||
url: 'https://exa mple.com/path' }])
|
||||
})
|
||||
|
||||
it ('detects duplicates after frontend URL normalisation', () => {
|
||||
const issues = validateImportSource (
|
||||
'https://EXAMPLE.com/path/\nhttps://example.com/path')
|
||||
|
||||
expect (issues).toEqual ([{
|
||||
sourceRow: 2,
|
||||
message: '1 行目と同じ URL です．',
|
||||
url: 'https://example.com/path' }])
|
||||
})
|
||||
|
||||
it ('rejects oversized URLs and rows beyond the maximum count', () => {
|
||||
const oversized = `https://example.com/${ 'a'.repeat (20 * 1024) }`
|
||||
const tooMany = Array.from (
|
||||
{ length: 101 },
|
||||
(_, index) => `https://example.com/${ index }`).join ('\n')
|
||||
|
||||
expect (validateImportSource (oversized)[0]).toMatchObject ({
|
||||
sourceRow: 1,
|
||||
message: 'URL が長すぎます．' })
|
||||
expect (validateImportSource (tooMany).at (-1)).toEqual ({
|
||||
sourceRow: 101,
|
||||
message: '取込件数は 100 件までです．',
|
||||
url: 'https://example.com/100' })
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,121 @@
|
||||
import type { PostImportSourceIssue } from '@/lib/postImportTypes'
|
||||
|
||||
const MAX_ROWS = 100
|
||||
const MAX_URL_BYTES = 20 * 1024
|
||||
|
||||
|
||||
const truncateUrl = (value: string): string =>
|
||||
value.length > 120 ? `${ value.slice (0, 117) }…` : value
|
||||
|
||||
|
||||
const bytesize = (value: string): number =>
|
||||
new TextEncoder ().encode (value).length
|
||||
|
||||
|
||||
const parseImportUrl = (value: string): URL | null => {
|
||||
const trimmed = value.trim ()
|
||||
if (!(trimmed))
|
||||
return null
|
||||
|
||||
try
|
||||
{
|
||||
return new URL (trimmed)
|
||||
}
|
||||
catch
|
||||
{
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const normaliseImportUrl = (url: URL): string => {
|
||||
url.hostname = url.hostname.toLowerCase ()
|
||||
if (url.pathname.endsWith ('/'))
|
||||
url.pathname = url.pathname.replace (/\/+$/, '')
|
||||
return url.toString ()
|
||||
}
|
||||
|
||||
|
||||
export const extractImportSourceUrls = (source: string): string[] =>
|
||||
source
|
||||
.split (/\r\n|\n|\r/)
|
||||
.map (line => line.trim ())
|
||||
.filter (line => line !== '')
|
||||
|
||||
|
||||
export const countImportSourceLines = (source: string): number =>
|
||||
extractImportSourceUrls (source).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)
|
||||
if (count > MAX_ROWS)
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: `取込件数は ${ MAX_ROWS } 件までです．`,
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
if (bytesize (value) > MAX_URL_BYTES)
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: 'URL が長すぎます．',
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
const parsed = parseImportUrl (value)
|
||||
if (parsed == null)
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: 'URL の形式が不正です．',
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
if (!(parsed.protocol === 'http:' || parsed.protocol === 'https:'))
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: 'HTTP または HTTPS の URL ではありません．',
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
if (!(parsed.host))
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: 'URL の形式が不正です．',
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
const normalised = normaliseImportUrl (parsed)
|
||||
const duplicateRow = seen.get (normalised)
|
||||
if (duplicateRow != null)
|
||||
{
|
||||
issues.push ({
|
||||
sourceRow,
|
||||
message: `${ duplicateRow } 行目と同じ URL です．`,
|
||||
url: displayUrl })
|
||||
return
|
||||
}
|
||||
seen.set (normalised, sourceRow)
|
||||
})
|
||||
|
||||
return issues
|
||||
}
|
||||
@@ -0,0 +1,40 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest'
|
||||
|
||||
import {
|
||||
clearPostImportSourceDraft,
|
||||
loadPostImportSourceDraft,
|
||||
savePostImportSourceDraft,
|
||||
} from '@/lib/postImportStorage'
|
||||
|
||||
describe ('post import source draft storage', () => {
|
||||
beforeEach (() => {
|
||||
sessionStorage.clear ()
|
||||
vi.restoreAllMocks ()
|
||||
})
|
||||
|
||||
it ('round-trips and clears the URL list source draft', () => {
|
||||
expect (savePostImportSourceDraft ('https://example.com')).toBe (true)
|
||||
expect (loadPostImportSourceDraft ()).toEqual ({
|
||||
source: 'https://example.com' })
|
||||
|
||||
clearPostImportSourceDraft ()
|
||||
|
||||
expect (loadPostImportSourceDraft ()).toEqual ({ source: '' })
|
||||
})
|
||||
|
||||
it ('ignores malformed stored drafts', () => {
|
||||
sessionStorage.setItem ('post-import-source-draft', '{')
|
||||
|
||||
expect (loadPostImportSourceDraft ()).toEqual ({ source: '' })
|
||||
})
|
||||
|
||||
it ('reports storage access failures without throwing', () => {
|
||||
const onError = vi.fn ()
|
||||
vi.spyOn (Storage.prototype, 'setItem').mockImplementation (() => {
|
||||
throw new DOMException ('quota')
|
||||
})
|
||||
|
||||
expect (savePostImportSourceDraft ('source', onError)).toBe (false)
|
||||
expect (onError).toHaveBeenCalledWith ('ブラウザへ保存できませんでした．')
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,94 @@
|
||||
import type { StorageErrorHandler } from '@/lib/postImportTypes'
|
||||
|
||||
const SOURCE_DRAFT_KEY = 'post-import-source-draft'
|
||||
|
||||
|
||||
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?.('保存済みデータを削除できませんでした．')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
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,
|
||||
onError?: StorageErrorHandler,
|
||||
): boolean =>
|
||||
writeStorage (SOURCE_DRAFT_KEY, JSON.stringify ({ source }), onError)
|
||||
|
||||
|
||||
export const clearPostImportSourceDraft = (
|
||||
onError?: StorageErrorHandler,
|
||||
) => {
|
||||
removeStorage (SOURCE_DRAFT_KEY, onError)
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
import type { Category } from '@/types'
|
||||
|
||||
export type PostImportOrigin = 'automatic' | 'manual'
|
||||
export type PostImportRepairMode = 'all' | 'failed'
|
||||
export type PostImportStatus =
|
||||
'pending'
|
||||
| 'created'
|
||||
| 'skipped'
|
||||
| 'failed'
|
||||
export type PostImportSkipReason = 'existing' | 'manual'
|
||||
export type PostImportResultStatus = 'created' | 'skipped' | 'failed'
|
||||
export type PostImportAttributeValue = string | number
|
||||
|
||||
export type PostImportDisplayTag = {
|
||||
name: string
|
||||
category: Category
|
||||
sectionLiterals?: string[] }
|
||||
|
||||
export type PostImportResetSnapshot = {
|
||||
url: string
|
||||
attributes: Record<string, PostImportAttributeValue>
|
||||
displayTags: PostImportDisplayTag[]
|
||||
provenance: Record<string, PostImportOrigin>
|
||||
tagSources: Record<PostImportOrigin, string>
|
||||
fieldWarnings: Record<string, string[]>
|
||||
baseWarnings: string[]
|
||||
metadataUrl?: string }
|
||||
|
||||
export type PostImportExistingPost = {
|
||||
id: number
|
||||
title: string
|
||||
url: string
|
||||
thumbnail?: string | null
|
||||
thumbnailBase?: string | null }
|
||||
|
||||
export type PostImportRow = {
|
||||
sourceRow: number
|
||||
url: string
|
||||
attributes: Record<string, PostImportAttributeValue>
|
||||
fieldWarnings: Record<string, string[]>
|
||||
baseWarnings: string[]
|
||||
validationErrors: Record<string, string[]>
|
||||
importErrors?: Record<string, string[]>
|
||||
provenance: Record<string, PostImportOrigin>
|
||||
tagSources?: Record<PostImportOrigin, string>
|
||||
status: 'pending' | 'ready' | 'warning' | 'error'
|
||||
skipReason?: PostImportSkipReason
|
||||
existingPostId?: number
|
||||
existingPost?: PostImportExistingPost
|
||||
metadataUrl?: string
|
||||
displayTags?: PostImportDisplayTag[]
|
||||
resetSnapshot: PostImportResetSnapshot
|
||||
createdPostId?: number
|
||||
importStatus?: PostImportStatus
|
||||
recoverable?: boolean
|
||||
thumbnailFile?: File }
|
||||
|
||||
export type PostImportResultRow =
|
||||
| {
|
||||
sourceRow: number
|
||||
status: 'created'
|
||||
post: { id: number }
|
||||
fieldWarnings?: Record<string, string[]>
|
||||
baseWarnings?: string[]
|
||||
errors?: Record<string, string[]> }
|
||||
| {
|
||||
sourceRow: number
|
||||
status: 'skipped'
|
||||
existingPostId: number
|
||||
existingPost?: PostImportExistingPost
|
||||
fieldWarnings?: Record<string, string[]>
|
||||
baseWarnings?: string[]
|
||||
errors?: Record<string, string[]> }
|
||||
| {
|
||||
sourceRow: number
|
||||
status: 'failed'
|
||||
fieldWarnings?: Record<string, string[]>
|
||||
baseWarnings?: string[]
|
||||
errors?: Record<string, string[]>
|
||||
recoverable?: boolean }
|
||||
|
||||
export type PostImportSourceIssue = {
|
||||
sourceRow: number
|
||||
message: string
|
||||
url: string }
|
||||
|
||||
export type PostImportEditableDraft = {
|
||||
url: string
|
||||
title: string
|
||||
thumbnailBase: string
|
||||
originalCreatedFrom: string
|
||||
originalCreatedBefore: string
|
||||
duration: string
|
||||
tags: string
|
||||
parentPostIds: string
|
||||
thumbnailFile?: File }
|
||||
|
||||
export type StorageErrorHandler = (message: string) => void
|
||||
@@ -0,0 +1,43 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
|
||||
import {
|
||||
buildPostNewReviewPath,
|
||||
hasPostNewReviewState,
|
||||
isPostNewReviewPathWithinLimit,
|
||||
parsePostNewReviewUrls,
|
||||
postNewReviewPathByteLength,
|
||||
} from '@/lib/postNewQueryState'
|
||||
|
||||
describe ('post new review URL state', () => {
|
||||
it ('encodes each URL separately and preserves literal plus signs', () => {
|
||||
const urls = [
|
||||
'https://example.com/one+a',
|
||||
'https://example.com/two?value=b+c']
|
||||
|
||||
const path = buildPostNewReviewPath (urls)
|
||||
|
||||
expect (path).toBe (
|
||||
'/posts/new?urls=https%3A%2F%2Fexample.com%2Fone%2Ba'
|
||||
+ '+https%3A%2F%2Fexample.com%2Ftwo%3Fvalue%3Db%2Bc')
|
||||
expect (parsePostNewReviewUrls (path.slice ('/posts/new'.length))).toEqual (urls)
|
||||
})
|
||||
|
||||
it ('uses only the raw urls parameter as review state', () => {
|
||||
expect (hasPostNewReviewState ('?session_id=old&meta=old')).toBe (false)
|
||||
expect (hasPostNewReviewState ('?unknown=value&urls=')).toBe (true)
|
||||
expect (parsePostNewReviewUrls ('?unknown=value&urls=one+two&meta=old'))
|
||||
.toEqual (['one', 'two'])
|
||||
})
|
||||
|
||||
it ('allows at most a 6 143 byte request target', () => {
|
||||
const baseUrl = 'https://example.com/'
|
||||
const baseLength = postNewReviewPathByteLength ([baseUrl])
|
||||
const allowed = `${ baseUrl }${ 'a'.repeat (6_143 - baseLength) }`
|
||||
const denied = `${ allowed }a`
|
||||
|
||||
expect (postNewReviewPathByteLength ([allowed])).toBe (6_143)
|
||||
expect (isPostNewReviewPathWithinLimit ([allowed])).toBe (true)
|
||||
expect (postNewReviewPathByteLength ([denied])).toBe (6_144)
|
||||
expect (isPostNewReviewPathWithinLimit ([denied])).toBe (false)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,58 @@
|
||||
const POST_NEW_REVIEW_PATH_PREFIX = '/posts/new?urls='
|
||||
const MAX_POST_NEW_REVIEW_TARGET_BYTES = 6_144
|
||||
|
||||
const textEncoder = new TextEncoder ()
|
||||
|
||||
|
||||
const rawUrlsParam = (search: string): string | null => {
|
||||
const query = search.startsWith ('?') ? search.slice (1) : search
|
||||
if (query === '')
|
||||
return null
|
||||
|
||||
for (const segment of query.split ('&'))
|
||||
{
|
||||
if (segment === 'urls')
|
||||
return ''
|
||||
if (segment.startsWith ('urls='))
|
||||
return segment.slice ('urls='.length)
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
|
||||
export const buildPostNewReviewPath = (urls: string[]): string =>
|
||||
`${ POST_NEW_REVIEW_PATH_PREFIX }${ urls.map (url => encodeURIComponent (url)).join ('+') }`
|
||||
|
||||
|
||||
export const postNewReviewPathByteLength = (urls: string[]): number =>
|
||||
textEncoder.encode (buildPostNewReviewPath (urls)).byteLength
|
||||
|
||||
|
||||
export const isPostNewReviewPathWithinLimit = (urls: string[]): boolean =>
|
||||
postNewReviewPathByteLength (urls) < MAX_POST_NEW_REVIEW_TARGET_BYTES
|
||||
|
||||
|
||||
export const parsePostNewReviewUrls = (search: string): string[] => {
|
||||
const raw = rawUrlsParam (search)
|
||||
if (raw == null)
|
||||
return []
|
||||
|
||||
return raw
|
||||
.split ('+')
|
||||
.filter (segment => segment !== '')
|
||||
.map (segment => {
|
||||
try
|
||||
{
|
||||
return decodeURIComponent (segment)
|
||||
}
|
||||
catch
|
||||
{
|
||||
return segment
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export const hasPostNewReviewState = (search: string): boolean =>
|
||||
rawUrlsParam (search) != null
|
||||
@@ -25,7 +25,6 @@ import {
|
||||
getEffectiveKeyBindings,
|
||||
setClientKeyboardSettings,
|
||||
} from '@/lib/settings'
|
||||
import { useUnsavedChangesGuard } from '@/lib/useUnsavedChangesGuard'
|
||||
|
||||
import type {
|
||||
KeyBinding,
|
||||
@@ -97,7 +96,6 @@ const focusSearchTarget = (): void => {
|
||||
export const KeyboardShortcutsProvider = ({ children }: PropsWithChildren) => {
|
||||
const location = useLocation ()
|
||||
const navigate = useNavigate ()
|
||||
const { confirmDiscardNavigation } = useUnsavedChangesGuard ()
|
||||
|
||||
const [keyboardSettings, setKeyboardSettingsState] =
|
||||
useState<ClientKeyboardSettings> (() => getClientKeyboardSettings ())
|
||||
@@ -149,11 +147,8 @@ export const KeyboardShortcutsProvider = ({ children }: PropsWithChildren) => {
|
||||
}, [])
|
||||
|
||||
const guardedNavigate = useCallback ((path: string) => {
|
||||
confirmDiscardNavigation ().then (confirmed => {
|
||||
if (confirmed)
|
||||
navigate (path)
|
||||
})
|
||||
}, [confirmDiscardNavigation, navigate])
|
||||
navigate (path)
|
||||
}, [navigate])
|
||||
|
||||
const builtinHandlers = useMemo<ShortcutHandlers> (
|
||||
() => ({
|
||||
|
||||
@@ -0,0 +1,77 @@
|
||||
import { fireEvent, screen, waitFor, within } from '@testing-library/react'
|
||||
import { useState } from 'react'
|
||||
import { useLocation, useNavigate } from 'react-router-dom'
|
||||
import { describe, expect, it, vi } from 'vitest'
|
||||
|
||||
import { useUnsavedChangesGuard } from '@/lib/useUnsavedChangesGuard'
|
||||
import { renderWithProviders } from '@/test/render'
|
||||
|
||||
const GuardHarness = () => {
|
||||
const [dirty, setDirty] = useState (true)
|
||||
const location = useLocation ()
|
||||
const navigate = useNavigate ()
|
||||
const discard = vi.fn (() => setDirty (false))
|
||||
const { allowNextNavigation } = useUnsavedChangesGuard ({
|
||||
dirty,
|
||||
onDiscard: discard })
|
||||
|
||||
return (
|
||||
<>
|
||||
<output aria-label="location">{location.pathname}{location.search}</output>
|
||||
<button type="button" onClick={() => navigate ('/next?tab=one')}>move</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
allowNextNavigation ()
|
||||
navigate ('/allowed')
|
||||
}}>
|
||||
allowed move
|
||||
</button>
|
||||
</>)
|
||||
}
|
||||
|
||||
describe ('useUnsavedChangesGuard', () => {
|
||||
it ('blocks route changes and resets a cancelled transition', async () => {
|
||||
renderWithProviders (<GuardHarness/>, { route: '/current' })
|
||||
|
||||
fireEvent.click (screen.getByRole ('button', { name: 'move' }))
|
||||
|
||||
expect (within (await screen.findByRole ('dialog')).getByText (
|
||||
'変更が破棄してページ移動しますか?')).toBeInTheDocument ()
|
||||
expect (screen.getByLabelText ('location')).toHaveTextContent ('/current')
|
||||
|
||||
fireEvent.click (screen.getByRole ('button', { name: '取消' }))
|
||||
|
||||
await waitFor (() => {
|
||||
expect (screen.queryByRole ('dialog')).not.toBeInTheDocument ()
|
||||
})
|
||||
expect (screen.getByLabelText ('location')).toHaveTextContent ('/current')
|
||||
})
|
||||
|
||||
it ('proceeds with the blocked transition after discard is confirmed', async () => {
|
||||
renderWithProviders (<GuardHarness/>, { route: '/current' })
|
||||
|
||||
fireEvent.click (screen.getByRole ('button', { name: 'move' }))
|
||||
fireEvent.click (await screen.findByRole ('button', {
|
||||
name: '変更を破棄して移動' }))
|
||||
|
||||
await waitFor (() => {
|
||||
expect (screen.getByLabelText ('location')).toHaveTextContent ('/next?tab=one')
|
||||
})
|
||||
})
|
||||
|
||||
it ('allows only the next navigation without leaving a bypass token', async () => {
|
||||
renderWithProviders (<GuardHarness/>, { route: '/current' })
|
||||
|
||||
fireEvent.click (screen.getByRole ('button', { name: 'allowed move' }))
|
||||
await waitFor (() => {
|
||||
expect (screen.getByLabelText ('location')).toHaveTextContent ('/allowed')
|
||||
})
|
||||
|
||||
fireEvent.click (screen.getByRole ('button', { name: 'move' }))
|
||||
|
||||
expect (within (await screen.findByRole ('dialog')).getByText (
|
||||
'変更が破棄してページ移動しますか?')).toBeInTheDocument ()
|
||||
expect (screen.getByLabelText ('location')).toHaveTextContent ('/allowed')
|
||||
})
|
||||
})
|
||||
@@ -1,6 +1,15 @@
|
||||
import { createContext, useCallback, useContext, useMemo, useState } from 'react'
|
||||
import {
|
||||
createContext,
|
||||
useCallback,
|
||||
useContext,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from 'react'
|
||||
import { useBlocker } from 'react-router-dom'
|
||||
|
||||
import { useDialogue } from '@/components/dialogues/DialogueProvider'
|
||||
import { useDialogue } from '@/lib/dialogues/useDialogue'
|
||||
|
||||
import type { FC, PropsWithChildren } from 'react'
|
||||
|
||||
@@ -8,12 +17,16 @@ type UnsavedChangesSource = {
|
||||
dirty: boolean
|
||||
discard: () => void | Promise<void> }
|
||||
|
||||
type UseUnsavedChangesGuardOptions = {
|
||||
dirty: boolean
|
||||
onDiscard?: () => void | Promise<void> }
|
||||
|
||||
type UnsavedChangesGuardContextValue = {
|
||||
hasUnsavedChanges: boolean
|
||||
registerUnsavedChangesSource: (
|
||||
source: UnsavedChangesSource | null,
|
||||
) => void
|
||||
confirmDiscardNavigation: () => Promise<boolean> }
|
||||
hasUnsavedChanges: boolean
|
||||
registerUnsavedChangesSource: (
|
||||
source: UnsavedChangesSource,
|
||||
) => () => void
|
||||
allowNextNavigation: () => void }
|
||||
|
||||
const UnsavedChangesGuardContext =
|
||||
createContext<UnsavedChangesGuardContextValue | null> (null)
|
||||
@@ -21,49 +34,171 @@ const UnsavedChangesGuardContext =
|
||||
|
||||
export const UnsavedChangesGuardProvider: FC<PropsWithChildren> = ({ children }) => {
|
||||
const dialogue = useDialogue ()
|
||||
const [source, setSource] = useState<UnsavedChangesSource | null> (null)
|
||||
const sourcesRef = useRef (new Map<symbol, UnsavedChangesSource> ())
|
||||
const bypassNextNavigationRef = useRef<symbol | null> (null)
|
||||
const [revision, setRevision] = useState (0)
|
||||
const dialogueOpenRef = useRef (false)
|
||||
const handlingBlockedTransitionRef = useRef (false)
|
||||
|
||||
const registerUnsavedChangesSource = useCallback ((
|
||||
nextSource: UnsavedChangesSource | null,
|
||||
) => {
|
||||
setSource (nextSource)
|
||||
source: UnsavedChangesSource,
|
||||
): (() => void) => {
|
||||
const sourceId = Symbol ('unsaved-changes-source')
|
||||
sourcesRef.current.set (sourceId, source)
|
||||
setRevision (current => current + 1)
|
||||
|
||||
return () => {
|
||||
if (!(sourcesRef.current.delete (sourceId)))
|
||||
return
|
||||
|
||||
setRevision (current => current + 1)
|
||||
}
|
||||
}, [])
|
||||
|
||||
const confirmDiscardNavigation = useCallback (async (): Promise<boolean> => {
|
||||
if (!(source?.dirty))
|
||||
const allowNextNavigation = useCallback (() => {
|
||||
const token = Symbol ('allowed-navigation')
|
||||
bypassNextNavigationRef.current = token
|
||||
|
||||
queueMicrotask (() => {
|
||||
if (bypassNextNavigationRef.current === token)
|
||||
bypassNextNavigationRef.current = null
|
||||
})
|
||||
}, [])
|
||||
|
||||
const sources = useMemo (
|
||||
() => [...sourcesRef.current.values ()],
|
||||
[revision],
|
||||
)
|
||||
const dirtySources = useMemo (
|
||||
() => sources.filter (source => source.dirty),
|
||||
[sources],
|
||||
)
|
||||
const hasUnsavedChanges = dirtySources.length > 0
|
||||
const hasUnsavedChangesRef = useRef (hasUnsavedChanges)
|
||||
hasUnsavedChangesRef.current = hasUnsavedChanges
|
||||
const shouldBlock = useCallback (() => {
|
||||
if (bypassNextNavigationRef.current != null)
|
||||
{
|
||||
bypassNextNavigationRef.current = null
|
||||
return false
|
||||
}
|
||||
|
||||
return hasUnsavedChangesRef.current
|
||||
}, [])
|
||||
const blocker = useBlocker (shouldBlock)
|
||||
|
||||
const confirmDiscardChanges = useCallback (async (): Promise<boolean> => {
|
||||
if (!(hasUnsavedChanges))
|
||||
return true
|
||||
|
||||
const confirmed = await dialogue.confirm ({
|
||||
title: '未保存の変更があります',
|
||||
description: 'このまま移動すると、保存していない変更は失われます。',
|
||||
cancelText: 'このページに残る',
|
||||
confirmText: '変更を破棄して移動',
|
||||
variant: 'danger' })
|
||||
if (!(confirmed))
|
||||
if (dialogueOpenRef.current)
|
||||
return false
|
||||
|
||||
await source.discard ()
|
||||
return true
|
||||
}, [dialogue, source])
|
||||
dialogueOpenRef.current = true
|
||||
|
||||
try
|
||||
{
|
||||
const confirmed = await dialogue.confirm ({
|
||||
title: '変更が破棄してページ移動しますか?',
|
||||
confirmText: '変更を破棄して移動',
|
||||
variant: 'danger' })
|
||||
if (!(confirmed))
|
||||
return false
|
||||
|
||||
return true
|
||||
}
|
||||
finally
|
||||
{
|
||||
dialogueOpenRef.current = false
|
||||
}
|
||||
}, [dialogue, hasUnsavedChanges])
|
||||
|
||||
useEffect (() => {
|
||||
if (blocker.state !== 'blocked' || handlingBlockedTransitionRef.current)
|
||||
return
|
||||
|
||||
handlingBlockedTransitionRef.current = true
|
||||
void (async () => {
|
||||
try
|
||||
{
|
||||
const confirmed = await confirmDiscardChanges ()
|
||||
if (!(confirmed))
|
||||
{
|
||||
blocker.reset ()
|
||||
return
|
||||
}
|
||||
|
||||
let discardResults: Array<void | Promise<void>>
|
||||
try
|
||||
{
|
||||
discardResults = dirtySources.map (source => source.discard ())
|
||||
}
|
||||
catch
|
||||
{
|
||||
blocker.reset ()
|
||||
return
|
||||
}
|
||||
|
||||
blocker.proceed ()
|
||||
await Promise.allSettled (discardResults)
|
||||
}
|
||||
finally
|
||||
{
|
||||
handlingBlockedTransitionRef.current = false
|
||||
}
|
||||
}) ()
|
||||
}, [blocker, confirmDiscardChanges, dirtySources])
|
||||
|
||||
useEffect (() => {
|
||||
if (!(hasUnsavedChanges))
|
||||
return
|
||||
|
||||
const handleBeforeUnload = (event: BeforeUnloadEvent) => {
|
||||
event.preventDefault ()
|
||||
event.returnValue = ''
|
||||
}
|
||||
|
||||
window.addEventListener ('beforeunload', handleBeforeUnload)
|
||||
return () => {
|
||||
window.removeEventListener ('beforeunload', handleBeforeUnload)
|
||||
}
|
||||
}, [hasUnsavedChanges])
|
||||
|
||||
const value = useMemo<UnsavedChangesGuardContextValue> (() => ({
|
||||
hasUnsavedChanges: source?.dirty === true,
|
||||
hasUnsavedChanges,
|
||||
registerUnsavedChangesSource,
|
||||
confirmDiscardNavigation,
|
||||
}), [confirmDiscardNavigation, registerUnsavedChangesSource, source?.dirty])
|
||||
allowNextNavigation,
|
||||
}), [
|
||||
allowNextNavigation,
|
||||
hasUnsavedChanges,
|
||||
registerUnsavedChangesSource,
|
||||
])
|
||||
|
||||
return (
|
||||
<UnsavedChangesGuardContext.Provider value={value}>
|
||||
{children}
|
||||
{children}
|
||||
</UnsavedChangesGuardContext.Provider>)
|
||||
}
|
||||
|
||||
|
||||
export const useUnsavedChangesGuard = (): UnsavedChangesGuardContextValue => {
|
||||
export const useUnsavedChangesGuard = (
|
||||
options?: UseUnsavedChangesGuardOptions,
|
||||
): UnsavedChangesGuardContextValue => {
|
||||
const context = useContext (UnsavedChangesGuardContext)
|
||||
|
||||
if (context == null)
|
||||
throw new Error ('UnsavedChangesGuardProvider が必要です．')
|
||||
|
||||
const { registerUnsavedChangesSource } = context
|
||||
|
||||
useEffect (() => {
|
||||
if (options == null)
|
||||
return
|
||||
|
||||
return registerUnsavedChangesSource ({
|
||||
dirty: options.dirty,
|
||||
discard: options.onDiscard ?? (() => undefined) })
|
||||
}, [options?.dirty, options?.onDiscard, registerUnsavedChangesSource])
|
||||
|
||||
return context
|
||||
}
|
||||
|
||||
新しい課題から参照
ユーザをブロックする