#90

frontend/src/components/PostOriginalCreatedTimeField.tsx

@@ -1,4 +1,5 @@
 import DateTimeField from '@/components/common/DateTimeField'
+import { FieldError } from '@/components/common/FieldError'
 import Label from '@/components/common/Label'
 import { Button } from '@/components/ui/button'
 
@@ -10,23 +11,26 @@ type Props = {
     setOriginalCreatedFrom:   (x: string | null) => void
     originalCreatedBefore:    string | null
     setOriginalCreatedBefore: (x: string | null) => void
-    fromErrors?:              string[]
-    beforeErrors?:            string[] }
+    errors?:                  string[] }
 
 
-const PostOriginalCreatedTimeField: FC<Props> = ({ disabled,
-		   originalCreatedFrom,
-		   setOriginalCreatedFrom,
-		   originalCreatedBefore,
-		   setOriginalCreatedBefore }) => (
+const PostOriginalCreatedTimeField: FC<Props> = (
+    { disabled,
+      originalCreatedFrom,
+      setOriginalCreatedFrom,
+      originalCreatedBefore,
+      setOriginalCreatedBefore,
+      errors }: Props,
+) => (
     <div>
-      <Label>オリジナルの作成日時</Label>
+      <Label invalid={errors && errors.length > 0}>オリジナルの作成日時</Label>
 
       <div className="my-1 flex">
 	<div className="w-80">
 	  <DateTimeField
 	      className="mr-2"
 	      disabled={disabled ?? false}
+	      aria-invalid={errors && errors.length > 0}
 	      value={originalCreatedFrom ?? undefined}
 	      onChange={setOriginalCreatedFrom}
 	      onBlur={ev => {
@@ -54,13 +58,13 @@ const PostOriginalCreatedTimeField: FC<Props> = ({ disabled,
 	  </Button>
 	</div>
       </div>
-      <FieldError messages={fromErrors}/>
 
       <div className="my-1 flex">
 	<div className="w-80">
 	  <DateTimeField
 	      className="mr-2"
 	      disabled={disabled}
+	      aria-invalid={errors && errors.length > 0}
 	      value={originalCreatedBefore ?? undefined}
 	      onChange={setOriginalCreatedBefore}/>
 	  より前
@@ -76,7 +80,8 @@ const PostOriginalCreatedTimeField: FC<Props> = ({ disabled,
 	  </Button>
 	</div>
       </div>
-      <FieldError messages={beforeErrors}/>
+
+      <FieldError messages={errors}/>
     </div>)
 
 export default PostOriginalCreatedTimeField