#399

frontend/src/pages/posts/PostImportReviewPage.tsx

@@ -6,7 +6,6 @@ import { useNavigate,
 
 import PageTitle from '@/components/common/PageTitle'
 import MainArea from '@/components/layout/MainArea'
-import PageActionFooter from '@/components/posts/import/PageActionFooter'
 import PostImportRowDialog from '@/components/posts/import/PostImportRowDialog'
 import PostImportRowSummary from '@/components/posts/import/PostImportRowSummary'
 import PostImportStatusBadge from '@/components/posts/import/PostImportStatusBadge'
@@ -120,57 +119,35 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
 	setSession (current =>
 	    current ? { ...current, rows: nextRows } : current)
 
-    const saveDraft = async (draft: Draft): Promise<boolean> => {
+    const saveDraft = async (
+	{ draft, resetRequested, resetSnapshot }: {
+	    draft:            Draft
+	    resetRequested:   boolean
+	    resetSnapshot:    PostImportRow['resetSnapshot'] },
+    ): Promise<boolean> => {
 	if (session == null)
 	  return false
 	if (editingRow == null)
 	  return false
 
 	const urlChanged = draft.url !== editingRow.url
-	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] =
-		value !== String (editingRow.attributes[field] ?? '')
-		? 'manual'
-		: (editingRow.provenance[field] ?? 'automatic')
-	})
-	nextAttributes.tags = draft.tags
-	if (draft.tags !== String (editingRow.attributes.tags ?? ''))
-	  {
-	    nextProvenance.tags = 'manual'
-	    nextTagSources.manual = draft.tags
-	  }
-	else
-	  {
-	    nextProvenance.tags = editingRow.provenance.tags ?? 'automatic'
-	    nextTagSources.manual = editingRow.tagSources?.manual ?? ''
-	  }
+	const nextRow =
+	    resetRequested
+	    ? {
+		...editingRow,
+		url: resetSnapshot.url,
+		attributes: { ...resetSnapshot.attributes },
+		provenance: { ...resetSnapshot.provenance },
+		tagSources: { ...resetSnapshot.tagSources },
+		metadataUrl: resetSnapshot.metadataUrl,
+		importStatus: editingRow.importStatus === 'created' ? 'created' : 'pending',
+		importErrors: undefined }
+	    : buildNextEditedRow (editingRow, draft, urlChanged)
 
 	setSavingRow (editingRow.sourceRow)
 	const nextRows = session.rows.map (row =>
 	    row.sourceRow === editingRow.sourceRow
-	    ? {
-		...row,
-		url: draft.url,
-		attributes: nextAttributes,
-		provenance: {
-		    ...nextProvenance,
-		    url: urlChanged ? 'manual' : (editingRow.provenance.url ?? 'manual') },
-		tagSources: nextTagSources,
-		importStatus: row.importStatus === 'created' ? 'created' : 'pending',
-		importErrors: undefined }
+	    ? nextRow
 	    : row)
 	try
 	{
@@ -300,7 +277,6 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
 		<div className="flex flex-wrap items-center gap-2">
 		  <PostImportSummaryChip label="全件" value={counts.total}/>
 		  <PostImportSummaryChip label="登録対象" value={counts.submittable} badge="ready"/>
-		  <PostImportSummaryChip label="要確認" value={counts.invalid} badge="error"/>
 		  <PostImportSummaryChip label="スキップ予定" value={counts.skipPlanned}
 					 badge="skipped"/>
 		</div>
@@ -321,7 +297,6 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
 
 	  <PostImportFooter
 	      loading={loading}
-	      invalidCount={counts.invalid}
 	      processableCount={processable.length}
 	      creatableCount={creatable.length}
 	      skipPlannedCount={counts.skipPlanned}
@@ -343,44 +318,90 @@ const PostImportReviewPage: FC<Props> = ({ user }) => {
 
 const PostImportFooter = (
     { loading,
-      invalidCount,
       processableCount,
       creatableCount,
       skipPlannedCount,
       onBack,
       onSubmit }: {
 	loading:            boolean
-	invalidCount:       number
 	processableCount:   number
 	creatableCount:     number
 	skipPlannedCount:   number
 	onBack:             () => void
 	onSubmit:           () => void },
 ) => (
-    <PageActionFooter
-	summary={
-	    <>
-	      <span>処理対象 {processableCount} 件</span>
-	      <PostImportStatusBadge value="ready"/>
-	      <span>登録対象 {creatableCount} 件</span>
-	      <PostImportStatusBadge value="skipped"/>
-	      <span>スキップ予定 {skipPlannedCount} 件</span>
-	      <PostImportStatusBadge value="error"/>
-	      <span>要確認 {invalidCount} 件</span>
-	    </>
-	}
-	actions={
-	    <>
-	      <Button type="button" variant="outline" onClick={onBack}>
-		URL リスト入力へ戻る
-	      </Button>
-	      <Button
-		  type="button"
-		  onClick={onSubmit}
-		  disabled={loading || processableCount === 0}>
-		取込を実行
-	      </Button>
-	    </>
-	}/>)
+    <div
+	className="shrink-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">
+	<div className="flex flex-wrap items-center gap-2 text-sm">
+	  <span>処理対象 {processableCount} 件</span>
+	  <PostImportStatusBadge value="ready"/>
+	  <span>登録対象 {creatableCount} 件</span>
+	  <PostImportStatusBadge value="skipped"/>
+	  <span>スキップ予定 {skipPlannedCount} 件</span>
+	</div>
+	<div className="flex flex-col gap-2 sm:flex-row">
+	  <Button type="button" variant="outline" onClick={onBack}>
+	    URL リスト入力へ戻る
+	  </Button>
+	  <Button
+	      type="button"
+	      onClick={onSubmit}
+	      disabled={loading || processableCount === 0}>
+	    取込を実行
+	  </Button>
+	</div>
+      </div>
+    </div>)
+
+const buildNextEditedRow = (
+    editingRow:  PostImportRow,
+    draft:       Draft,
+    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] =
+	    value !== String (editingRow.attributes[field] ?? '')
+	    ? 'manual'
+	    : (editingRow.provenance[field] ?? 'automatic')
+    })
+    nextAttributes.tags = draft.tags
+    if (draft.tags !== String (editingRow.attributes.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,
+	provenance: {
+	    ...nextProvenance,
+	    url: urlChanged ? 'manual' : (editingRow.provenance.url ?? 'manual') },
+	tagSources: nextTagSources,
+	importStatus: editingRow.importStatus === 'created' ? 'created' : 'pending',
+	importErrors: undefined }
+}
 
 export default PostImportReviewPage