オリジナルの投稿日時 Safari でのバグ修正（#129） (#265)

Merge branch 'main' into feature/129

#129

Co-authored-by: miteruzo <miteruzo@naver.com>
Reviewed-on: https://git.miteruzo.com/miteruzo/btrc-hub/pulls/265

frontend/src/components/PostOriginalCreatedTimeField.tsx

@@ -1,5 +1,6 @@
 import DateTimeField from '@/components/common/DateTimeField'
 import Label from '@/components/common/Label'
+import { Button } from '@/components/ui/button'
 
 import type { FC } from 'react'
 
@@ -16,34 +17,52 @@ export default (({ originalCreatedFrom,
 		   setOriginalCreatedBefore }: Props) => (
     <div>
       <Label>オリジナルの作成日時</Label>
-      <div className="my-1">
-	<DateTimeField
-	    className="mr-2"
-	    value={originalCreatedFrom ?? undefined}
-	    onChange={setOriginalCreatedFrom}
-	    onBlur={ev => {
-	      const v = ev.target.value
-	      if (!(v))
-		return
-	      const d = new Date (v)
-	      if (d.getSeconds () === 0)
-		{
-		  if (d.getMinutes () === 0 && d.getHours () === 0)
-		    d.setDate (d.getDate () + 1)
-		  else
-		    d.setMinutes (d.getMinutes () + 1)
-		}
-	      else
-		d.setSeconds (d.getSeconds () + 1)
-	      setOriginalCreatedBefore (d.toISOString ())
-	    }}/>
-	以降
+      <div className="my-1 flex">
+	<div className="w-80">
+	  <DateTimeField
+	      className="mr-2"
+	      value={originalCreatedFrom ?? undefined}
+	      onChange={setOriginalCreatedFrom}
+	      onBlur={ev => {
+		const v = ev.target.value
+		if (!(v))
+		  return
+
+		const d = new Date (v)
+		if (d.getMinutes () === 0 && d.getHours () === 0)
+		  d.setDate (d.getDate () + 1)
+		else
+		  d.setMinutes (d.getMinutes () + 1)
+		setOriginalCreatedBefore (d.toISOString ())
+	      }}/>
+	  以降
+	</div>
+	<div>
+	  <Button
+	      className="bg-gray-600 text-white rounded"
+	      onClick={() => {
+		setOriginalCreatedFrom (null)
+	      }}>
+	    リセット
+	  </Button>
+	</div>
       </div>
-      <div className="my-1">
-	<DateTimeField
-	    className="mr-2"
-	    value={originalCreatedBefore ?? undefined}
-	    onChange={setOriginalCreatedBefore}/>
-	より前
+      <div className="my-1 flex">
+	<div className="w-80">
+	  <DateTimeField
+	      className="mr-2"
+	      value={originalCreatedBefore ?? undefined}
+	      onChange={setOriginalCreatedBefore}/>
+	  より前
+	</div>
+	<div>
+	  <Button
+	      className="bg-gray-600 text-white rounded"
+	      onClick={() => {
+		setOriginalCreatedBefore (null)
+	      }}>
+	    リセット
+	  </Button>
+	</div>
       </div>
     </div>)) satisfies FC<Props>

frontend/src/components/common/DateTimeField.tsx

@@ -5,7 +5,7 @@ import { cn } from '@/lib/utils'
 import type { FC, FocusEvent } from 'react'
 
 
-const pad = (n: number) => n.toString ().padStart (2, '0')
+const pad = (n: number): string => n.toString ().padStart (2, '0')
 
 
 const toDateTimeLocalValue = (d: Date) => {
@@ -14,8 +14,7 @@ const toDateTimeLocalValue = (d: Date) => {
   const day = pad (d.getDate ())
   const h = pad (d.getHours ())
   const min = pad (d.getMinutes ())
-  const s = pad (d.getSeconds ())
-  return `${ y }-${ m }-${ day }T${ h }:${ min }:${ s }`
+  return `${ y }-${ m }-${ day }T${ h }:${ min }:00`
 }
 
 
@@ -37,7 +36,6 @@ export default (({ value, onChange, className, onBlur }: Props) => {
       <input
 	  className={cn ('border rounded p-2', className)}
 	  type="datetime-local"
-	  step={1}
 	  value={local}
 	  onChange={ev => {
 	    const v = ev.target.value