iritmaximus/nowdatabase
1
0
Fork 0
mirror of https://github.com/nowcommunity/nowdatabase.git synced 2026-10-12 19:13:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #566 from nowcommunity/non-hidable-columns

Browse Source 
Non hidable columns and default filters
This commit is contained in:
Aaro Koivukangas
2024-11-18 16:45:51 +01:00
committed by GitHub
parent 0928daad52 4f83efd878
commit 0ad35ae813
7 changed files with 152 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
documentation/guides/creating_new_tableview.md
+2
View File
@@ -11,6 +11,8 @@ Following things are needed to create a new page with a table (examples are all
- Frontend:
- Create necessary types in [backendtypes](../../frontend/src/backendTypes.d.ts)
- Create a [component](../../frontend/src/components/CrossSearch/CrossSearchTable.tsx) (note that cross search borrows the detail parts from localities). The tableview is defined via variables columns and visibleColumns. Columns in the most simple form only require an accesrKey and a header. If an accessorFn is used, a separate id is required as well. The accessorkey functions as a key to fetch data as well as an id to reference the column as well. The variable visibleColumns takes in accessorKeys or ids for columns, set to false, to be hidden by default.
- non-default filtering (eg filterVariant 'range' for numbers or filterFn 'contains' for text substrings) require no null values in the data for given column. It is needed to use accessorFn to map nulls to 'N/A' for example. ('N/A' works for numbers and text.)
- non-hideable columns can be set by setting parameter `enableHiding: false`
- Create a button for the component in [navigation bar](../../frontend/src/components/NavBar.tsx)
- Create a relevant page-object for [Pages](../../frontend/src/components/pages.tsx)
- Add a route for the component to [App](../../frontend/src/App.tsx)
frontend/src/common.tsx
+2
View File
@@ -19,6 +19,7 @@ export const referenceTableColumns: MRT_ColumnDef<Reference>[] = [
Cell,
header: 'Author',
maxSize: 60,
filterFn: 'contains',
},
{
accessorKey: 'date_primary',
@@ -33,6 +34,7 @@ export const referenceTableColumns: MRT_ColumnDef<Reference>[] = [
header: 'Title',
maxSize: 60,
filterFn: 'contains',
enableHiding: false,
},
{
accessorFn: ({ ref_journal }) => ref_journal?.journal_title || '',
frontend/src/components/CrossSearch/CrossSearchTable.tsx
+72 -21
View File
@@ -16,36 +16,49 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
{
accessorKey: 'loc_name',
header: 'Locality name',
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'country',
header: 'Country',
filterFn: 'contains',
},
{
accessorKey: 'state',
id: 'state',
accessorFn: row => row.state || 'N/A',
header: 'State',
filterFn: 'contains',
},
{
accessorKey: 'county',
id: 'county',
accessorFn: row => row.county || 'N/A',
header: 'County',
filterFn: 'contains',
},
{
accessorKey: 'bfa_max',
id: 'bfa_max',
accessorFn: row => row.bfa_max || 'N/A',
header: 'BFA max',
filterFn: 'contains',
},
{
accessorKey: 'bfa_min',
id: 'bfa_min',
accessorFn: row => row.bfa_min || 'N/A',
header: 'BFA min',
filterFn: 'contains',
},
{
accessorKey: 'max_age',
header: 'Max age',
filterVariant: 'range',
Cell: ({ cell }) => (cell.getValue() as number).toFixed(3),
},
{
accessorKey: 'min_age',
header: 'Min age',
filterVariant: 'range',
Cell: ({ cell }) => (cell.getValue() as number).toFixed(3),
},
{
accessorKey: 'frac_max',
@@ -56,16 +69,22 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
header: 'Frac min',
},
{
accessorKey: 'chron',
id: 'chron',
accessorFn: row => row.chron || 'N/A',
header: 'Chron',
filterFn: 'contains',
},
{
accessorKey: 'basin',
id: 'basin',
accessorFn: row => row.basin || 'N/A',
header: 'Basin',
filterFn: 'contains',
},
{
accessorKey: 'subbasin',
id: 'subbasin',
accessorFn: row => row.subbasin || 'N/A',
header: 'Subbasin',
filterFn: 'contains',
},
{
accessorKey: 'dms_lat',
@@ -98,16 +117,22 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
header: 'Gen locality',
},
{
accessorKey: 'plate',
id: 'plate',
accessorFn: row => row.plate || 'N/A',
header: 'Plate',
filterFn: 'contains',
},
{
accessorKey: 'formation',
id: 'formation',
accessorFn: row => row.formation || 'N/A',
header: 'Formation',
filterFn: 'contains',
},
{
accessorKey: 'member',
id: 'member',
accessorFn: row => row.member || 'N/A',
header: 'Member',
filterFn: 'contains',
},
{
accessorKey: 'bed',
@@ -115,68 +140,90 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
},
{
accessorKey: 'species_id',
header: 'Species Id',
header: 'Id',
size: 20,
},
{
accessorKey: 'subclass_or_superorder_name',
id: 'subclass_or_superorder_name',
accessorFn: row => row.subclass_or_superorder_name || 'N/A',
header: 'Subclass or Superorder',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'order_name',
header: 'Order',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'suborder_or_superfamily_name',
id: 'suborder_or_superfamily_name',
accessorFn: row => row.suborder_or_superfamily_name || 'N/A',
header: 'Suborder or Superfamily',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'family_name',
id: 'family_name',
accessorFn: row => row.family_name || 'N/A',
header: 'Family',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'subfamily_name',
id: 'subfamily_name',
accessorFn: row => row.subfamily_name || 'N/A',
header: 'Subfamily or Tribe',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'genus_name',
header: 'Genus',
size: 20,
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'species_name',
header: 'Species',
size: 20,
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'unique_identifier',
header: 'Unique Identifier',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'taxonomic_status',
id: 'taxonomic_status',
accessorFn: row => row.taxonomic_status || 'N/A',
header: 'Taxonomic Status',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'common_name',
id: 'common_name',
accessorFn: row => row.common_name || 'N/A',
header: 'Common Name',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'sp_author',
id: 'sp_author',
accessorFn: row => row.sp_author || 'N/A',
header: 'Author',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'strain',
id: 'strain',
accessorFn: row => row.strain || 'N/A',
header: 'Strain',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'gene',
@@ -184,14 +231,18 @@ export const CrossSearchTable = ({ selectorFn }: { selectorFn?: (newObject: Cros
size: 20,
},
{
accessorKey: 'body_mass',
id: 'body_mass',
accessorFn: row => row.body_mass || 'N/A',
header: 'Body Mass',
size: 20,
filterVariant: 'range',
},
{
accessorKey: 'brain_mass',
id: 'brain_mass',
accessorFn: row => row.brain_mass || 'N/A',
header: 'Brain Mass',
size: 20,
filterVariant: 'range',
},
],
[]
frontend/src/components/Locality/LocalityTable.tsx
+34 -11
View File
@@ -13,32 +13,43 @@ export const LocalityTable = ({ selectorFn }: { selectorFn?: (newObject: Localit
() => [
{
accessorKey: 'lid',
header: 'Id',
header: 'Locality Id',
size: 20,
},
{
accessorKey: 'loc_name',
header: 'Name',
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'country',
header: 'Country',
filterFn: 'contains',
},
{
accessorKey: 'state',
id: 'state',
accessorFn: row => row.state || 'N/A',
header: 'State',
filterFn: 'contains',
},
{
accessorKey: 'county',
id: 'county',
accessorFn: row => row.county || 'N/A',
header: 'County',
filterFn: 'contains',
},
{
accessorKey: 'bfa_max',
id: 'bfa_max',
accessorFn: row => row.bfa_max || 'N/A',
header: 'BFA max',
filterFn: 'contains',
},
{
accessorKey: 'bfa_min',
id: 'bfa_min',
accessorFn: row => row.bfa_min || 'N/A',
header: 'BFA min',
filterFn: 'contains',
},
{
accessorKey: 'max_age',
@@ -61,16 +72,22 @@ export const LocalityTable = ({ selectorFn }: { selectorFn?: (newObject: Localit
header: 'Frac min',
},
{
accessorKey: 'chron',
id: 'chron',
accessorFn: row => row.chron || 'N/A',
header: 'Chron',
filterFn: 'contains',
},
{
accessorKey: 'basin',
id: 'basin',
accessorFn: row => row.basin || 'N/A',
header: 'Basin',
filterFn: 'contains',
},
{
accessorKey: 'subbasin',
id: 'subbasin',
accessorFn: row => row.subbasin || 'N/A',
header: 'Subbasin',
filterFn: 'contains',
},
{
accessorKey: 'dms_lat',
@@ -103,16 +120,22 @@ export const LocalityTable = ({ selectorFn }: { selectorFn?: (newObject: Localit
header: 'Gen locality',
},
{
accessorKey: 'plate',
id: 'plate',
accessorFn: row => row.plate || 'N/A',
header: 'Plate',
filterFn: 'contains',
},
{
accessorKey: 'formation',
id: 'formation',
accessorFn: row => row.formation || 'N/A',
header: 'Formation',
filterFn: 'contains',
},
{
accessorKey: 'member',
id: 'member',
accessorFn: row => row.member || 'N/A',
header: 'Member',
filterFn: 'contains',
},
{
accessorKey: 'bed',
frontend/src/components/Species/SpeciesTable.tsx
+36 -10
View File
@@ -14,64 +14,86 @@ export const SpeciesTable = ({ selectorFn }: { selectorFn?: (id: Species) => voi
size: 20,
},
{
accessorKey: 'subclass_or_superorder_name',
id: 'subclass_or_superorder_name',
accessorFn: row => row.subclass_or_superorder_name || 'N/A',
header: 'Subclass or Superorder',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'order_name',
header: 'Order',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'suborder_or_superfamily_name',
id: 'suborder_or_superfamily_name',
accessorFn: row => row.suborder_or_superfamily_name || 'N/A',
header: 'Suborder or Superfamily',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'family_name',
id: 'family_name',
accessorFn: row => row.family_name || 'N/A',
header: 'Family',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'subfamily_name',
id: 'subfamily_name',
accessorFn: row => row.subfamily_name || 'N/A',
header: 'Subfamily or Tribe',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'genus_name',
header: 'Genus',
size: 20,
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'species_name',
header: 'Species',
size: 20,
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'unique_identifier',
header: 'Unique Identifier',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'taxonomic_status',
id: 'taxonomic_status',
accessorFn: row => row.taxonomic_status || 'N/A',
header: 'Taxonomic Status',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'common_name',
id: 'common_name',
accessorFn: row => row.common_name || 'N/A',
header: 'Common Name',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'sp_author',
id: 'sp_author',
accessorFn: row => row.sp_author || 'N/A',
header: 'Author',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'strain',
id: 'strain',
accessorFn: row => row.strain || 'N/A',
header: 'Strain',
size: 20,
filterFn: 'contains',
},
{
accessorKey: 'gene',
@@ -79,14 +101,18 @@ export const SpeciesTable = ({ selectorFn }: { selectorFn?: (id: Species) => voi
size: 20,
},
{
accessorKey: 'body_mass',
id: 'body_mass',
accessorFn: row => row.body_mass || 'N/A',
header: 'Body Mass',
size: 20,
filterVariant: 'range',
},
{
accessorKey: 'brain_mass',
id: 'brain_mass',
accessorFn: row => row.brain_mass || 'N/A',
header: 'Brain Mass',
size: 20,
filterVariant: 'range',
},
],
[]
frontend/src/components/TimeBound/TimeBoundTable.tsx
+3
View File
@@ -22,6 +22,8 @@ export const TimeBoundTable = ({
{
accessorKey: 'b_name',
header: 'Name',
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'age',
@@ -31,6 +33,7 @@ export const TimeBoundTable = ({
{
accessorKey: 'b_comment',
header: 'Comment',
filterFn: 'contains',
},
],
[]
frontend/src/components/TimeUnit/TimeUnitTable.tsx
+3
View File
@@ -16,6 +16,8 @@ export const TimeUnitTable = ({ selectorFn }: { selectorFn?: (newTimeUnit: TimeU
{
accessorKey: 'tu_display_name',
header: 'Time Unit',
enableHiding: false,
filterFn: 'contains',
},
{
accessorKey: 'low_bound',
@@ -30,6 +32,7 @@ export const TimeUnitTable = ({ selectorFn }: { selectorFn?: (newTimeUnit: TimeU
{
accessorKey: 'seq_name',
header: 'Sequence',
filterFn: 'contains',
},
{
accessorKey: 'rank',