diff --git a/cypress/e2e/catalogue/catalogueItems.cy.ts b/cypress/e2e/catalogue/catalogueItems.cy.ts index 085d45931..161200538 100644 --- a/cypress/e2e/catalogue/catalogueItems.cy.ts +++ b/cypress/e2e/catalogue/catalogueItems.cy.ts @@ -17,7 +17,7 @@ describe('Catalogue Items', () => { cy.findByLabelText('Drawing number').type('MX43242'); cy.findByLabelText('Drawing link').type('https://example.com'); cy.findByLabelText('Model number').type('MXtest'); - + cy.findByLabelText('Manufacturer *').click().type('Man{downArrow}{enter}'); cy.findByLabelText('Resolution (megapixels) *').type('18'); cy.findByLabelText('Frame Rate (fps)').type('60'); cy.findByLabelText('Sensor Type *').type('IO'); @@ -27,10 +27,6 @@ describe('Catalogue Items', () => { cy.findByLabelText('Older than five years').click(); cy.findByText('False').click(); - cy.findByLabelText('Manufacturer Name *').type('test'); - cy.findByLabelText('Manufacturer URL *').type('https://test.co.uk'); - cy.findByLabelText('Manufacturer Address *').type('1 house test TX3 6TY'); - cy.startSnoopingBrowserMockedRequest(); cy.findByRole('button', { name: 'Save' }).click(); @@ -42,7 +38,7 @@ describe('Catalogue Items', () => { expect(patchRequests.length).equal(1); const request = patchRequests[0]; expect(JSON.stringify(request.body)).equal( - '{"catalogue_category_id":"4","name":"test","cost_gbp":5000,"cost_to_rework_gbp":400,"days_to_replace":14,"days_to_rework":5,"description":"test Description","item_model_number":"MXtest","is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":"https://example.com","drawing_number":"MX43242","properties":[{"name":"Resolution","value":18},{"name":"Frame Rate","value":60},{"name":"Sensor Type","value":"IO"},{"name":"Sensor brand","value":"pixel"},{"name":"Broken","value":true},{"name":"Older than five years","value":false}],"manufacturer":{"name":"test","address":"1 house test TX3 6TY","url":"https://test.co.uk"}}' + '{"catalogue_category_id":"4","name":"test","cost_gbp":5000,"cost_to_rework_gbp":400,"days_to_replace":14,"days_to_rework":5,"description":"test Description","item_model_number":"MXtest","is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":"https://example.com","drawing_number":"MX43242","manufacturer_id":"1","properties":[{"name":"Resolution","value":18},{"name":"Frame Rate","value":60},{"name":"Sensor Type","value":"IO"},{"name":"Sensor brand","value":"pixel"},{"name":"Broken","value":true},{"name":"Older than five years","value":false}]}' ); }); }); @@ -64,7 +60,7 @@ describe('Catalogue Items', () => { expect(patchRequests.length).equal(1); const request = patchRequests[0]; expect(JSON.stringify(request.body)).equal( - '{"catalogue_category_id":"5","name":"Energy Meters 27_copy1","cost_gbp":600,"cost_to_rework_gbp":89,"days_to_replace":7,"days_to_rework":60,"description":"Precision energy meters for accurate measurements. 27","item_model_number":null,"is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":null,"drawing_number":null,"properties":[{"name":"Measurement Range","value":2000}],"manufacturer":{"name":"Manufacturer A","url":"http://example.com","address":"10 My Street"}}' + '{"catalogue_category_id":"5","name":"Energy Meters 27_copy1","cost_gbp":600,"cost_to_rework_gbp":89,"days_to_replace":7,"days_to_rework":60,"description":"Precision energy meters for accurate measurements. 27","item_model_number":null,"is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":null,"drawing_number":null,"manufacturer_id":"3","properties":[{"name":"Measurement Range","value":2000}]}' ); }); }); @@ -81,9 +77,7 @@ describe('Catalogue Items', () => { cy.findByLabelText('Cost (£) *').type('5000'); cy.findByLabelText('Time to replace (days) *').type('14'); - cy.findByLabelText('Manufacturer Name *').type('test'); - cy.findByLabelText('Manufacturer URL *').type('https://test.co.uk'); - cy.findByLabelText('Manufacturer Address *').type('1 house test TX3 6TY'); + cy.findByLabelText('Manufacturer *').click().type('Man{downArrow}{enter}'); cy.startSnoopingBrowserMockedRequest(); @@ -96,7 +90,7 @@ describe('Catalogue Items', () => { expect(patchRequests.length).equal(1); const request = patchRequests[0]; expect(JSON.stringify(request.body)).equal( - '{"catalogue_category_id":"4","name":"test","cost_gbp":5000,"cost_to_rework_gbp":null,"days_to_replace":14,"days_to_rework":null,"description":null,"item_model_number":null,"is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":null,"drawing_number":null,"properties":[{"name":"Resolution","value":18},{"name":"Sensor Type","value":"IO"},{"name":"Broken","value":true}],"manufacturer":{"name":"test","address":"1 house test TX3 6TY","url":"https://test.co.uk"}}' + '{"catalogue_category_id":"4","name":"test","cost_gbp":5000,"cost_to_rework_gbp":null,"days_to_replace":14,"days_to_rework":null,"description":null,"item_model_number":null,"is_obsolete":false,"obsolete_reason":null,"obsolete_replacement_catalogue_item_id":null,"drawing_link":null,"drawing_number":null,"manufacturer_id":"1","properties":[{"name":"Resolution","value":18},{"name":"Sensor Type","value":"IO"},{"name":"Broken","value":true}]}' ); }); }); @@ -111,6 +105,9 @@ describe('Catalogue Items', () => { cy.findByText('Please enter how many days it would take to replace').should( 'exist' ); + cy.findByText( + 'Please choose a manufacturer, or add a new manufacturer' + ).should('exist'); cy.findByText('Please select either True or False').should('exist'); cy.findByLabelText('Name *').type('test'); @@ -120,6 +117,7 @@ describe('Catalogue Items', () => { cy.findByText('True').click(); cy.findByLabelText('Cost (£) *').type('5000'); cy.findByLabelText('Time to replace (days) *').type('14'); + cy.findByLabelText('Manufacturer *').click().type('Man{downArrow}{enter}'); cy.findAllByText('This field is mandatory').should('have.length', 0); cy.findByText('Please enter name').should('not.exist'); @@ -128,6 +126,9 @@ describe('Catalogue Items', () => { cy.findByText('Please enter how many days it would take to replace').should( 'not.exist' ); + cy.findByText( + 'Please chose a manufacturer, or add a new manufacturer' + ).should('not.exist'); // value error from number field @@ -154,41 +155,38 @@ describe('Catalogue Items', () => { cy.findByLabelText('Time to replace (days) *').type('14'); cy.findAllByText('Please enter a valid number').should('have.length', 0); - - cy.findByText('Please enter a Manufacturer Name').should('exist'); - cy.findByText('Please enter a Manufacturer URL').should('exist'); - cy.findByText('Please enter a Manufacturer Address').should('exist'); - - cy.findByLabelText('Manufacturer Name *').type('test'); - cy.findByLabelText('Manufacturer URL *').type('test.co.uk'); cy.findByLabelText('Drawing link').type('test.co.uk'); - cy.findByLabelText('Manufacturer Address *').type('1 house test TX3 6TY'); - - cy.findByText('Please enter a Manufacturer Name').should('not.exist'); - cy.findByText('Please enter a Manufacturer URL').should('not.exist'); - cy.findByText('Please enter a Manufacturer Address').should('not.exist'); cy.findByRole('button', { name: 'Save' }).click(); - cy.findAllByText( - 'Please enter a valid Manufacturer URL. Only "http://" and "https://" links with typical top-level domain are accepted' - ).should('exist'); cy.findAllByText( 'Please enter a valid Drawing link. Only "http://" and "https://" links with typical top-level domain are accepted' ).should('exist'); - cy.findByLabelText('Manufacturer URL *').clear(); + cy.findByLabelText('Drawing link').clear(); - cy.findByLabelText('Manufacturer URL *').type('https://test.co.uk'); + cy.findByLabelText('Drawing link').type('https://test.co.uk'); cy.findByRole('button', { name: 'Save' }).click(); - cy.findByText( - 'Please enter a valid Manufacturer URL. Only "http://" and "https://" links with typical top-level domain are accepted' - ).should('not.exist'); + cy.findAllByText( 'Please enter a valid Drawing link. Only "http://" and "https://" links with typical top-level domain are accepted' ).should('not.exist'); }); + it('opens add manufacturer dialog and closes it back to catalogue item dialog', () => { + cy.findByRole('button', { name: 'Add Catalogue Item' }).click(); + + cy.findByRole('button', { name: 'add manufacturer' }).click(); + + cy.findByText('Add Manufacturer').should('exist'); + + cy.findByRole('button', { name: 'Cancel' }).click(); + + cy.findByText('Add Manufacturer').should('not.exist'); + + cy.findByText('Details').should('exist'); + }); + it('displays the table view correctly', () => { cy.findByText('Cameras 1').should('exist'); cy.findByText('Cameras 2').should('exist'); @@ -243,9 +241,43 @@ describe('Catalogue Items', () => { cy.findByLabelText('Resolution (megapixels) *').should('have.value', '12'); cy.findByLabelText('Frame Rate (fps)').should('have.value', '30'); cy.findByLabelText('Sensor Type *').should('have.value', 'CMOS'); + cy.findByLabelText('Manufacturer *').should('have.value', 'Manufacturer A'); + cy.findByRole('button', { name: 'Cancel' }).click(); }); + it('navigates to manufacturer landing page', () => { + cy.visit('/catalogue/5'); + + cy.findByRole('button', { name: 'Show/Hide columns' }).click(); + cy.findByRole('button', { name: 'Hide all' }).click(); + cy.findByRole('checkbox', { + name: 'Toggle visibility Manufacturer Name', + }).click(); + cy.get('body').click(); + + cy.findByRole('link', { name: 'Manufacturer A' }).click(); + cy.url().should('contain', '/manufacturer/1'); + }); + + it('checks the href property of the manufacturer link', () => { + cy.findByRole('button', { name: 'Show/Hide columns' }).click(); + cy.findByText('Hide all').click(); + + cy.findByText('Manufacturer URL').click(); + + // Find the link element + cy.findAllByText('http://example.com') + .first() + .should('have.attr', 'href') + .should('include', 'http://example.com'); // Check href attribute value + + cy.findAllByText('http://example.com') + .first() + .should('have.attr', 'target') + .should('include', '_blank'); // Check target attribute value + }); + it('displays the expired landing page message and navigates back to the catalogue home', () => { cy.visit('/catalogue/items/1fds'); @@ -336,6 +368,9 @@ describe('Catalogue Items', () => { cy.findByLabelText('Drawing number').type('MX43242'); cy.findByLabelText('Drawing link').type('https://example.com'); cy.findByLabelText('Model number').type('MXtest'); + cy.findByLabelText('Manufacturer *') + .click() + .type('Man{downArrow}{downArrow}{enter}'); cy.startSnoopingBrowserMockedRequest(); cy.findByRole('button', { name: 'Save' }).click(); @@ -347,7 +382,7 @@ describe('Catalogue Items', () => { expect(patchRequests.length).equal(1); const request = patchRequests[0]; expect(JSON.stringify(request.body)).equal( - '{"name":"test","description":null,"cost_gbp":6000,"cost_to_rework_gbp":894,"days_to_replace":71,"days_to_rework":605,"drawing_number":"MX43242","drawing_link":"https://example.com","item_model_number":"MXtest"}' + '{"name":"test","description":null,"cost_gbp":6000,"cost_to_rework_gbp":894,"days_to_replace":71,"days_to_rework":605,"drawing_number":"MX43242","drawing_link":"https://example.com","item_model_number":"MXtest","manufacturer_id":"2"}' ); }); }); diff --git a/cypress/e2e/manufacturer/manufacturer.cy.ts b/cypress/e2e/manufacturer/manufacturer.cy.ts index 76472c1cc..8404b5365 100644 --- a/cypress/e2e/manufacturer/manufacturer.cy.ts +++ b/cypress/e2e/manufacturer/manufacturer.cy.ts @@ -299,6 +299,51 @@ describe('Manufacturer', () => { cy.contains('Please enter a post code or zip code.'); }); }); + + it('navigates to landing page and navigates back to the table view', () => { + cy.findByText('Manufacturer A').click(); + cy.findByText('Telephone number:').should('exist'); + + cy.findByRole('link', { name: 'Manufacturer table view' }).click(); + + cy.findByText('Manufacturer A').should('exist'); + cy.findByText('Manufacturer B').should('exist'); + cy.findByText('Manufacturer C').should('exist'); + }); + + it('navigates to landing page, opens edit dialog and closes it', () => { + cy.findByText('Manufacturer A').click(); + cy.findByText('Telephone number:').should('exist'); + + cy.findByRole('button', { name: 'Edit' }).click(); + cy.findByLabelText('Name *').should('have.value', 'Manufacturer A'); + cy.findByLabelText('URL').should('have.value', 'http://example.com'); + cy.findByLabelText('Address Line *').should( + 'have.value', + '1 Example Street' + ); + cy.findByLabelText('Town').should('have.value', 'Oxford'); + cy.findByLabelText('County').should('have.value', 'Oxfordshire'); + cy.findByLabelText('Country *').should('have.value', 'United Kingdom'); + cy.findByLabelText('Post/Zip code *').should('have.value', 'OX1 2AB'); + cy.findByLabelText('Telephone number').should('have.value', '07334893348'); + + cy.findByRole('button', { name: 'Cancel' }).click(); + }); + + it('displays expired landing page message and navigates back to manufacturer table view', () => { + cy.visit('/manufacturer/invalid'); + + cy.findByText( + `This manufacturer doesn't exist. Please click the Home button to navigate to the manufacturer table` + ).should('exist'); + + cy.findByRole('link', { name: 'Home' }).click(); + + cy.findByText('Manufacturer A').should('exist'); + cy.findByText('Manufacturer B').should('exist'); + cy.findByText('Manufacturer C').should('exist'); + }); it('sets the table filters and clears the table filters', () => { cy.findByText('Manufacturer A').should('exist'); cy.findByRole('button', { name: 'Clear Filters' }).should('be.disabled'); diff --git a/src/api/catalogueItem.test.tsx b/src/api/catalogueItem.test.tsx index eab2dcf10..4a7045261 100644 --- a/src/api/catalogueItem.test.tsx +++ b/src/api/catalogueItem.test.tsx @@ -98,11 +98,7 @@ describe('catalogue items api functions', () => { drawing_number: null, id: '1', is_obsolete: false, - manufacturer: { - address: '10 My Street', - name: 'Manufacturer A', - url: 'http://example.com', - }, + manufacturer_id: '1', item_model_number: null, name: 'Cameras 1', obsolete_reason: null, diff --git a/src/api/manufacturer.tsx b/src/api/manufacturer.tsx index 29c6c2136..56444b8d6 100644 --- a/src/api/manufacturer.tsx +++ b/src/api/manufacturer.tsx @@ -2,6 +2,7 @@ import axios, { AxiosError } from 'axios'; import { useMutation, UseMutationResult, + useQueries, useQuery, useQueryClient, UseQueryResult, @@ -133,6 +134,17 @@ export const useManufacturer = ( ); }; +export const useManufacturerIds = ( + ids: string[] +): UseQueryResult[] => { + return useQueries({ + queries: ids.map((id) => ({ + queryKey: ['Manufacturer', id], + queryFn: () => fetchManufacturer(id), + })), + }); +}; + const editManufacturer = async ( manufacturer: EditManufacturer ): Promise => { @@ -163,8 +175,11 @@ export const useEditManufacturer = (): UseMutationResult< onError: (error) => { console.log('Got error ' + error.message); }, - onSuccess: () => { + onSuccess: (manufacturerReturned) => { queryClient.invalidateQueries({ queryKey: ['Manufacturers'] }); + queryClient.invalidateQueries({ + queryKey: ['Manufacturer', manufacturerReturned.id], + }); }, } ); diff --git a/src/app.types.tsx b/src/app.types.tsx index 352f40480..3f1ab92b2 100644 --- a/src/app.types.tsx +++ b/src/app.types.tsx @@ -88,6 +88,7 @@ export interface CatalogueItemDetails extends ObsoleteDetails { drawing_number: string | null; drawing_link: string | null; item_model_number: string | null; + manufacturer_id: string; } // need so we can cast string to number e.g for 10.50 export type CatalogueItemDetailsPlaceholder = { @@ -104,12 +105,7 @@ export interface CatalogueDetailsErrorMessages { drawing_number: string; drawing_link: string; item_model_number: string; -} - -export interface CatalogueItemManufacturer { - name: string; - address: string; - url: string; + manufacturer_id: string; } export interface CatalogueItemProperty { @@ -125,12 +121,10 @@ export interface CatalogueItemPropertyResponse { export interface CatalogueItem extends CatalogueItemDetails { properties: CatalogueItemPropertyResponse[]; - manufacturer: CatalogueItemManufacturer; id: string; } export interface AddCatalogueItem extends CatalogueItemDetails { properties: CatalogueItemProperty[]; - manufacturer: CatalogueItemManufacturer; } export interface EditCatalogueItem extends Partial { diff --git a/src/catalogue/catalogue.component.test.tsx b/src/catalogue/catalogue.component.test.tsx index a8a14bc07..495bdb150 100644 --- a/src/catalogue/catalogue.component.test.tsx +++ b/src/catalogue/catalogue.component.test.tsx @@ -335,7 +335,7 @@ describe('Catalogue', () => { await waitFor(() => { expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); }); - }); + }, 10000); it('opens move catalogue category dialog and can closes the dialog', async () => { createView('/catalogue/1'); diff --git a/src/catalogue/items/CatalogueItemsDetailsPanel.component.tsx b/src/catalogue/items/CatalogueItemsDetailsPanel.component.tsx index 8198dbb16..a55e3f5a6 100644 --- a/src/catalogue/items/CatalogueItemsDetailsPanel.component.tsx +++ b/src/catalogue/items/CatalogueItemsDetailsPanel.component.tsx @@ -10,7 +10,11 @@ import { import ListItem from '@mui/material/ListItem'; import ListItemText from '@mui/material/ListItemText'; import { Link } from 'react-router-dom'; -import { CatalogueCategory, CatalogueItem } from '../../app.types'; +import { + CatalogueCategory, + CatalogueItem, + Manufacturer, +} from '../../app.types'; function TabPanel(props: any) { const { children, value, index, ...other } = props; @@ -35,10 +39,12 @@ function TabPanel(props: any) { export interface CatalogueItemsDetailsPanelProps { catalogueItemIdData: CatalogueItem; catalogueCategoryData: CatalogueCategory; + manufacturerData?: Manufacturer; } function CatalogueItemsDetailsPanel(props: CatalogueItemsDetailsPanelProps) { - const { catalogueItemIdData, catalogueCategoryData } = props; + const { catalogueItemIdData, catalogueCategoryData, manufacturerData } = + props; const [tabValue, setTabValue] = React.useState(0); const handleTabChange = (event: React.SyntheticEvent, newValue: number) => { @@ -75,168 +81,102 @@ function CatalogueItemsDetailsPanel(props: CatalogueItemsDetailsPanelProps) { - - - + + Obsolete + + {catalogueItemIdData.is_obsolete ? 'Yes' : 'No'} + + - - - Click here - - ) : ( - 'None' - ) - } - /> - + + + Obsolete replacement link + + + {catalogueItemIdData.obsolete_replacement_catalogue_item_id ? ( + + Click here + + ) : ( + 'None' + )} + + - - - + + Obsolete Reason + + {catalogueItemIdData.obsolete_reason ?? 'None'} + + - - - + + Cost (£) + + {catalogueItemIdData.cost_gbp ?? 'None'} + + - - - + + + Cost to rework (£) + + + {catalogueItemIdData.cost_to_rework_gbp ?? 'None'} + + - - - + + + Time to replace (days) + + + {catalogueItemIdData.days_to_replace ?? 'None'} + + - - - + + + Time to rework (days) + + + {catalogueItemIdData.days_to_rework ?? 'None'} + + - - - + + Drawing Number + + {catalogueItemIdData.drawing_number ?? 'None'} + + - - - + + Model Number + + {catalogueItemIdData.item_model_number ?? 'None'} + + @@ -274,61 +214,62 @@ function CatalogueItemsDetailsPanel(props: CatalogueItemsDetailsPanelProps) { - - - - + + Manufacturer Name + + {manufacturerData?.name} + - - - - {catalogueItemIdData.manufacturer.url} - - } - /> - + + Manufacturer URL + + {manufacturerData?.url ? ( + + {manufacturerData.url} + + ) : ( + 'None' + )} + - - - - + + + Manufacturer Address Line + + + {manufacturerData?.address.address_line} + + + + Manufacturer Town + + {manufacturerData?.address.town ?? 'None'} + + + + Manufacturer County + + {manufacturerData?.address.county ?? 'None'} + + + + Manufacturer Country + + {manufacturerData?.address.country} + + + + + Manufacturer Post/Zip code + + + {manufacturerData?.address.postcode} + diff --git a/src/catalogue/items/__snapshots__/CatalogueItemsDetailsPanel.component.test.tsx.snap b/src/catalogue/items/__snapshots__/CatalogueItemsDetailsPanel.component.test.tsx.snap index 11a6b49d4..8c3ddd185 100644 --- a/src/catalogue/items/__snapshots__/CatalogueItemsDetailsPanel.component.test.tsx.snap +++ b/src/catalogue/items/__snapshots__/CatalogueItemsDetailsPanel.component.test.tsx.snap @@ -112,215 +112,170 @@ exports[`Catalogue Items details panel renders details panel correctly (with obs
-
  • -
    - - Obsolete - -

    - No -

    -
    -
    • + Obsolete +

    +

    + No +

    +
    -
  • -
    - - Obsolete replacement link - -

    +

    + - - Click here - -

    -
    -
    • + Click here + +

    +
    -
  • -
    - - Obsolete reason - -

    - None -

    -
    -
    • + Obsolete Reason +

    +

    + None +

    +
    -
  • -
    - - Cost (£) - -

    - 1100 -

    -
    -
    • + Cost (£) +

    +

    + 1100 +

    +
    -
  • -
    - - Cost to rework (£) - -

    - None -

    -
    -
    • + Cost to rework (£) +

    +

    + None +

    +
    -
  • -
    - - Time to replace (days) - -

    - 90 -

    -
    -
    • + Time to replace (days) +

    +

    + 90 +

    +
    -
  • -
    - - Time to rework (days) - -

    - None -

    -
    -
    • + Time to rework (days) +

    +

    + None +

    +
    -
  • -
    - - Drawing Number - -

    - None -

    -
    -
    • + Drawing Number +

    +

    + None +

    +
    -
  • -
    - - Model Number - -

    - None -

    -
    -
    • + Model Number +

    +

    + None +

    +
    @@ -426,79 +381,94 @@ exports[`Catalogue Items details panel renders details panel correctly (with obs class="MuiGrid-root MuiGrid-container MuiGrid-item css-1f064cs-MuiGrid-root" >
    -
  • -
    - - Manufacturer Name - -

    - Manufacturer A -

    -
    -
    • + Manufacturer Name +

    +

    -
  • -
    - - Manufacturer URL - -

    - - http://example.com - -

    -
    -
    • + Manufacturer URL +

    +

    + None +

    -
  • -
    - - Manufacturer Address - -

    - 10 My Street -

    -
    -
    • + Manufacturer Address Line +

    +

    +

    +
    +

    + Manufacturer Town +

    +

    + None +

    +
    +
    +

    + Manufacturer County +

    +

    + None +

    +
    +
    +

    + Manufacturer Country +

    +

    +

    +
    +

    + Manufacturer Post/Zip code +

    +

    @@ -623,215 +593,170 @@ exports[`Catalogue Items details panel renders details panel correctly 1`] = `
    -
  • -
    - - Obsolete - -

    - Yes -

    -
    -
    • + Obsolete +

    +

    + Yes +

    +
    -
  • -
    - - Obsolete replacement link - -

    +

    + - - Click here - -

    -
    -
    • + Click here + +

    +
    -
  • -
    - - Obsolete reason - -

    - The item is no longer being manufactured -

    -
    -
    • + Obsolete Reason +

    +

    + The item is no longer being manufactured +

    +
    -
  • -
    - - Cost (£) - -

    - 500 -

    -
    -
    • + Cost (£) +

    +

    + 500 +

    +
    -
  • -
    - - Cost to rework (£) - -

    - None -

    -
    -
    • + Cost to rework (£) +

    +

    + None +

    +
    -
  • -
    - - Time to replace (days) - -

    - 7 -

    -
    -
    • + Time to replace (days) +

    +

    + 7 +

    +
    -
  • -
    - - Time to rework (days) - -

    - None -

    -
    -
    • + Time to rework (days) +

    +

    + None +

    +
    -
  • -
    - - Drawing Number - -

    - None -

    -
    -
    • + Drawing Number +

    +

    + None +

    +
    -
  • -
    - - Model Number - -

    - None -

    -
    -
    • + Model Number +

    +

    + None +

    +
    @@ -937,79 +862,94 @@ exports[`Catalogue Items details panel renders details panel correctly 1`] = ` class="MuiGrid-root MuiGrid-container MuiGrid-item css-1f064cs-MuiGrid-root" >
    -
  • -
    - - Manufacturer Name - -

    - Manufacturer A -

    -
    -
    • + Manufacturer Name +

    +

    -
  • -
    - - Manufacturer URL - -

    - - http://example.com - -

    -
    -
    • + Manufacturer URL +

    +

    + None +

    -
  • -
    - - Manufacturer Address - -

    - 10 My Street -

    -
    -
    • + Manufacturer Address Line +

    +

    +

    +
    +

    + Manufacturer Town +

    +

    + None +

    +
    +
    +

    + Manufacturer County +

    +

    + None +

    +
    +
    +

    + Manufacturer Country +

    +

    +

    +
    +

    + Manufacturer Post/Zip code +

    +

    @@ -1144,215 +1084,170 @@ exports[`Catalogue Items details panel renders manufacturer panel correctly 1`]
    -
  • -
    - - Obsolete - -

    - Yes -

    -
    -
    • + Obsolete +

    +

    + Yes +

    +
    -
  • -
    - - Obsolete replacement link - -

    +

    + - - Click here - -

    -
    -
    • + Click here + +

    +
    -
  • -
    - - Obsolete reason - -

    - The item is no longer being manufactured -

    -
    -
    • + Obsolete Reason +

    +

    + The item is no longer being manufactured +

    +
    -
  • -
    - - Cost (£) - -

    - 500 -

    -
    -
    • + Cost (£) +

    +

    + 500 +

    +
    -
  • -
    - - Cost to rework (£) - -

    - None -

    -
    -
    • + Cost to rework (£) +

    +

    + None +

    +
    -
  • -
    - - Time to replace (days) - -

    - 7 -

    -
    -
    • + Time to replace (days) +

    +

    + 7 +

    +
    -
  • -
    - - Time to rework (days) - -

    - None -

    -
    -
    • + Time to rework (days) +

    +

    + None +

    +
    -
  • -
    - - Drawing Number - -

    - None -

    -
    -
    • + Drawing Number +

    +

    + None +

    +
    -
  • -
    - - Model Number - -

    - None -

    -
    -
    • + Model Number +

    +

    + None +

    +
    @@ -1457,79 +1352,94 @@ exports[`Catalogue Items details panel renders manufacturer panel correctly 1`] class="MuiGrid-root MuiGrid-container MuiGrid-item css-1f064cs-MuiGrid-root" >
    -
  • -
    - - Manufacturer Name - -

    - Manufacturer A -

    -
    -
    • + Manufacturer Name +

    +

    -
  • -
    - - Manufacturer URL - -

    - - http://example.com - -

    -
    -
    • + Manufacturer URL +

    +

    + None +

    -
  • -
    - - Manufacturer Address - -

    - 10 My Street -

    -
    -
    • + Manufacturer Address Line +

    +

    +

    +
    +

    + Manufacturer Town +

    +

    + None +

    +
    +
    +

    + Manufacturer County +

    +

    + None +

    +
    +
    +

    + Manufacturer Country +

    +

    +

    +
    +

    + Manufacturer Post/Zip code +

    +

    @@ -1664,215 +1574,170 @@ exports[`Catalogue Items details panel renders properties panel correctly 1`] =
    -
  • -
    - - Obsolete - -

    - Yes -

    -
    -
    • + Obsolete +

    +

    + Yes +

    +
    -
  • -
    - - Obsolete replacement link - -

    +

    + - - Click here - -

    -
    -
    • + Click here + +

    +
    -
  • -
    - - Obsolete reason - -

    - The item is no longer being manufactured -

    -
    -
    • + Obsolete Reason +

    +

    + The item is no longer being manufactured +

    +
    -
  • -
    - - Cost (£) - -

    - 500 -

    -
    -
    • + Cost (£) +

    +

    + 500 +

    +
    -
  • -
    - - Cost to rework (£) - -

    - None -

    -
    -
    • + Cost to rework (£) +

    +

    + None +

    +
    -
  • -
    - - Time to replace (days) - -

    - 7 -

    -
    -
    • + Time to replace (days) +

    +

    + 7 +

    +
    -
  • -
    - - Time to rework (days) - -

    - None -

    -
    -
    • + Time to rework (days) +

    +

    + None +

    +
    -
  • -
    - - Drawing Number - -

    - None -

    -
    -
    • + Drawing Number +

    +

    + None +

    +
    -
  • -
    - - Model Number - -

    - None -

    -
    -
    • + Model Number +

    +

    + None +

    +
    @@ -1977,79 +1842,94 @@ exports[`Catalogue Items details panel renders properties panel correctly 1`] = class="MuiGrid-root MuiGrid-container MuiGrid-item css-1f064cs-MuiGrid-root" >
    -
  • -
    - - Manufacturer Name - -

    - Manufacturer A -

    -
    -
    • + Manufacturer Name +

    +

    -
  • -
    - - Manufacturer URL - -

    - - http://example.com - -

    -
    -
    • + Manufacturer URL +

    +

    + None +

    -
  • -
    - - Manufacturer Address - -

    - 10 My Street -

    -
    -
    • + Manufacturer Address Line +

    +

    +

    +
    +

    + Manufacturer Town +

    +

    + None +

    +
    +
    +

    + Manufacturer County +

    +

    + None +

    +
    +
    +

    + Manufacturer Country +

    +

    +

    +
    +

    + Manufacturer Post/Zip code +

    +

    diff --git a/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap b/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap index 455479562..b0482817f 100644 --- a/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap +++ b/src/catalogue/items/__snapshots__/catalogueItemsDialog.component.test.tsx.snap @@ -447,158 +447,117 @@ exports[`Catalogue Items Dialog renders text correctly 1`] = `
    -
    - Manufacturer -
    -
    -
    -
    - - -
    -
    -
    -
    -
    - -
    - - + +
    + +
    + +
    +
    - -
    - -
    - + + - -
    +
    diff --git a/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap b/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap index b0dfd8919..4cb2f1896 100644 --- a/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap +++ b/src/catalogue/items/__snapshots__/catalogueItemsTable.component.test.tsx.snap @@ -199,7 +199,7 @@ exports[`Catalogue Items Table renders the dense table correctly 1`] = ` aria-label="Filter by Name" autocomplete="new-password" class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd css-929hxt-MuiInputBase-input-MuiInput-input" - id=":rv8:" + id=":r14f:" placeholder="Filter by Name" title="Filter by Name" type="text" @@ -790,7 +790,7 @@ exports[`Catalogue Items Table renders the dense table correctly 1`] = ` class="MuiInputBase-root MuiInput-root MuiInputBase-colorPrimary css-1mmm5cp-MuiInputBase-root-MuiInput-root-MuiSelect-root" > ); } - export default ManufacturerComponent; diff --git a/src/manufacturer/manufacturerDialog.component.tsx b/src/manufacturer/manufacturerDialog.component.tsx index d4d1fdecd..7fde647bb 100644 --- a/src/manufacturer/manufacturerDialog.component.tsx +++ b/src/manufacturer/manufacturerDialog.component.tsx @@ -63,7 +63,7 @@ function ManufacturerDialog(props: ManufacturerDialogProps) { React.useEffect(() => { if (selectedManufacturer) setManufacturerDetails(selectedManufacturer); - }, [selectedManufacturer]); + }, [selectedManufacturer, open]); const [nameErrorMessage, setNameErrorMessage] = React.useState< string | undefined @@ -344,7 +344,7 @@ function ManufacturerDialog(props: ManufacturerDialogProps) { ]); return ( - + {`${ !selectedManufacturer ? 'Add' : 'Edit' } Manufacturer`} diff --git a/src/manufacturer/manufacturerLandingPage.component.test.tsx b/src/manufacturer/manufacturerLandingPage.component.test.tsx new file mode 100644 index 000000000..61c11e9fe --- /dev/null +++ b/src/manufacturer/manufacturerLandingPage.component.test.tsx @@ -0,0 +1,81 @@ +import React from 'react'; +import { renderComponentWithMemoryRouter } from '../setupTests'; +import { screen, waitFor } from '@testing-library/react'; +import ManufacturerLandingPage from './manufacturerLandingPage.component'; +import userEvent from '@testing-library/user-event'; + +describe('Manufacturer Landing page', () => { + let user; + const createView = (path: string) => { + return renderComponentWithMemoryRouter(, path); + }; + beforeEach(() => { + user = userEvent.setup(); + }); + + it('landing page renders data correctly', async () => { + createView('/manufacturer/1'); + + await waitFor(() => { + expect(screen.getByText('Manufacturer A')).toBeInTheDocument(); + }); + + await waitFor(() => { + expect( + screen.getByRole('link', { name: 'Manufacturer table view' }) + ).toBeInTheDocument(); + }); + expect(screen.getByText('URL:')).toBeInTheDocument(); + expect(screen.getByText('http://example.com')).toBeInTheDocument(); + expect(screen.getByText('Telephone number:')).toBeInTheDocument(); + expect(screen.getByText('07334893348')).toBeInTheDocument(); + expect(screen.getByText('Address:')).toBeInTheDocument(); + }); + + it('shows no manufacturer page correctly', async () => { + createView('/manufacturer/invalid'); + + await waitFor(() => { + expect( + screen.getByText( + `This manufacturer doesn't exist. Please click the Home button to navigate to the manufacturer table` + ) + ).toBeInTheDocument(); + }); + const editButton = screen.getByRole('button', { name: 'Edit' }); + expect(editButton).toBeDisabled(); + const homeButton = screen.getByRole('link', { name: 'Home' }); + expect(homeButton).toBeInTheDocument(); + }); + + it('shows the loading indicator', async () => { + createView('/manufacturer/1'); + + await waitFor(() => { + expect(screen.getByRole('progressbar')).toBeInTheDocument(); + }); + }); + + it('opens and closes the edit manufacturer dialog', async () => { + createView('/manufacturer/1'); + + await waitFor(() => { + expect(screen.getByText('Manufacturer A')).toBeInTheDocument(); + }); + + const editButton = screen.getByRole('button', { + name: 'Edit', + }); + await user.click(editButton); + + await waitFor(() => { + expect(screen.getByRole('dialog')).toBeInTheDocument(); + }); + + const cancelButton = screen.getByRole('button', { name: 'Cancel' }); + await user.click(cancelButton); + await waitFor(() => { + expect(screen.queryByRole('dialog')).not.toBeInTheDocument(); + }); + }); +}); diff --git a/src/manufacturer/manufacturerLandingPage.component.tsx b/src/manufacturer/manufacturerLandingPage.component.tsx new file mode 100644 index 000000000..e468f1e25 --- /dev/null +++ b/src/manufacturer/manufacturerLandingPage.component.tsx @@ -0,0 +1,143 @@ +import { + Box, + Button, + Grid, + Typography, + Link as MuiLink, + LinearProgress, +} from '@mui/material'; +import { Link, useLocation } from 'react-router-dom'; +import { useManufacturer } from '../api/manufacturer'; + +import ManufacturerDialog from './manufacturerDialog.component'; +import React from 'react'; + +function ManufacturerLandingPage() { + const location = useLocation(); + + const manufacturerId = location.pathname.replace('/manufacturer/', ''); + + const { data: manufacturerData, isLoading: manufacturerDataLoading } = + useManufacturer(manufacturerId); + + const [editManufacturerDialogOpen, setEditManufacturerDialogOpen] = + React.useState(false); + + return ( + + + + + + {manufacturerData && ( + + + + + {manufacturerData.name} + + + + + + URL: + + + + {manufacturerData.url && ( + + + {manufacturerData.url} + + + )} + + + Telephone number: + + + + {manufacturerData.telephone} + + + + Address: + + + + {manufacturerData.address.address_line} + + + {manufacturerData.address.town} + + + {manufacturerData.address.county} + + + {manufacturerData.address.postcode} + + + {manufacturerData.address.country} + + + + + + )} + {!manufacturerDataLoading ? ( + !manufacturerData && ( + + No result found + + This manufacturer doesn't exist. Please click the Home button to + navigate to the manufacturer table + + + ) + ) : ( + + + + )} + + setEditManufacturerDialogOpen(false)} + selectedManufacturer={manufacturerData} + /> + + ); +} + +export default ManufacturerLandingPage; diff --git a/src/mocks/CatalogueItems.json b/src/mocks/CatalogueItems.json index 161ab05e2..19b9615cc 100644 --- a/src/mocks/CatalogueItems.json +++ b/src/mocks/CatalogueItems.json @@ -31,11 +31,7 @@ } ], "id": "1", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 500, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -84,11 +80,7 @@ } ], "id": "2", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 600, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -137,11 +129,7 @@ } ], "id": "3", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 700, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -190,11 +178,7 @@ } ], "id": "90", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 800, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -243,11 +227,7 @@ } ], "id": "24", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 900, "cost_to_rework_gbp": 0, "days_to_replace": 7, @@ -296,11 +276,7 @@ } ], "id": "25", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 1000, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -349,11 +325,7 @@ } ], "id": "26", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1100, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -402,11 +374,7 @@ } ], "id": "27", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 1200, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -455,11 +423,7 @@ } ], "id": "28", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1300, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -508,11 +472,7 @@ } ], "id": "29", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 1400, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -561,11 +521,7 @@ } ], "id": "30", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 1500, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -614,11 +570,7 @@ } ], "id": "31", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1600, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -667,11 +619,7 @@ } ], "id": "32", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 1700, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -720,11 +668,7 @@ } ], "id": "33", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 1800, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -773,11 +717,7 @@ } ], "id": "34", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1900, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -826,11 +766,7 @@ } ], "id": "35", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 2000, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -879,11 +815,7 @@ } ], "id": "36", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 2100, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -932,11 +864,7 @@ } ], "id": "37", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 2200, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -985,11 +913,7 @@ } ], "id": "38", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 2300, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1038,11 +962,7 @@ } ], "id": "39", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 2400, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1091,11 +1011,7 @@ } ], "id": "40", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 2500, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1144,11 +1060,7 @@ } ], "id": "41", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 2600, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1197,11 +1109,7 @@ } ], "id": "42", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 2700, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1250,11 +1158,7 @@ } ], "id": "43", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 2800, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1303,11 +1207,7 @@ } ], "id": "44", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 2900, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1336,11 +1236,7 @@ } ], "id": "89", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 500, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1364,11 +1260,7 @@ } ], "id": "6", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 600, "cost_to_rework_gbp": 89, "days_to_replace": 7, @@ -1397,11 +1289,7 @@ } ], "id": "7", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 700, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1430,11 +1318,7 @@ } ], "id": "8", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 800, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1463,11 +1347,7 @@ } ], "id": "9", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 900, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1496,11 +1376,7 @@ } ], "id": "10", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 1000, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1529,11 +1405,7 @@ } ], "id": "11", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1100, "cost_to_rework_gbp": null, "days_to_replace": 90, @@ -1562,11 +1434,7 @@ } ], "id": "12", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 1200, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1595,11 +1463,7 @@ } ], "id": "13", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 1300, "cost_to_rework_gbp": null, "days_to_replace": 7, @@ -1628,11 +1492,7 @@ } ], "id": "14", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 200, "cost_to_rework_gbp": 50, "days_to_replace": 3, @@ -1661,11 +1521,7 @@ } ], "id": "15", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 150, "cost_to_rework_gbp": 40, "days_to_replace": 4, @@ -1694,11 +1550,7 @@ } ], "id": "16", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 180, "cost_to_rework_gbp": 45, "days_to_replace": 2, @@ -1727,11 +1579,7 @@ } ], "id": "17", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 220, "cost_to_rework_gbp": 55, "days_to_replace": 1, @@ -1760,11 +1608,7 @@ } ], "id": "18", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 240, "cost_to_rework_gbp": 60, "days_to_replace": 3, @@ -1793,11 +1637,7 @@ } ], "id": "19", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 260, "cost_to_rework_gbp": 65, "days_to_replace": 2, @@ -1826,11 +1666,7 @@ } ], "id": "20", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 220, "cost_to_rework_gbp": 55, "days_to_replace": 1, @@ -1859,11 +1695,7 @@ } ], "id": "21", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 250, "cost_to_rework_gbp": 60, "days_to_replace": 2, @@ -1892,11 +1724,7 @@ } ], "id": "22", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "2", "cost_gbp": 270, "cost_to_rework_gbp": 70, "days_to_replace": 3, @@ -1925,11 +1753,7 @@ } ], "id": "23", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "1", "cost_gbp": 300, "cost_to_rework_gbp": 80, "days_to_replace": 4, @@ -1958,11 +1782,7 @@ } ], "id": "24", - "manufacturer": { - "name": "Manufacturer A", - "url": "http://example.com", - "address": "10 My Street" - }, + "manufacturer_id": "3", "cost_gbp": 320, "cost_to_rework_gbp": 90, "days_to_replace": 1, @@ -1974,4 +1794,4 @@ "obsolete_replacement_catalogue_item_id": null, "obsolete_reason": null } -] \ No newline at end of file +] diff --git a/src/view/viewTabs.component.tsx b/src/view/viewTabs.component.tsx index bbf6a23ec..c862bfcea 100644 --- a/src/view/viewTabs.component.tsx +++ b/src/view/viewTabs.component.tsx @@ -10,12 +10,14 @@ import Catalogue from '../catalogue/catalogue.component'; import Systems from '../systems/systems.component'; import Manufacturer from '../manufacturer/manufacturer.component'; import CatalogueItemsLandingPage from '../catalogue/items/catalogueItemsLandingPage.component'; +import ManufacturerLandingPage from '../manufacturer/manufacturerLandingPage.component'; export const paths = { home: '/', catalogue: '/catalogue/*', systems: '/systems/*', - manufacturer: '/manufacturer', + manufacturers: '/manufacturer', + manufacturer: '/manufacturer/:id', catalogueItems: '/catalogue/items/:id', }; @@ -96,7 +98,11 @@ function ViewTabs() { element={} > }> - }> + }> + } + > );