chore: add extent views

paneron · Mar 28, 2024 · 925b56f · 925b56f
1 parent 1fd756c
commit 925b56f
Show file tree

Hide file tree

Showing 2 changed files with 104 additions and 7 deletions.
diff --git a/src/classes/extent.tsx b/src/classes/extent.tsx
@@ -12,13 +12,19 @@ import { jsx, css, ClassNames } from '@emotion/react';
 import React from 'react';
 import {
   InputGroup, ControlGroup, FormGroup, Button, TextArea,
-  MenuItem, Tag, ProgressBar,
-  Colors,
-} from '@blueprintjs/core';
+  MenuItem, Tag, ProgressBar, NumericInput,
+  Colors} from '@blueprintjs/core';
 import { Select2 as Select, type ItemRenderer } from '@blueprintjs/select';
 import { Tooltip2 as Tooltip } from '@blueprintjs/popover2';
 import { useDebounce, DatasetContext } from '@riboseinc/paneron-extension-kit';
 import { PropertyDetailView } from '@riboseinc/paneron-registry-kit';
+import { type ItemClassConfiguration, ItemListView } from '@riboseinc/paneron-registry-kit/types';
+import { 
+  type CommonGRItemData,
+  DEFAULTS as SHARED_DEFAULTS,
+  ListItemView as CommonListItemView,
+  COMMON_PROPERTIES,
+} from './common';
 
 
 interface ExtentBoundingPolygonPoint {
@@ -29,7 +35,7 @@ interface ExtentBoundingPolygonPoint {
 }
 
 /** A.k.a. “domain of validity”. */
-export interface Extent {
+export interface Extent extends CommonGRItemData {
   n: number
   e: number
   s: number
@@ -56,8 +62,17 @@ function isExtent(val: any): val is Extent {
 }
 
 /** Placeholder/stub extent value. */
-export const DEFAULT_EXTENT: Extent = { name: '', n: 0, e: 0, s: 0, w: 0 } as const;
-
+export const DEFAULT_EXTENT: Extent = {
+  n: 0,
+  e: 0,
+  s: 0,
+  w: 0,
+  name: '',
+  identifier:0,
+  remarks: '',
+  informationSources: [], 
+  aliases:[]
+} as const;
 
 /**
  * A widget for editing extent data.
@@ -351,3 +366,83 @@ const EXTENT_REDUCE_FUNC = `
     return accumulator;
   }
 `;
+
+export const extents: ItemClassConfiguration<Extent> = {
+  ...COMMON_PROPERTIES,
+  meta: {
+    title: "Extent",
+    description: "Extent",
+    id: 'extents',
+    alternativeNames: [],
+  },
+  defaults: {
+    ...SHARED_DEFAULTS,
+    ...DEFAULT_EXTENT,
+  },
+  views: {
+    listItemView: CommonListItemView as ItemListView<Extent>,
+    editView: (props) => (
+      <ExtentEdit
+        onChange={props.onChange ? (newData: Extent) => {
+          if (!props.onChange) { return; }
+          props.onChange({ ...props, ...newData });
+        } : undefined} extent={props.itemData}>
+
+        <PropertyDetailView title="North">
+          {props.onChange
+            ? <NumericInput
+                value={props.itemData.n}
+                required
+                disabled={!props.onChange}
+                onChange={(evt) =>
+                  props.onChange?.({ ...props.itemData, n: evt.currentTarget.valueAsNumber })
+                }
+              />
+            : <NumericInput readOnly value={props.itemData.n} />}
+        </PropertyDetailView>
+
+        <PropertyDetailView title="East">
+          {props.onChange
+            ? <NumericInput
+                value={props.itemData.e}
+                required
+                disabled={!props.onChange}
+                onChange={(evt) =>
+                  props.onChange?.({ ...props.itemData, e: evt.currentTarget.valueAsNumber })
+                }
+              />
+            : <NumericInput readOnly value={props.itemData.e} />}
+        </PropertyDetailView>
+
+        <PropertyDetailView title="South">
+          {props.onChange
+            ? <NumericInput
+                value={props.itemData.s}
+                required
+                disabled={!props.onChange}
+                onChange={(evt) =>
+                  props.onChange?.({ ...props.itemData, s: evt.currentTarget.valueAsNumber })
+                }
+              />
+            : <NumericInput readOnly value={props.itemData.s} />}
+        </PropertyDetailView>
+
+         <PropertyDetailView title="West">
+          {props.onChange
+            ? <NumericInput
+                value={props.itemData.w}
+                required
+                disabled={!props.onChange}
+                onChange={(evt) =>
+                  props.onChange?.({ ...props.itemData, w: evt.currentTarget.valueAsNumber })
+                }
+              />
+            : <NumericInput readOnly value={props.itemData.w} />}
+        </PropertyDetailView>
+      </ExtentEdit>
+    ),
+  },
+
+  validatePayload: async () => true,
+  sanitizePayload: async (t) => t,
+};
diff --git a/src/registryConfig.ts b/src/registryConfig.ts
@@ -9,6 +9,7 @@ import { primeMeridian } from './classes/prime-meridian';
 import { coordinateSystemAxis } from './classes/coordinate-sys-axis';
 import { coordinateOpMethod } from './classes/coordinate-op-method';
 import { coordinateOpParameter } from './classes/coordinate-op-parameter';
+import { extents } from './classes/extent';
 
 import {
   cartesianCoordinateSystem,
@@ -40,4 +41,5 @@ export const itemClassConfiguration = {
   "coordinate-sys--vertical": verticalCoordinateSystem,
   "coordinate-sys--ellipsoidal": ellipsoidalCoordinateSystem,
   "coordinate-sys--spherical": sphericalCoordinateSystem,
-} as const;
+  "extents": extents
+} as const;