Fix time components (#731)

Author: Dreamsorcerer

admin-js/src/App.js

@@ -14,15 +14,27 @@ import {
     BooleanField, DateField, NumberField, ReferenceField, ReferenceManyField,
     ReferenceOneField, SelectField, TextField,
     // Inputs
-    BooleanInput, DateInput, DateTimeInput, NumberInput, SelectInput, TextInput, TimeInput,
-    ReferenceInput as _ReferenceInput,
+    BooleanInput, DateInput, DateTimeInput, NumberInput, SelectInput, TextInput,
+    TimeInput as _TimeInput, ReferenceInput as _ReferenceInput,
     // Filters
     email, maxLength, maxValue, minLength, minValue, regex, required,
     // Misc
     AutocompleteInput, EditButton, HttpError, WithRecord
 } from "react-admin";
 import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
 
+// Hacked TimeField/TimeInput to actually work with times.
+// TODO: Replace once new components are introduced using Temporal API.
+
+const TimeField = (props) => (
+    <WithRecord {...props} render={
+        (record) => <DateField {...props} showDate={false} showTime={true}
+                     record={{...record, [props["source"]]: record[props["source"]] === null ? null : "2020-01-01T" + record[props["source"]]}} />
+    } />
+);
+
+const TimeInput = (props) => (<_TimeInput format={(v) => v} parse={(v) => v} {...props} />);
+
 /** Reconfigure ReferenceInput to filter by the displayed repr field. */
 const ReferenceInput = (props) => {
     const ref = props["reference"];
@@ -48,7 +60,7 @@ const COMPONENTS = {
     Datagrid, DatagridSingle,
 
     BooleanField, DateField, NumberField, ReferenceField, ReferenceManyField,
-    ReferenceOneField, SelectField, TextField,
+    ReferenceOneField, SelectField, TextField, TimeField,
 
     BooleanInput, DateInput, DateTimeInput, NumberInput, ReferenceInput, SelectInput,
     TextInput, TimeInput

aiohttp_admin/backends/abc.py

@@ -28,11 +28,8 @@
 
 class Encoder(json.JSONEncoder):
     def default(self, o: object) -> Any:
-        if isinstance(o, date):
+        if isinstance(o, (date, time)):
             return str(o)
-        if isinstance(o, time):
-            # React-admin needs a datetime to display only a time...
-            return f"2000-01-01T{o}"
         if isinstance(o, Enum):
             return o.value
 

aiohttp_admin/backends/sqlalchemy.py

@@ -38,7 +38,7 @@
     sa.Integer: ("NumberField", "NumberInput", MPT({})),
     sa.Numeric: ("NumberField", "NumberInput", MPT({})),
     sa.String: ("TextField", "TextInput", MPT({})),
-    sa.Time: ("DateField", "TimeInput", MPT({"showDate": False, "showTime": True})),
+    sa.Time: ("TimeField", "TimeInput", MPT({})),
     sa.Uuid: ("TextField", "TextInput", MPT({})),  # TODO: validators
     # TODO: Set fields for below types.
     # sa.sql.sqltypes._AbstractInterval: (),