#399

frontend/src/components/posts/import/PostImportRowSummary.tsx

@@ -25,88 +25,88 @@ const summaryDate = (row: PostImportRow): string =>
 
 
 const PostImportRowSummary: FC<Props> = ({ row, onEdit }) => {
-    const warning = summaryWarning (row)
-    const displayStatus = displayPostImportStatus (row)
+  const warning = summaryWarning (row)
+  const displayStatus = displayPostImportStatus (row)
 
-    return (
-	<>
-	  <div
-	      className={cn (
-		  'hidden items-center gap-4 rounded-lg border p-4 md:grid',
-		  'md:grid-cols-[4rem_5rem_minmax(0,1fr)_auto_auto]',
-		  'transition-shadow hover:shadow-sm')}>
-	    <div className="space-y-1">
-	      <div className="text-sm font-medium">#{row.sourceRow}</div>
-	    </div>
-	    <ThumbnailPreview
-		url={String (row.attributes.thumbnailBase ?? '')}
-		className="h-16 w-16"/>
-	    <div className="min-w-0 space-y-1">
-	      <div className="line-clamp-2 text-sm font-medium">
-		{String (row.attributes.title ?? '') || '（タイトル未取得）'}
-	      </div>
-	      <div className="truncate text-xs text-neutral-600 dark:text-neutral-300">
-		{row.url}
-	      </div>
-	      <div className="truncate text-xs text-neutral-500 dark:text-neutral-400">
-		{String (row.attributes.tags ?? '') || 'タグなし'}
-	      </div>
-	      <div className="text-xs text-neutral-500 dark:text-neutral-400">
-		{summaryDate (row) || '日時未取得'}
-		{row.attributes.duration ? ` / ${ row.attributes.duration }` : ''}
-	      </div>
-	      {warning && (
-		  <div className="text-xs text-amber-700 dark:text-amber-200">
-		    {warning}
-		  </div>)}
-	    </div>
-	    <div className="space-y-1">
-	      {displayStatus != null && <PostImportStatusBadge value={displayStatus}/>}
-	    </div>
-	    <div className="flex justify-end">
-	      <Button
-		  type="button"
-		  variant="outline"
-		  onClick={onEdit}
-		  disabled={row.importStatus === 'created'}>
-		編輯
-	      </Button>
-	    </div>
-	  </div>
+  return (
+      <>
+        <div
+            className={cn (
+                'hidden items-center gap-4 rounded-lg border p-4 md:grid',
+                'md:grid-cols-[4rem_5rem_minmax(0,1fr)_auto_auto]',
+                'transition-shadow hover:shadow-sm')}>
+          <div className="space-y-1">
+            <div className="text-sm font-medium">#{row.sourceRow}</div>
+          </div>
+          <ThumbnailPreview
+              url={String (row.attributes.thumbnailBase ?? '')}
+              className="h-16 w-16"/>
+          <div className="min-w-0 space-y-1">
+            <div className="line-clamp-2 text-sm font-medium">
+              {String (row.attributes.title ?? '') || '（タイトル未取得）'}
+            </div>
+            <div className="truncate text-xs text-neutral-600 dark:text-neutral-300">
+              {row.url}
+            </div>
+            <div className="truncate text-xs text-neutral-500 dark:text-neutral-400">
+              {String (row.attributes.tags ?? '') || 'タグなし'}
+            </div>
+            <div className="text-xs text-neutral-500 dark:text-neutral-400">
+              {summaryDate (row) || '日時未取得'}
+              {row.attributes.duration ? ` / ${ row.attributes.duration }` : ''}
+            </div>
+            {warning && (
+                <div className="text-xs text-amber-700 dark:text-amber-200">
+                  {warning}
+                </div>)}
+          </div>
+          <div className="space-y-1">
+            {displayStatus != null && <PostImportStatusBadge value={displayStatus}/>}
+          </div>
+          <div className="flex justify-end">
+            <Button
+                type="button"
+                variant="outline"
+                onClick={onEdit}
+                disabled={row.importStatus === 'created'}>
+              編輯
+            </Button>
+          </div>
+        </div>
 
-	  <div
-	      className={cn (
-		  'space-y-3 rounded-lg border p-4 md:hidden',
-		  'transition-shadow hover:shadow-sm')}>
-	    <div className="flex items-start gap-3">
-	      <ThumbnailPreview
-		  url={String (row.attributes.thumbnailBase ?? '')}
-		  className="h-20 w-20 shrink-0"/>
-	      <div className="min-w-0 flex-1 space-y-2">
-		<div className="line-clamp-2 text-sm font-medium">
-		  {String (row.attributes.title ?? '') || '（タイトル未取得）'}
-		</div>
-		<div className="truncate text-xs text-neutral-600 dark:text-neutral-300">
-		  {row.url}
-		</div>
-		<div className="flex flex-wrap gap-2">
-		  {displayStatus != null && <PostImportStatusBadge value={displayStatus}/>}
-		</div>
-		{warning && (
-		    <div className="text-xs text-amber-700 dark:text-amber-200">
-		      {warning}
-		    </div>)}
-	      </div>
-	    </div>
-	    <Button
-		type="button"
-		variant="outline"
-		onClick={onEdit}
-		disabled={row.importStatus === 'created'}>
-	      編輯
-	    </Button>
-	  </div>
-	</>)
+        <div
+            className={cn (
+                'space-y-3 rounded-lg border p-4 md:hidden',
+                'transition-shadow hover:shadow-sm')}>
+          <div className="flex items-start gap-3">
+            <ThumbnailPreview
+                url={String (row.attributes.thumbnailBase ?? '')}
+                className="h-20 w-20 shrink-0"/>
+            <div className="min-w-0 flex-1 space-y-2">
+              <div className="line-clamp-2 text-sm font-medium">
+                {String (row.attributes.title ?? '') || '（タイトル未取得）'}
+              </div>
+              <div className="truncate text-xs text-neutral-600 dark:text-neutral-300">
+                {row.url}
+              </div>
+              <div className="flex flex-wrap gap-2">
+                {displayStatus != null && <PostImportStatusBadge value={displayStatus}/>}
+              </div>
+              {warning && (
+                  <div className="text-xs text-amber-700 dark:text-amber-200">
+                    {warning}
+                  </div>)}
+            </div>
+          </div>
+          <Button
+              type="button"
+              variant="outline"
+              onClick={onEdit}
+              disabled={row.importStatus === 'created'}>
+            編輯
+          </Button>
+        </div>
+      </>)
 }
 
 export default PostImportRowSummary