From 300b03d108a840f702db15a11c77c9479a9fd8ed Mon Sep 17 00:00:00 2001 From: Meijer Date: Fri, 7 Feb 2025 14:13:40 -0800 Subject: [PATCH 1/5] markings content --- app/src/features/standards/StandardsPage.tsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/app/src/features/standards/StandardsPage.tsx b/app/src/features/standards/StandardsPage.tsx index 1b43308f82..e12fcec983 100644 --- a/app/src/features/standards/StandardsPage.tsx +++ b/app/src/features/standards/StandardsPage.tsx @@ -1,4 +1,4 @@ -import { mdiLeaf, mdiPaw, mdiToolbox } from '@mdi/js'; +import { mdiLeaf, mdiPaw, mdiTag, mdiToolbox } from '@mdi/js'; import Box from '@mui/material/Box'; import { grey } from '@mui/material/colors'; import Container from '@mui/material/Container'; @@ -17,7 +17,8 @@ import { SpeciesStandards } from './view/species/SpeciesStandards'; export enum StandardsPageView { SPECIES = 'SPECIES', METHODS = 'METHODS', - ENVIRONMENT = 'ENVIRONMENT' + ENVIRONMENT = 'ENVIRONMENT', + MARKINGS = 'MARKINGS' } const StandardsPage = () => { @@ -26,7 +27,8 @@ const StandardsPage = () => { const views = [ { value: StandardsPageView.SPECIES, label: 'Species', icon: mdiPaw }, { value: StandardsPageView.METHODS, label: 'Sampling Methods', icon: mdiToolbox }, - { value: StandardsPageView.ENVIRONMENT, label: 'Environment variables', icon: mdiLeaf } + { value: StandardsPageView.ENVIRONMENT, label: 'Environment variables', icon: mdiLeaf }, + {value: StandardsPageView.MARKINGS, label: 'Markings', icon: mdiTag} ]; return ( @@ -56,6 +58,9 @@ const StandardsPage = () => { {/* ENVIRONMENT STANDARDS */} {activeView === StandardsPageView.ENVIRONMENT && } + + {/* MARKING TYPE STANDARDS */} + {activeView === StandardsPageView.MARKINGS && } From 10f95886dbb5ed15847e4299a52fe4b0385389c0 Mon Sep 17 00:00:00 2001 From: Meijer Date: Fri, 14 Feb 2025 10:50:06 -0800 Subject: [PATCH 2/5] console log, api loading issues --- app/src/features/standards/StandardsPage.tsx | 3 +- .../view/markings/MarkingStandards.tsx | 64 +++++++++++++++++++ .../view/markings/MarkingStandardsResults.tsx | 48 ++++++++++++++ 3 files changed, 114 insertions(+), 1 deletion(-) create mode 100644 app/src/features/standards/view/markings/MarkingStandards.tsx create mode 100644 app/src/features/standards/view/markings/MarkingStandardsResults.tsx diff --git a/app/src/features/standards/StandardsPage.tsx b/app/src/features/standards/StandardsPage.tsx index e12fcec983..58b5b273cb 100644 --- a/app/src/features/standards/StandardsPage.tsx +++ b/app/src/features/standards/StandardsPage.tsx @@ -13,6 +13,7 @@ import { useState } from 'react'; import { EnvironmentStandards } from './view/environment/EnvironmentStandards'; import { MethodStandards } from './view/methods/MethodStandards'; import { SpeciesStandards } from './view/species/SpeciesStandards'; +import { MarkingStandards } from './view/markings/MarkingStandards'; export enum StandardsPageView { SPECIES = 'SPECIES', @@ -60,7 +61,7 @@ const StandardsPage = () => { {activeView === StandardsPageView.ENVIRONMENT && } {/* MARKING TYPE STANDARDS */} - {activeView === StandardsPageView.MARKINGS && } + {activeView === StandardsPageView.MARKINGS && } diff --git a/app/src/features/standards/view/markings/MarkingStandards.tsx b/app/src/features/standards/view/markings/MarkingStandards.tsx new file mode 100644 index 0000000000..43200701e8 --- /dev/null +++ b/app/src/features/standards/view/markings/MarkingStandards.tsx @@ -0,0 +1,64 @@ +import { Box, Skeleton, Stack, Typography } from '@mui/material'; +import { AxiosInstance } from 'axios'; +import { LoadingGuard } from 'components/loading/LoadingGuard'; +import useAxios from 'hooks/api/useAxios'; +import { useMarkingApi } from 'hooks/cb_api/useMarkingApi'; +import useDataLoader from 'hooks/useDataLoader'; +import { IMarkingColourOption, IMarkingTypeResponse } from 'interfaces/useMarkingApi.interface'; +import { MarkingStandardsResults } from './MarkingStandardsResults'; + +export const MarkingStandards = () => { + const axiosInstance: AxiosInstance = useAxios(); + const markingApi = useMarkingApi(axiosInstance); + + const markingsDataLoader = useDataLoader(async () => { + console.log('Fetching marking standards data...'); + try { + const markingTypes: IMarkingTypeResponse[] = await markingApi.getMarkingTypeOptions(); + const markingColours: IMarkingColourOption[] = await markingApi.getMarkingColourOptions(); + + console.log('Marking Types:', markingTypes); + console.log('Marking Colours:', markingColours); + + return { + markingTypes, + markingColours, + transformedMarkingTypes: markingTypes.map((item: IMarkingTypeResponse) => ({ + value: item.marking_type_id, + label: item.name + })), + transformedMarkingColours: markingColours.map((item: IMarkingColourOption) => ({ + value: item.colour_id, + label: item.colour + })) + }; + } catch (error) { + console.error('Failed to fetch marking data:', error); + return { markingTypes: [], markingColours: [] }; + } + }); + + return ( + + + + + + } + hasNoData={ + !(markingsDataLoader.data?.markingTypes.length || markingsDataLoader.data?.markingColours.length) && + markingsDataLoader.isReady + } + hasNoDataFallback={ + + No marking standards found + + }> + + + + ); +}; diff --git a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx new file mode 100644 index 0000000000..77d42b61b7 --- /dev/null +++ b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx @@ -0,0 +1,48 @@ +import { blueGrey, grey } from '@mui/material/colors'; +import Stack from '@mui/material/Stack'; +import ColouredRectangleChip from 'components/chips/ColouredRectangleChip'; +import { AccordionStandardCard } from 'features/standards/view/components/AccordionStandardCard'; + +interface IMarkingStandardsResultsProps { + data?: { + markingTypes: { marking_type_id: string; name: string; description?: string }[]; + markingColours: { colour_id: string; colour: string }[]; + }; +} + +/** + * Component to display marking standards results + * + * @return {*} + */ +export const MarkingStandardsResults = (props: IMarkingStandardsResultsProps) => { + const { data } = props; + + if (!data || !(data.markingTypes.length || data.markingColours.length)) { + // No data to display + return null; + } + + return ( + + {data.markingTypes.map((type) => ( + + ))} + {data.markingColours.map((colour) => ( + + + + + + ))} + + ); +}; From dcc191fc08aa12f8af05e15d19346a4a88f86d80 Mon Sep 17 00:00:00 2001 From: Meijer Date: Wed, 19 Feb 2025 10:44:12 -0800 Subject: [PATCH 3/5] api setup with internal server error --- api/src/models/standards-view.ts | 8 ++ api/src/openapi/schemas/standards.ts | 47 +++++++++++ api/src/paths/standards/markings/index.ts | 82 +++++++++++++++++++ api/src/services/standards-service.ts | 22 ++++- .../view/markings/MarkingStandards.tsx | 44 +++------- .../view/markings/MarkingStandardsResults.tsx | 16 ++-- app/src/hooks/api/useStandardsApi.ts | 23 +++++- .../interfaces/useStandardsApi.interface.ts | 12 +++ 8 files changed, 210 insertions(+), 44 deletions(-) create mode 100644 api/src/paths/standards/markings/index.ts diff --git a/api/src/models/standards-view.ts b/api/src/models/standards-view.ts index b611855b15..564f9d0dbc 100644 --- a/api/src/models/standards-view.ts +++ b/api/src/models/standards-view.ts @@ -33,6 +33,14 @@ export const EnvironmentStandardsSchema = z.object({ export type EnvironmentStandards = z.infer; +export interface MarkingStandards { + types: {name: string; + marking_type_id: string; + description: string;}[]; + colours: {colour: string; + colour_id: string;}[]; +} + export const MethodStandardSchema = z.object({ method_lookup_id: z.number(), name: z.string(), diff --git a/api/src/openapi/schemas/standards.ts b/api/src/openapi/schemas/standards.ts index 6457fcdba7..eb2a0ca73c 100644 --- a/api/src/openapi/schemas/standards.ts +++ b/api/src/openapi/schemas/standards.ts @@ -135,3 +135,50 @@ export const MethodStandardSchema: OpenAPIV3.SchemaObject = { } } }; + +export const MarkingStandardsSchema: OpenAPIV3.SchemaObject = { + type: 'object', + description: 'Marking standards response object showing supported marking types and colours', + additionalProperties: false, + properties: { + types: { + type: 'array', + description: 'Array of marking types', + items: { + type: 'object', + properties: { + name: { + type: 'string', + description: 'Name of the marking type' + }, + marking_type_id: { + type: 'integer', + description: 'ID of the marking type' + }, + description: { + type: 'string', + description: 'Description of the marking type', + nullable: true + } + } + } + }, + colours: { + type: 'array', + description: 'Array of marking colour options', + items: { + type: 'object', + properties: { + colour: { + type: 'string', + description: 'Name of the marking colour' + }, + colour_id: { + type: 'integer', + description: 'ID of the marking colour' + } + } + } + } + } +}; diff --git a/api/src/paths/standards/markings/index.ts b/api/src/paths/standards/markings/index.ts new file mode 100644 index 0000000000..0426494ce6 --- /dev/null +++ b/api/src/paths/standards/markings/index.ts @@ -0,0 +1,82 @@ +import { RequestHandler } from 'express'; +import { Operation } from 'express-openapi'; +import { getAPIUserDBConnection } from '../../../database/db'; +import { MarkingStandardsSchema } from '../../../openapi/schemas/standards'; +import { StandardsService } from '../../../services/standards-service'; +import { getLogger } from '../../../utils/logger'; + +const defaultLog = getLogger('paths/projects'); + +export const GET: Operation = [getMarkingStandards()]; + +GET.apiDoc = { + description: 'Gets lookup values for marking variables', + tags: ['standards'], + parameters: [ + { + in: 'query', + name: 'keyword', + required: false, + schema: { + type: 'string', + nullable: true + } + } + ], + responses: { + 200: { + description: 'Marking data standards response object.', + content: { + 'application/json': { + schema: MarkingStandardsSchema + } + } + }, + 400: { + $ref: '#/components/responses/400' + }, + 401: { + $ref: '#/components/responses/401' + }, + 403: { + $ref: '#/components/responses/403' + }, + 500: { + $ref: '#/components/responses/500' + }, + default: { + $ref: '#/components/responses/default' + } + } +}; + +/** + * Get marking data standards + * + * @returns {RequestHandler} + */ +export function getMarkingStandards(): RequestHandler { + return async (req, res) => { + const connection = getAPIUserDBConnection(); + + try { + await connection.open(); + + const standardsService = new StandardsService(connection); + + const keyword = (req.query.keyword as string) ?? ''; + + const response = await standardsService.getMarkingStandards(keyword); + + await connection.commit(); + + return res.status(200).json(response); + } catch (error) { + defaultLog.error({ label: 'getMarkingStandards', message: 'error', error }); + connection.rollback(); + throw error; + } finally { + connection.release(); + } + }; +} diff --git a/api/src/services/standards-service.ts b/api/src/services/standards-service.ts index eed1217efb..825590cca0 100644 --- a/api/src/services/standards-service.ts +++ b/api/src/services/standards-service.ts @@ -1,5 +1,5 @@ import { IDBConnection } from '../database/db'; -import { EnvironmentStandards, ISpeciesStandards, MethodStandard } from '../models/standards-view'; +import { EnvironmentStandards, ISpeciesStandards, MarkingStandards, MethodStandard } from '../models/standards-view'; import { StandardsRepository } from '../repositories/standards-repository'; import { CritterbaseService } from './critterbase-service'; import { DBService } from './db-service'; @@ -54,6 +54,26 @@ export class StandardsService extends DBService { * Gets environment standards * * @param {string} keyword - search term for filtering the response based on environemntal variable name + * @return {MarkingStandard[]} + * @memberof standardsService + */ + async getMarkingStandards(keyword?: string): Promise { + const types = await this.critterbaseService.getMarkingTypes(); + const colours = await this.critterbaseService.getColours(); + return { + types: types.map((type) => { + return { name: type.key, marking_type_id: type.id, description: type.value }; + }), + colours: colours.map((colour) => { + return { colour: colour.key, colour_id: colour.id }; + }) + }; + } + + /** + * Gets marking standards + * + * @param {string} keyword - search term for filtering the response based on environemntal variable name * @return {EnvironmentStandard[]} * @memberof standardsService */ diff --git a/app/src/features/standards/view/markings/MarkingStandards.tsx b/app/src/features/standards/view/markings/MarkingStandards.tsx index 43200701e8..600e966447 100644 --- a/app/src/features/standards/view/markings/MarkingStandards.tsx +++ b/app/src/features/standards/view/markings/MarkingStandards.tsx @@ -1,42 +1,22 @@ import { Box, Skeleton, Stack, Typography } from '@mui/material'; -import { AxiosInstance } from 'axios'; import { LoadingGuard } from 'components/loading/LoadingGuard'; -import useAxios from 'hooks/api/useAxios'; -import { useMarkingApi } from 'hooks/cb_api/useMarkingApi'; +import { useBiohubApi } from 'hooks/useBioHubApi'; import useDataLoader from 'hooks/useDataLoader'; -import { IMarkingColourOption, IMarkingTypeResponse } from 'interfaces/useMarkingApi.interface'; +import { useEffect } from 'react'; import { MarkingStandardsResults } from './MarkingStandardsResults'; export const MarkingStandards = () => { - const axiosInstance: AxiosInstance = useAxios(); - const markingApi = useMarkingApi(axiosInstance); + const biohubApi = useBiohubApi(); - const markingsDataLoader = useDataLoader(async () => { - console.log('Fetching marking standards data...'); - try { - const markingTypes: IMarkingTypeResponse[] = await markingApi.getMarkingTypeOptions(); - const markingColours: IMarkingColourOption[] = await markingApi.getMarkingColourOptions(); + const markingsDataLoader = useDataLoader((keyword?: string) => biohubApi.standards.getMarkingsStandards(keyword)); - console.log('Marking Types:', markingTypes); - console.log('Marking Colours:', markingColours); + useEffect(() => { + markingsDataLoader.load(); + }, [markingsDataLoader]); - return { - markingTypes, - markingColours, - transformedMarkingTypes: markingTypes.map((item: IMarkingTypeResponse) => ({ - value: item.marking_type_id, - label: item.name - })), - transformedMarkingColours: markingColours.map((item: IMarkingColourOption) => ({ - value: item.colour_id, - label: item.colour - })) - }; - } catch (error) { - console.error('Failed to fetch marking data:', error); - return { markingTypes: [], markingColours: [] }; - } - }); + if (!markingsDataLoader.data) { + return <>; + } return ( @@ -49,7 +29,7 @@ export const MarkingStandards = () => { } hasNoData={ - !(markingsDataLoader.data?.markingTypes.length || markingsDataLoader.data?.markingColours.length) && + !(markingsDataLoader.data?.types.length || markingsDataLoader.data?.colours.length) && markingsDataLoader.isReady } hasNoDataFallback={ @@ -57,7 +37,7 @@ export const MarkingStandards = () => { No marking standards found }> - + ); diff --git a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx index 77d42b61b7..d92871d93e 100644 --- a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx +++ b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx @@ -2,12 +2,10 @@ import { blueGrey, grey } from '@mui/material/colors'; import Stack from '@mui/material/Stack'; import ColouredRectangleChip from 'components/chips/ColouredRectangleChip'; import { AccordionStandardCard } from 'features/standards/view/components/AccordionStandardCard'; +import { IMarkingsStandards } from 'interfaces/useStandardsApi.interface'; interface IMarkingStandardsResultsProps { - data?: { - markingTypes: { marking_type_id: string; name: string; description?: string }[]; - markingColours: { colour_id: string; colour: string }[]; - }; + standards: IMarkingsStandards } /** @@ -16,16 +14,16 @@ interface IMarkingStandardsResultsProps { * @return {*} */ export const MarkingStandardsResults = (props: IMarkingStandardsResultsProps) => { - const { data } = props; + const { standards } = props; - if (!data || !(data.markingTypes.length || data.markingColours.length)) { - // No data to display + if (!standards || !(standards.types.length || standards.colours.length)) { + // No standards to display return null; } return ( - {data.markingTypes.map((type) => ( + {standards.types.map((type) => ( colour={grey[100]} /> ))} - {data.markingColours.map((colour) => ( + {standards.colours.map((colour) => ( { return data; }; + /** + * Fetch markings + * + * @param {string} keyword + * @return {*} {Promise} + */ + const getMarkingsStandards = async (keyword?: string): Promise => { + const params = { keyword }; + + const { data } = await axios.get('/api/standards/markings', { + params, + paramsSerializer: (params) => qs.stringify(params) + }); + + return data; + }; + + return { getSpeciesStandards, getEnvironmentStandards, - getMethodStandards + getMethodStandards, + getMarkingsStandards }; }; diff --git a/app/src/interfaces/useStandardsApi.interface.ts b/app/src/interfaces/useStandardsApi.interface.ts index 09069b72c3..7668e50f2f 100644 --- a/app/src/interfaces/useStandardsApi.interface.ts +++ b/app/src/interfaces/useStandardsApi.interface.ts @@ -3,6 +3,7 @@ import { CBQuantitativeMeasurementTypeDefinition, ICollectionUnit } from './useCritterApi.interface'; +import { IMarkingColourOption, IMarkingTypeResponse } from './useMarkingApi.interface'; interface IStandardNameDescription { name: string; @@ -59,3 +60,14 @@ export interface IEnvironmentStandards { qualitative: IQualitativeAttributeStandard[]; quantitative: IQuantitativeAttributeStandard[]; } + +/** + * Data standards for markings + * + * @export + * @interface IMarkingsStandards + */ +export interface IMarkingsStandards { + types: IMarkingTypeResponse[]; + colours: IMarkingColourOption[]; +} From 4402f19e7e54c450abe4d7c0f78bb69b32ed3fff Mon Sep 17 00:00:00 2001 From: Meijer Date: Wed, 19 Feb 2025 11:42:04 -0800 Subject: [PATCH 4/5] api fix --- api/src/models/standards-view.ts | 7 +-- api/src/openapi/schemas/standards.ts | 8 +++- api/src/services/standards-service.ts | 2 +- .../view/markings/MarkingStandardsResults.tsx | 43 ++++++++++++------- 4 files changed, 36 insertions(+), 24 deletions(-) diff --git a/api/src/models/standards-view.ts b/api/src/models/standards-view.ts index 564f9d0dbc..4b1efbb947 100644 --- a/api/src/models/standards-view.ts +++ b/api/src/models/standards-view.ts @@ -34,11 +34,8 @@ export const EnvironmentStandardsSchema = z.object({ export type EnvironmentStandards = z.infer; export interface MarkingStandards { - types: {name: string; - marking_type_id: string; - description: string;}[]; - colours: {colour: string; - colour_id: string;}[]; + types: { name: string; marking_type_id: string; description: string }[]; + colours: { colour: string; colour_id: string; description: string }[]; } export const MethodStandardSchema = z.object({ diff --git a/api/src/openapi/schemas/standards.ts b/api/src/openapi/schemas/standards.ts index eb2a0ca73c..e344bc61b3 100644 --- a/api/src/openapi/schemas/standards.ts +++ b/api/src/openapi/schemas/standards.ts @@ -152,7 +152,7 @@ export const MarkingStandardsSchema: OpenAPIV3.SchemaObject = { description: 'Name of the marking type' }, marking_type_id: { - type: 'integer', + type: 'string', description: 'ID of the marking type' }, description: { @@ -174,8 +174,12 @@ export const MarkingStandardsSchema: OpenAPIV3.SchemaObject = { description: 'Name of the marking colour' }, colour_id: { - type: 'integer', + type: 'string', description: 'ID of the marking colour' + }, + description: { + type: 'string', + description: 'description of the marking colour' } } } diff --git a/api/src/services/standards-service.ts b/api/src/services/standards-service.ts index 825590cca0..a58e61ad71 100644 --- a/api/src/services/standards-service.ts +++ b/api/src/services/standards-service.ts @@ -65,7 +65,7 @@ export class StandardsService extends DBService { return { name: type.key, marking_type_id: type.id, description: type.value }; }), colours: colours.map((colour) => { - return { colour: colour.key, colour_id: colour.id }; + return { colour: colour.value, colour_id: colour.id, description: colour.key }; }) }; } diff --git a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx index d92871d93e..a0182b9e71 100644 --- a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx +++ b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx @@ -5,7 +5,7 @@ import { AccordionStandardCard } from 'features/standards/view/components/Accord import { IMarkingsStandards } from 'interfaces/useStandardsApi.interface'; interface IMarkingStandardsResultsProps { - standards: IMarkingsStandards + standards: IMarkingsStandards; } /** @@ -23,24 +23,35 @@ export const MarkingStandardsResults = (props: IMarkingStandardsResultsProps) => return ( - {standards.types.map((type) => ( - - ))} - {standards.colours.map((colour) => ( - + {/* Accordion for Marking Types */} + {standards.types.length > 0 && ( + - + {standards.types.map((type) => ( + + ))} - ))} + )} + + {/* Accordion for Marking Colours */} + {standards.colours.length > 0 && ( + + + {standards.colours.map((colour) => ( + + ))} + + + )} ); }; From 12846b06a96d09a3d2b42afb7dea900d0773da5a Mon Sep 17 00:00:00 2001 From: Meijer Date: Wed, 19 Feb 2025 12:15:41 -0800 Subject: [PATCH 5/5] make fix --- api/src/paths/standards/markings/index.ts | 6 ++---- api/src/services/standards-service.ts | 9 ++++----- app/src/features/standards/StandardsPage.tsx | 6 +++--- .../view/markings/MarkingStandardsResults.tsx | 15 +++------------ app/src/hooks/api/useStandardsApi.ts | 8 ++++++-- 5 files changed, 18 insertions(+), 26 deletions(-) diff --git a/api/src/paths/standards/markings/index.ts b/api/src/paths/standards/markings/index.ts index 0426494ce6..cfa5005d7c 100644 --- a/api/src/paths/standards/markings/index.ts +++ b/api/src/paths/standards/markings/index.ts @@ -56,7 +56,7 @@ GET.apiDoc = { * @returns {RequestHandler} */ export function getMarkingStandards(): RequestHandler { - return async (req, res) => { + return async (_, res) => { const connection = getAPIUserDBConnection(); try { @@ -64,9 +64,7 @@ export function getMarkingStandards(): RequestHandler { const standardsService = new StandardsService(connection); - const keyword = (req.query.keyword as string) ?? ''; - - const response = await standardsService.getMarkingStandards(keyword); + const response = await standardsService.getMarkingStandards(); await connection.commit(); diff --git a/api/src/services/standards-service.ts b/api/src/services/standards-service.ts index a58e61ad71..ac4d200b5d 100644 --- a/api/src/services/standards-service.ts +++ b/api/src/services/standards-service.ts @@ -51,13 +51,12 @@ export class StandardsService extends DBService { } /** - * Gets environment standards + * Gets marking standards * - * @param {string} keyword - search term for filtering the response based on environemntal variable name - * @return {MarkingStandard[]} + * @return {MarkingStandards} * @memberof standardsService */ - async getMarkingStandards(keyword?: string): Promise { + async getMarkingStandards(): Promise { const types = await this.critterbaseService.getMarkingTypes(); const colours = await this.critterbaseService.getColours(); return { @@ -71,7 +70,7 @@ export class StandardsService extends DBService { } /** - * Gets marking standards + * Gets environment standards * * @param {string} keyword - search term for filtering the response based on environemntal variable name * @return {EnvironmentStandard[]} diff --git a/app/src/features/standards/StandardsPage.tsx b/app/src/features/standards/StandardsPage.tsx index 58b5b273cb..cc214802af 100644 --- a/app/src/features/standards/StandardsPage.tsx +++ b/app/src/features/standards/StandardsPage.tsx @@ -11,9 +11,9 @@ import { SystemAlertBanner } from 'features/alert/banner/SystemAlertBanner'; import { SystemAlertBannerEnum } from 'interfaces/useAlertApi.interface'; import { useState } from 'react'; import { EnvironmentStandards } from './view/environment/EnvironmentStandards'; +import { MarkingStandards } from './view/markings/MarkingStandards'; import { MethodStandards } from './view/methods/MethodStandards'; import { SpeciesStandards } from './view/species/SpeciesStandards'; -import { MarkingStandards } from './view/markings/MarkingStandards'; export enum StandardsPageView { SPECIES = 'SPECIES', @@ -29,7 +29,7 @@ const StandardsPage = () => { { value: StandardsPageView.SPECIES, label: 'Species', icon: mdiPaw }, { value: StandardsPageView.METHODS, label: 'Sampling Methods', icon: mdiToolbox }, { value: StandardsPageView.ENVIRONMENT, label: 'Environment variables', icon: mdiLeaf }, - {value: StandardsPageView.MARKINGS, label: 'Markings', icon: mdiTag} + { value: StandardsPageView.MARKINGS, label: 'Markings', icon: mdiTag } ]; return ( @@ -61,7 +61,7 @@ const StandardsPage = () => { {activeView === StandardsPageView.ENVIRONMENT && } {/* MARKING TYPE STANDARDS */} - {activeView === StandardsPageView.MARKINGS && } + {activeView === StandardsPageView.MARKINGS && } diff --git a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx index a0182b9e71..be0768dbde 100644 --- a/app/src/features/standards/view/markings/MarkingStandardsResults.tsx +++ b/app/src/features/standards/view/markings/MarkingStandardsResults.tsx @@ -1,6 +1,5 @@ -import { blueGrey, grey } from '@mui/material/colors'; +import { grey } from '@mui/material/colors'; import Stack from '@mui/material/Stack'; -import ColouredRectangleChip from 'components/chips/ColouredRectangleChip'; import { AccordionStandardCard } from 'features/standards/view/components/AccordionStandardCard'; import { IMarkingsStandards } from 'interfaces/useStandardsApi.interface'; @@ -28,11 +27,7 @@ export const MarkingStandardsResults = (props: IMarkingStandardsResultsProps) => {standards.types.map((type) => ( - + ))} @@ -43,11 +38,7 @@ export const MarkingStandardsResults = (props: IMarkingStandardsResultsProps) => {standards.colours.map((colour) => ( - + ))} diff --git a/app/src/hooks/api/useStandardsApi.ts b/app/src/hooks/api/useStandardsApi.ts index 72821057ee..41d75ad691 100644 --- a/app/src/hooks/api/useStandardsApi.ts +++ b/app/src/hooks/api/useStandardsApi.ts @@ -1,5 +1,10 @@ import { AxiosInstance } from 'axios'; -import { IEnvironmentStandards, IMarkingsStandards, IMethodStandard, ISpeciesStandards } from 'interfaces/useStandardsApi.interface'; +import { + IEnvironmentStandards, + IMarkingsStandards, + IMethodStandard, + ISpeciesStandards +} from 'interfaces/useStandardsApi.interface'; import qs from 'qs'; /** @@ -72,7 +77,6 @@ const useStandardsApi = (axios: AxiosInstance) => { return data; }; - return { getSpeciesStandards, getEnvironmentStandards,