Skip to content

Commit

Permalink
Cleanup modals (#8432)
Browse files Browse the repository at this point in the history
* Cleanup modals

* Fix for playwright test

* Playwright test updates
  • Loading branch information
SchrodingersGat authored Nov 6, 2024
1 parent e46ae1a commit c062d5e
Show file tree
Hide file tree
Showing 7 changed files with 99 additions and 86 deletions.
55 changes: 29 additions & 26 deletions src/frontend/src/components/modals/AboutInvenTreeModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { apiUrl, useServerApiState } from '../../states/ApiState';
import { useLocalState } from '../../states/LocalState';
import { useUserState } from '../../states/UserState';
import { CopyButton } from '../buttons/CopyButton';
import { StylishText } from '../items/StylishText';

type AboutLookupRef = {
ref: string;
Expand Down Expand Up @@ -56,9 +57,9 @@ export function AboutInvenTreeModal({
alwaysLink: boolean = false
) {
return lookup.map((map: AboutLookupRef, idx) => (
<tr key={idx}>
<td>{map.title}</td>
<td>
<Table.Tr key={idx}>
<Table.Td>{map.title}</Table.Td>
<Table.Td>
<Group justify="space-between" gap="xs">
{alwaysLink ? (
<Anchor href={data[map.ref]} target="_blank">
Expand All @@ -73,8 +74,8 @@ export function AboutInvenTreeModal({
)}
{map.copy && <CopyButton value={data[map.ref]} />}
</Group>
</td>
</tr>
</Table.Td>
</Table.Tr>
));
}
/* renderer */
Expand All @@ -95,13 +96,10 @@ export function AboutInvenTreeModal({
return (
<Stack>
<Divider />
<Title order={5}>
<Trans>Version Information</Trans>
</Title>
<Group>
<Text>
<Trans>Your InvenTree version status is</Trans>
</Text>
<Group justify="space-between" wrap="nowrap">
<StylishText size="lg">
<Trans>Version Information</Trans>
</StylishText>
{data.dev ? (
<Badge color="blue">
<Trans>Development Version</Trans>
Expand All @@ -116,8 +114,8 @@ export function AboutInvenTreeModal({
</Badge>
)}
</Group>
<Table>
<tbody>
<Table striped>
<Table.Tbody>
{fillTable(
[
{
Expand All @@ -144,9 +142,14 @@ export function AboutInvenTreeModal({
{
ref: 'api',
title: <Trans>API Version</Trans>,
link: `${host}api-doc/`
link: `${host}api-doc/`,
copy: true
},
{
ref: 'python',
title: <Trans>Python Version</Trans>,
copy: true
},
{ ref: 'python', title: <Trans>Python Version</Trans> },
{
ref: 'django',
title: <Trans>Django Version</Trans>,
Expand All @@ -156,37 +159,37 @@ export function AboutInvenTreeModal({
],
data.version
)}
</tbody>
</Table.Tbody>
</Table>
<Title order={5}>
<Divider />
<StylishText size="lg">
<Trans>Links</Trans>
</Title>
<Table>
<tbody>
</StylishText>
<Table striped>
<Table.Tbody>
{fillTable(
[
{ ref: 'doc', title: <Trans>InvenTree Documentation</Trans> },
{ ref: 'code', title: <Trans>View Code on GitHub</Trans> },
{ ref: 'doc', title: <Trans>Documentation</Trans> },
{ ref: 'code', title: <Trans>Source Code</Trans> },
{ ref: 'credit', title: <Trans>Credits</Trans> },
{ ref: 'app', title: <Trans>Mobile App</Trans> },
{ ref: 'bug', title: <Trans>Submit Bug Report</Trans> }
],
data.links,
true
)}
</tbody>
</Table.Tbody>
</Table>
<Divider />
<Group justify="space-between">
<CopyButton value={copyval} label={t`Copy version information`} />
<Space />
<Button
color="red"
onClick={() => {
context.closeModal(id);
}}
>
<Trans>Dismiss</Trans>
<Trans>Close</Trans>
</Button>
</Group>
</Stack>
Expand Down
24 changes: 20 additions & 4 deletions src/frontend/src/components/modals/LicenseModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
Text
} from '@mantine/core';
import { useQuery } from '@tanstack/react-query';
import { useEffect, useMemo, useState } from 'react';

import { api } from '../../App';
import { ApiEndpoints } from '../../enums/ApiEndpoints';
Expand Down Expand Up @@ -53,14 +54,25 @@ export function LicenceView(entries: any[]) {
export function LicenseModal() {
const { data, isFetching, isError } = useQuery({
queryKey: ['license'],
refetchOnMount: true,
queryFn: () =>
api
.get(apiUrl(ApiEndpoints.license))
.then((res) => res.data ?? {})
.catch(() => {})
});

const rspdata = !data ? [] : Object.keys(data ?? {});
const packageKeys = useMemo(() => {
return !!data ? Object.keys(data ?? {}) : [];
}, [data]);

const [selectedKey, setSelectedKey] = useState<string | null>('');

useEffect(() => {
if (packageKeys.length > 0) {
setSelectedKey(packageKeys[0]);
}
}, [packageKeys]);

return (
<Stack gap="xs">
Expand All @@ -78,16 +90,20 @@ export function LicenseModal() {
</Text>
</Alert>
) : (
<Tabs defaultValue={rspdata[0] ?? ''}>
<Tabs
defaultValue={packageKeys[0] ?? ''}
value={selectedKey}
onChange={setSelectedKey}
>
<Tabs.List>
{rspdata.map((key) => (
{packageKeys.map((key) => (
<Tabs.Tab key={key} value={key}>
<Trans>{key} Packages</Trans>
</Tabs.Tab>
))}
</Tabs.List>

{rspdata.map((key) => (
{packageKeys.map((key) => (
<Tabs.Panel key={key} value={key}>
{LicenceView(data[key] ?? [])}
</Tabs.Panel>
Expand Down
41 changes: 17 additions & 24 deletions src/frontend/src/components/modals/ServerInfoModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { ContextModalProps } from '@mantine/modals';

import { useServerApiState } from '../../states/ApiState';
import { OnlyStaff } from '../items/OnlyStaff';
import { StylishText } from '../items/StylishText';

export function ServerInfoModal({
context,
Expand All @@ -22,17 +23,29 @@ export function ServerInfoModal({
return (
<Stack>
<Divider />
<Title order={5}>
<StylishText size="lg">
<Trans>Server</Trans>
</Title>
<Table>
</StylishText>
<Table striped>
<Table.Tbody>
<Table.Tr>
<Table.Td>
<Trans>Instance Name</Trans>
</Table.Td>
<Table.Td>{server.instance}</Table.Td>
</Table.Tr>
<Table.Tr>
<Table.Td>
<Trans>Server Version</Trans>
</Table.Td>
<Table.Td>{server.version}</Table.Td>
</Table.Tr>
<Table.Tr>
<Table.Td>
<Trans>API Version</Trans>
</Table.Td>
<Table.Td>{server.apiVersion}</Table.Td>
</Table.Tr>
<Table.Tr>
<Table.Td>
<Trans>Database</Trans>
Expand Down Expand Up @@ -117,34 +130,14 @@ export function ServerInfoModal({
)}
</Table.Tbody>
</Table>
<Title order={5}>
<Trans>Version</Trans>
</Title>
<Table>
<Table.Tbody>
<Table.Tr>
<Table.Td>
<Trans>Server Version</Trans>
</Table.Td>
<Table.Td>{server.version}</Table.Td>
</Table.Tr>
<Table.Tr>
<Table.Td>
<Trans>API Version</Trans>
</Table.Td>
<Table.Td>{server.apiVersion}</Table.Td>
</Table.Tr>
</Table.Tbody>
</Table>
<Divider />
<Group justify="right">
<Button
color="red"
onClick={() => {
context.closeModal(id);
}}
>
<Trans>Dismiss</Trans>
<Trans>Close</Trans>
</Button>
</Group>
</Stack>
Expand Down
2 changes: 1 addition & 1 deletion src/frontend/tests/modals.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ test('Modals as admin', async ({ page }) => {
})
.click();
await page.getByRole('cell', { name: 'Instance Name' }).waitFor();
await page.getByRole('button', { name: 'Dismiss' }).click();
await page.getByRole('button', { name: 'Close' }).click();

await page.waitForURL('**/platform/home');

Expand Down
37 changes: 29 additions & 8 deletions src/frontend/tests/pages/pui_scan.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,28 @@ async function defaultScanTest(page, search_text) {
await page.getByRole('button', { name: 'Lookup part' }).click();
}

test('Pages - Index - Scan (Part)', async ({ page }) => {
test('Scanning', async ({ page }) => {
await doQuickLogin(page);

await page.getByLabel('navigation-menu').click();
await page.getByRole('button', { name: 'System Information' }).click();
await page.locator('button').filter({ hasText: 'Close' }).click();

await page.getByLabel('navigation-menu').click();
await page.getByRole('button', { name: 'Scan Barcode' }).click();

await page.getByPlaceholder('Select input method').click();
await page.getByRole('option', { name: 'Manual input' }).click();
await page.getByPlaceholder('Enter item serial or data').click();
await page.getByPlaceholder('Enter item serial or data').fill('123');
await page.getByPlaceholder('Enter item serial or data').press('Enter');
await page.getByRole('cell', { name: 'manually' }).click();
await page.getByRole('button', { name: 'Lookup part' }).click();
await page.getByPlaceholder('Select input method').click();
await page.getByRole('option', { name: 'Manual input' }).click();
});

test('Scanning (Part)', async ({ page }) => {
await defaultScanTest(page, '{"part": 1}');

// part: 1
Expand All @@ -33,7 +54,7 @@ test('Pages - Index - Scan (Part)', async ({ page }) => {
await page.getByRole('cell', { name: 'part' }).waitFor();
});

test('Pages - Index - Scan (Stockitem)', async ({ page }) => {
test('Scanning (Stockitem)', async ({ page }) => {
await defaultScanTest(page, '{"stockitem": 408}');

// stockitem: 408
Expand All @@ -42,7 +63,7 @@ test('Pages - Index - Scan (Stockitem)', async ({ page }) => {
await page.getByRole('cell', { name: 'Quantity: 100' }).waitFor();
});

test('Pages - Index - Scan (StockLocation)', async ({ page }) => {
test('Scanning (StockLocation)', async ({ page }) => {
await defaultScanTest(page, '{"stocklocation": 3}');

// stocklocation: 3
Expand All @@ -51,7 +72,7 @@ test('Pages - Index - Scan (StockLocation)', async ({ page }) => {
await page.getByRole('cell', { name: 'stocklocation' }).waitFor();
});

test('Pages - Index - Scan (SupplierPart)', async ({ page }) => {
test('Scanning (SupplierPart)', async ({ page }) => {
await defaultScanTest(page, '{"supplierpart": 204}');

// supplierpart: 204
Expand All @@ -60,7 +81,7 @@ test('Pages - Index - Scan (SupplierPart)', async ({ page }) => {
await page.getByRole('cell', { name: 'supplierpart' }).waitFor();
});

test('Pages - Index - Scan (PurchaseOrder)', async ({ page }) => {
test('Scanning (PurchaseOrder)', async ({ page }) => {
await defaultScanTest(page, '{"purchaseorder": 12}');

// purchaseorder: 12
Expand All @@ -69,7 +90,7 @@ test('Pages - Index - Scan (PurchaseOrder)', async ({ page }) => {
await page.getByRole('cell', { name: 'purchaseorder' }).waitFor();
});

test('Pages - Index - Scan (SalesOrder)', async ({ page }) => {
test('Scanning (SalesOrder)', async ({ page }) => {
await defaultScanTest(page, '{"salesorder": 6}');

// salesorder: 6
Expand All @@ -78,7 +99,7 @@ test('Pages - Index - Scan (SalesOrder)', async ({ page }) => {
await page.getByRole('cell', { name: 'salesorder' }).waitFor();
});

test('Pages - Index - Scan (Build)', async ({ page }) => {
test('Scanning (Build)', async ({ page }) => {
await defaultScanTest(page, '{"build": 8}');

// build: 8
Expand All @@ -87,7 +108,7 @@ test('Pages - Index - Scan (Build)', async ({ page }) => {
await page.getByRole('cell', { name: 'build', exact: true }).waitFor();
});

test('Pages - Index - Scan (General)', async ({ page }) => {
test('Scanning (General)', async ({ page }) => {
await defaultScanTest(page, '{"unknown": 312}');
await page.getByText('"unknown": 312').waitFor();

Expand Down
5 changes: 3 additions & 2 deletions src/frontend/tests/pui_command.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ test('Quick Command - No Keys', async ({ page }) => {
})
.click();
await page.getByRole('cell', { name: 'Instance Name' }).waitFor();
await page.getByRole('button', { name: 'Dismiss' }).click();
await page.getByRole('button', { name: 'Close' }).click();

await page.waitForURL('**/platform/home');

Expand All @@ -66,8 +66,9 @@ test('Quick Command - No Keys', async ({ page }) => {
.click();
await page.getByText('License Information').first().waitFor();
await page.getByRole('tab', { name: 'backend Packages' }).waitFor();
await page.getByRole('button', { name: 'Django BSD License' }).click();

await page.getByLabel('License Information').getByRole('button').click();
await page.keyboard.press('Escape');

// use about
await page.getByLabel('open-spotlight').click();
Expand Down
Loading

0 comments on commit c062d5e

Please sign in to comment.