Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • andersharrisson/ce-deploy-ui
  • ccce/dev/ce-deploy-ui
2 results
Show changes
Commits on Source (12)
Hide whitespace changes
Inline Side-by-side
Showing
with 180 additions and 508 deletions
src/App.js
View file @ 70ffe569
......@@ -8,7 +8,6 @@ import { IOCListView } from "./views/IOC/IOCListView";
import NavigationMenu from "./components/navigation/NavigationMenu";
import { IOCDetailsAccessControl } from "./views/IOC/IOCDetailsAccessControl";
import { JobDetailsAccessControl } from "./views/jobs/JobDetailsAccessControl";
import { LegacyApiProvider } from "./api/SwaggerApi";
import { UserProvider } from "./api/UserProvider";
import { HostListView } from "./views/host/HostListView";
import { HostDetailsAccessControl } from "./views/host/HostDetailsAccessControl";
......@@ -46,95 +45,93 @@ function App() {
<ThemeProvider theme={theme}>
<CssBaseline />
<DeployAPIProvider>
<LegacyApiProvider>
<UserProvider>
<TokenRenew />
<NotificationProvider>
<NavigationMenu>
<Routes>
<Route
path="/"
element={<Navigate to="/iocs" />}
exact
/>
<Route
path="/records"
element={<RecordListView />}
exact
/>
<Route
path="/records/:name"
element={<RecordDetailsView />}
exact
/>
<Route
path="/iocs/create"
element={<CreateIOCAccessControl />}
exact
/>
<Route
path="/iocs/:id"
element={<IOCDetailsAccessControl exact />}
/>
<Route
path="/iocs"
element={<IOCListView />}
exact
/>
<Route
path="/jobs"
element={<JobLogAccessControl />}
exact
/>
<Route
path="/jobs/:id"
element={<JobDetailsAccessControl exact />}
/>
<Route
path="/hosts/:id"
element={<HostDetailsAccessControl />}
exact
/>
<Route
path="/hosts"
element={<HostListView />}
exact
/>
<Route
path="/statistics"
element={<StatisticsView />}
exact
/>
<Route
path="/help"
element={<HelpView />}
exact
/>
<Route
path="/login"
element={<LoginView />}
exact
/>
<Route
path="/error-test"
element={<TestErrorView />}
exact
/>
<Route
path="/user/:userName"
element={<UserDetailsAccessControl />}
exact
/>
<Route
path="*"
element={<NotFoundView />}
exact
/>
</Routes>
</NavigationMenu>
</NotificationProvider>
</UserProvider>
</LegacyApiProvider>
<UserProvider>
<TokenRenew />
<NotificationProvider>
<NavigationMenu>
<Routes>
<Route
path="/"
element={<Navigate to="/iocs" />}
exact
/>
<Route
path="/records"
element={<RecordListView />}
exact
/>
<Route
path="/records/:name"
element={<RecordDetailsView />}
exact
/>
<Route
path="/iocs/create"
element={<CreateIOCAccessControl />}
exact
/>
<Route
path="/iocs/:id"
element={<IOCDetailsAccessControl exact />}
/>
<Route
path="/iocs"
element={<IOCListView />}
exact
/>
<Route
path="/jobs"
element={<JobLogAccessControl />}
exact
/>
<Route
path="/jobs/:id"
element={<JobDetailsAccessControl exact />}
/>
<Route
path="/hosts/:id"
element={<HostDetailsAccessControl />}
exact
/>
<Route
path="/hosts"
element={<HostListView />}
exact
/>
<Route
path="/statistics"
element={<StatisticsView />}
exact
/>
<Route
path="/help"
element={<HelpView />}
exact
/>
<Route
path="/login"
element={<LoginView />}
exact
/>
<Route
path="/error-test"
element={<TestErrorView />}
exact
/>
<Route
path="/user/:userName"
element={<UserDetailsAccessControl />}
exact
/>
<Route
path="*"
element={<NotFoundView />}
exact
/>
</Routes>
</NavigationMenu>
</NotificationProvider>
</UserProvider>
</DeployAPIProvider>
</ThemeProvider>
</StyledEngineProvider>
......
src/api/APIProvider.spec.js
View file @ 70ffe569
import React, { useContext } from "react";
import { apiContext, LegacyApiProvider, useAPI } from "./SwaggerApi";
import { DeployAPIProvider, apiContext } from "./DeployApi";
import { SnackbarProvider } from "notistack";
function AppHarness({ children }) {
......@@ -26,27 +26,16 @@ function DisplayAPISpecification({ api }) {
}
context("API", () => {
describe("useAPI", () => {
it("creates the SwaggerClient", () => {
const Glue = () => {
const [api] = useAPI();
return <DisplayAPISpecification api={api} />;
};
mountIntoHarness(<Glue />);
checkAPIDisplayed();
});
});
describe("LegacyApiProvider", () => {
describe("ApiProvider", () => {
it("makes the API available via context", () => {
const Glue = () => {
const api = useContext(apiContext);
return <DisplayAPISpecification api={api} />;
};
mountIntoHarness(
<LegacyApiProvider>
<DeployAPIProvider>
<Glue />
</LegacyApiProvider>
</DeployAPIProvider>
);
checkAPIDisplayed();
});
......
src/api/SwaggerApi.js deleted 100644 → 0
View file @ e180e473
/* eslint-disable react-hooks/exhaustive-deps */
/**
* SwaggerApi
* Swagger API, fetching data
* and providing apiContext and userContext
*/
import React, { useCallback, useRef } from "react";
import SwaggerClient from "swagger-client";
import { createContext, useContext, useEffect, useState } from "react";
import { CircularProgress } from "@mui/material";
import { useCustomSnackbar } from "../components/common/snackbar/Snackbar";
import { userContext } from "@ess-ics/ce-ui-common";
const createSwaggerClient = async () => {
const swaggerOptions = {
url: `${window.SERVER_ADDRESS}${window.API_BASE_ENDPOINT}`,
requestInterceptor: (req) => {
// if (user) req.headers["Authorization"] = `Bearer ${user.token}`;
req.headers["Content-Type"] = "application/json";
req.headers.accept = "application/json";
window.req = req;
return req;
},
responseInterceptor: (res) => {
return res;
}
};
const swagger = await SwaggerClient(swaggerOptions);
// update the server url to be our intended server
swagger.spec.servers[0].url = `${window.SERVER_ADDRESS}`;
window.swagger = swagger;
return swagger;
};
export function useAPI() {
const create = useCallback(createSwaggerClient, []);
return useAsync({ fcn: create });
}
export const apiContext = createContext(null);
export function LegacyApiProvider({ children }) {
const [api] = useAPI();
return api ? (
<apiContext.Provider value={api}>{children}</apiContext.Provider>
) : (
<CircularProgress />
);
}
export function useAPIErrorHandler(onError) {
const { logout } = useContext(userContext);
const showError = useCustomSnackbar();
function errorHandler(e) {
const { response, message } = e;
const { obj, status } = response ?? { obj: {}, status: "" };
// Always log out if 401
if (status === 401) {
logout();
}
if (onError) {
const errorNotHandled = onError(obj?.description ?? message, status);
if (errorNotHandled) {
showError(obj?.description ?? message);
}
} else {
showError(obj?.description ?? message);
}
}
return useCallback(errorHandler, [logout]);
}
export function useQueuedResponse({
init = null,
onError = null,
initLoading = false
}) {
const queueRef = useRef([]);
const busyRef = useRef(false);
const [response, setResponse] = useState(init);
const [loading, setLoading] = useState(initLoading);
const errorHandler = useAPIErrorHandler(onError);
const MAX_QUEUE_LENGTH = 10;
const processQueue = useCallback(async () => {
if (busyRef.current) {
return;
}
busyRef.current = true;
setLoading(true);
let responses = [];
const queue = queueRef.current;
while (responses.length !== queue.length) {
responses = await Promise.allSettled(queue);
}
queueRef.current = [];
busyRef.current = false;
const { status, value, reason } = responses.pop();
if (status === "rejected") {
setLoading(false);
errorHandler(reason);
return;
}
setResponse(value);
setLoading(false);
}, [errorHandler]);
const enqueue = useCallback(
(promise) => {
if (queueRef.current.length > MAX_QUEUE_LENGTH) {
throw new Error(
`Max queue length (${MAX_QUEUE_LENGTH}) exceeded in useQueuedResponse.`
);
}
queueRef.current.push(promise);
processQueue();
},
[queueRef, processQueue]
);
return { response, setResponse, loading, enqueue };
}
export function useAsync({ fcn, call = true, init = null, onError = null }) {
const { response, setResponse, loading, enqueue } = useQueuedResponse({
init,
onError,
call
});
const reset = useCallback(() => setResponse(init), [setResponse, init]);
const wrapper = useCallback(
(...args) => {
enqueue(fcn(...args));
},
[fcn, enqueue]
);
useEffect(() => {
if (call) wrapper();
}, [wrapper, call]);
return [response, wrapper, reset, loading];
}
function useCallAndUnpack(fcn, unpacker = (x) => x) {
return useCallback(async (...args) => {
const response = await fcn(...args);
const unpacked = unpacker(response.obj, response.status);
return unpacked;
}, []);
}
export function unpackIOC(ioc) {
ioc = { ...ioc };
const {
id,
description,
createdBy,
active,
activeDeployment,
namingName,
gitProjectId,
namingUuid,
sourceUrl,
sourceVersion,
sourceVersionShort,
operationInProgress,
alerts
} = ioc;
let unpackedIOC = {
id: id,
description: description,
createdBy: createdBy,
activeDeployment: activeDeployment,
active: active,
gitProjectId: gitProjectId,
sourceUrl: sourceUrl,
sourceVersion: sourceVersion,
sourceVersionShort: sourceVersionShort,
namingName: namingName,
operationInProgress: operationInProgress,
alerts: alerts,
namingUuid: namingUuid
};
return unpackedIOC;
}
export function unpackIocInfo(ioc) {
ioc = { ...ioc };
return ioc;
}
export function unpackIOCList(iocs) {
let iocArray = iocs.iocList.map((ioc) => unpackIocInfo(ioc));
let unpackedIOCList = {
totalCount: iocs.totalCount,
pageNumber: iocs.pageNumber,
limit: iocs.limit,
iocList: iocArray
};
return unpackedIOCList;
}
export function unpackDeployment(deployment) {
const d = { ...deployment };
return d;
}
export function unpackOngoingOperations(input) {
const { operations: operationsList, ...rest } = input;
const output = { ...rest, operationsList };
return output.totalCount > 0 ? output.operationsList[0] : null;
}
export function unpackJob(job) {
return { ...job };
}
export function useJobLogById() {
const api = useContext(apiContext);
const method = useCallAndUnpack((awxJobId) =>
api.apis.Deployments.fetchDeploymentJobLog({ awx_job_id: awxJobId })
);
return useAsync({ fcn: method, call: false, init: null });
}
export function unpackRecord(record) {
return { ...record };
}
export function useRenewToken() {
const api = useContext(apiContext);
const method = useCallAndUnpack(api.apis.Authentication.tokenRenew);
const [, /* response*/ renewToken /* reset*/, , loading] = useAsync({
fcn: method,
call: false
});
return [renewToken, loading];
}
export function unpackGitReference(reference) {
return { ...reference };
}
export function unpackTagAndCommitIdList(tagList) {
return tagList.map((t) => unpackGitReference(t));
}
export function useTagsAndCommitIds(onError) {
const api = useContext(apiContext);
const method = useCallAndUnpack(
(gitProjectId, reference, includeAllReference, searchMethod) =>
api.apis.Git.listTagsAndCommitIds({
project_id: gitProjectId,
reference: reference,
include_all_reference: includeAllReference,
search_method: searchMethod
}),
unpackTagAndCommitIdList
);
return useAsync({ fcn: method, call: false, onError: onError, init: [] });
}
export function unpackGitProject(project) {
return { ...project };
}
export function unpackUpdateActiveDeploymentHost(ioc) {
return { ...ioc };
}
src/api/UserProvider.js
View file @ 70ffe569
import React from "react";
import { useCallback, useEffect, useState, useContext } from "react";
import { userContext, useAPIMethod } from "@ess-ics/ce-ui-common";
import { apiContext } from "./SwaggerApi";
import { apiContext } from "./DeployApi";
function loginRequest(username, password) {
return {
......
src/api/UserProvider.spec.js
View file @ 70ffe569
import React, { useContext } from "react";
import { LegacyApiProvider } from "./SwaggerApi";
import { DeployAPIProvider } from "./DeployApi";
import { UserProvider } from "./UserProvider";
import { userContext } from "@ess-ics/ce-ui-common";
import { SnackbarProvider } from "notistack";
......@@ -10,7 +10,7 @@ function AppHarness({ children }) {
preventDuplicate
maxSnack="5"
>
<LegacyApiProvider>{children}</LegacyApiProvider>
<DeployAPIProvider>{children}</DeployAPIProvider>
</SnackbarProvider>
);
}
......
src/components/IOC/AlertMessages/AlertMessages.js deleted 100644 → 0
View file @ e180e473
import React from "react";
import { Button, Grid } from "@mui/material";
import Alert from "@mui/material/Alert";
export default function AlertMessages({ alerts }) {
function determineSeverity(alarmType) {
return ["error", "warning", "success"].includes(alarmType?.toLowerCase())
? alarmType?.toLowerCase()
: "info";
}
return (
<Grid
id="ioc-alerts"
container
spacing={1}
direction="column"
>
{alerts?.map((alert) => (
<Grid
item
key={alert?.message || alert}
>
<Alert
severity={determineSeverity(alert?.type)}
action={
alert?.link && (
<Button
target="_blank"
href={alert.link}
color="inherit"
size="small"
>
More Info
</Button>
)
}
component="p"
>
{alert?.message}
</Alert>
</Grid>
))}
</Grid>
);
}
src/components/IOC/AlertMessages/index.js deleted 100644 → 0
View file @ e180e473
import AlertMessages from "./AlertMessages";
export { AlertMessages };
export default AlertMessages;
src/components/IOC/IOCDetails/IOCDetails.js
View file @ 70ffe569
......@@ -31,7 +31,10 @@ export function IOCDetails({ ioc, getSubset = defaultSubset, alert, buttons }) {
return (
<>
<Grid container>
<Grid
container
spacing={1}
>
{alert && (
<Grid
item
......@@ -40,24 +43,29 @@ export function IOCDetails({ ioc, getSubset = defaultSubset, alert, buttons }) {
{alert}
</Grid>
)}
<Grid
item
xs={12}
>
<Box
display="flex"
flexDirection="row-reverse"
p={2}
m={1}
{buttons && (
<Grid
item
xs={12}
>
<AccessControl
allowedRoles={["DeploymentToolAdmin", "DeploymentToolIntegrator"]}
renderNoAccess={() => <> </>}
<Box
display="flex"
flexDirection="row-reverse"
p={2}
m={1}
>
<>{buttons}</>
</AccessControl>
</Box>
</Grid>
<AccessControl
allowedRoles={[
"DeploymentToolAdmin",
"DeploymentToolIntegrator"
]}
renderNoAccess={() => <> </>}
>
<>{buttons}</>
</AccessControl>
</Box>
</Grid>
)}
<Grid
item
xs={12}
......
src/components/IOC/IOCIcons/IOCIcons.js
View file @ 70ffe569
......@@ -4,14 +4,14 @@ import {
Brightness1,
Cancel,
Error,
RadioButtonUnchecked,
StopCircle,
ErrorOutline,
HelpOutline,
PlayCircleFilled,
PauseCircleFilled
} from "@mui/icons-material";
import Popover from "../../common/Popover";
import AlertMessages from "../AlertMessages/AlertMessages";
import { AlertBannerList } from "@ess-ics/ce-ui-common";
function AlertMessagesPopoverContents({ title, alerts }) {
// for now filter out links on alerts due to issues with
......@@ -31,7 +31,7 @@ function AlertMessagesPopoverContents({ title, alerts }) {
{title}
</Typography>
{alertsWithoutLinks.length > 0 ? (
<AlertMessages alerts={alertsWithoutLinks} />
<AlertBannerList alerts={alertsWithoutLinks} />
) : null}
</div>
);
......@@ -57,7 +57,7 @@ export function IOCStatusIcon({ ioc }) {
},
inactive: {
title: "Inactive",
icon: <RadioButtonUnchecked title="Inactive" />
icon: <StopCircle title="Inactive" />
},
"inactive alert": {
title: "Alert",
......
src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
View file @ 70ffe569
......@@ -6,7 +6,7 @@ import { Link as ReactRouterLink } from "react-router-dom";
import { LokiContainer } from "../../common/Loki/LokiContainer";
import { RecordSearch } from "../../records/RecordSearch";
import GitRefLink from "../GitRefLink";
import AlertMessages from "../AlertMessages";
import { AlertBannerList } from "@ess-ics/ce-ui-common";
import AccessControl from "../../auth/AccessControl";
import { IocActiveDeployment } from "../../../api/DataTypes";
import useUrlState from "@ahooksjs/use-url-state";
......@@ -83,7 +83,7 @@ export function IOCLiveStatus({ ioc }) {
<IOCDetails
ioc={liveIOC}
getSubset={getSubset}
alert={<AlertMessages alerts={liveIOC.alerts} />}
alert={<AlertBannerList alerts={liveIOC.alerts} />}
/>
{liveIOC.activeDeployment?.host?.csEntryIdValid && (
<AccessControl
......@@ -91,7 +91,7 @@ export function IOCLiveStatus({ ioc }) {
renderNoAccess={() => <></>}
>
<SimpleAccordion
summary="ProcServLog info"
summary="IOC log stream"
expanded={deserialize(state.procserv_log_open)}
onChange={(event, expanded) =>
setState({ procserv_log_open: serialize(expanded) })
......
src/components/IOC/IOCManage/IOCManage.js
View file @ 70ffe569
......@@ -12,9 +12,9 @@ import { UndeployIOC } from "../UndeployIOC";
import {
userContext,
SimpleAccordion,
useAPIMethod
useAPIMethod,
AlertBannerList
} from "@ess-ics/ce-ui-common";
import AlertMessages from "../AlertMessages";
import AccessControl from "../../auth/AccessControl";
import { DeploymentStatus } from "../../../api/DataTypes";
import { IOCService } from "../IOCService";
......@@ -88,7 +88,7 @@ export function IOCManage({
const showControls = deploymentStatus.wasSuccessful();
let subset = {
"IOC name": (
"Naming service record": (
<Typography>
<MuiLink
href={`${window.NAMING_ADDRESS}/devices.xhtml?i=2&deviceName=${ioc.namingName}`}
......@@ -100,7 +100,7 @@ export function IOCManage({
</MuiLink>
</Typography>
),
git: (
Repository: (
<Typography>
<MuiLink
href={git}
......@@ -127,7 +127,7 @@ export function IOCManage({
}}
/>
) : (
"Can't be controlled, because IOC is not (yet) deployed succesfully"
"IOC not yet deployed"
);
}
......@@ -181,7 +181,7 @@ export function IOCManage({
<IOCDetails
ioc={managedIOC}
getSubset={getSubset}
alert={<AlertMessages alerts={managedIOC.alerts} />}
alert={<AlertBannerList alerts={managedIOC.alerts} />}
buttons={
<>
<Tooltip title={disabledDebployButtonTitle}>
......
src/components/Job/JobDetails.js
View file @ 70ffe569
......@@ -7,8 +7,12 @@ import {
Container,
Link as MuiLink
} from "@mui/material";
import { KeyValueTable, SimpleAccordion } from "@ess-ics/ce-ui-common";
import { Stepper } from "@ess-ics/ce-ui-common";
import {
KeyValueTable,
SimpleAccordion,
AlertBannerList,
Stepper
} from "@ess-ics/ce-ui-common";
import { JobBadge } from "./JobBadge";
import { DeploymentJobOutput } from "../deployments/DeploymentJobOutput";
import { Link as ReactRouterLink } from "react-router-dom";
......@@ -16,7 +20,6 @@ import { formatDate } from "../common/Helper";
import GitRefLink from "../IOC/GitRefLink";
import AccessControl from "../auth/AccessControl";
import { AWXJobDetails } from "../../api/DataTypes";
import AlertMessages from "../IOC/AlertMessages";
const STATUS = {
queued: {
......@@ -147,7 +150,7 @@ export function JobDetails({ operation, job }) {
item
xs={12}
>
<AlertMessages alerts={[alert].concat(jobAlert)} />
<AlertBannerList alerts={[alert].concat(jobAlert)} />
</Grid>
)}
<Grid
......@@ -191,7 +194,7 @@ export function JobDetails({ operation, job }) {
item
xs={12}
>
<AlertMessages alerts={[alert]} />
<AlertBannerList alerts={[alert]} />
</Grid>
)}
<AccessControl
......
src/components/auth/TokenRenew/TokenRenew.js
View file @ 70ffe569
import { useContext, useCallback } from "react";
import { useRenewToken } from "../../../api/SwaggerApi";
import { userContext } from "@ess-ics/ce-ui-common";
import { apiContext } from "../../../api/DeployApi";
import { userContext, useAPIMethod } from "@ess-ics/ce-ui-common";
import { useSafePolling } from "../../../hooks/Polling";
export default function TokenRenew() {
const { user } = useContext(userContext);
const [renewToken, loading] = useRenewToken();
const client = useContext(apiContext);
const {
wrapper: renewToken,
loading,
abort
} = useAPIMethod({
fcn: client.apis.Authentication.tokenRenew,
call: false
});
const renewTokenWhenLoggedIn = useCallback(() => {
if (user) {
renewToken();
return () => {
abort();
};
}
}, [user, renewToken]);
}, [user, renewToken, abort]);
useSafePolling(renewTokenWhenLoggedIn, loading, window.TOKEN_RENEW_INTERVAL);
......
src/components/auth/TokenRenew/TokenRenew.spec.js
View file @ 70ffe569
import { SnackbarProvider } from "notistack";
import React from "react";
import { LegacyApiProvider } from "../../../api/SwaggerApi";
import { UserProvider } from "../../../api/UserProvider";
import TokenRenew from ".";
import { DeployAPIProvider } from "../../../api/DeployApi";
function AppHarness({ children }) {
return (
......@@ -10,9 +10,9 @@ function AppHarness({ children }) {
preventDuplicate
maxSnack="5"
>
<LegacyApiProvider>
<DeployAPIProvider>
<UserProvider>{children}</UserProvider>
</LegacyApiProvider>
</DeployAPIProvider>
</SnackbarProvider>
);
}
......
src/components/common/Loki/LokiPanel.js
View file @ 70ffe569
......@@ -32,7 +32,7 @@ const classes = {
undeployed: `${PREFIX}-undeployed`
};
const Root = styled("html")(({ theme }) => ({
const Root = styled("div")(({ theme }) => ({
[`& .${classes.formControl}`]: {
margin: theme.spacing(0),
minWidth: 120
......@@ -220,7 +220,7 @@ export function LokiPanel({ host, iocName, isSyslog, isDeployed }) {
)}
dataReady={dataReady}
extraClass={isDeployed ? classes.deployed : classes.undeployed}
title={isSyslog ? "Syslog" : "ProcServ log"}
title={isSyslog ? "Host log stream" : "IOC log stream"}
dialogHeader={header}
loading={periodChange}
/>
......
src/components/common/notification/Notifications.spec.js
View file @ 70ffe569
import { SnackbarProvider } from "notistack";
import React, { useContext } from "react";
import { LegacyApiProvider } from "../../../api/SwaggerApi";
import { DeployAPIProvider } from "../../../api/DeployApi";
import { UserProvider } from "../../../api/UserProvider";
import { userContext } from "@ess-ics/ce-ui-common";
import { useEffectOnMount } from "../../../hooks/MountEffects";
......@@ -12,9 +12,9 @@ function AppHarness({ children }) {
preventDuplicate
maxSnack="5"
>
<LegacyApiProvider>
<DeployAPIProvider>
<UserProvider>{children}</UserProvider>
</LegacyApiProvider>
</DeployAPIProvider>
</SnackbarProvider>
);
}
......
src/components/host/HostIcons.js
View file @ 70ffe569
......@@ -4,7 +4,7 @@ import {
Brightness1,
ErrorOutline,
Error,
RadioButtonUnchecked,
StopCircle,
HelpOutline
} from "@mui/icons-material";
......@@ -24,7 +24,7 @@ export function HostStatusIcon({ host }) {
},
inactive: {
title: "Inactive",
icon: <RadioButtonUnchecked />
icon: <StopCircle />
},
"inactive alert": {
title: "Alert",
......
src/components/records/RecordIcons.js
View file @ 70ffe569
import React from "react";
import { Tooltip, useTheme } from "@mui/material";
import {
Brightness1,
RadioButtonUnchecked,
HelpOutline
} from "@mui/icons-material";
import { Brightness1, StopCircle, HelpOutline } from "@mui/icons-material";
export function RecordStatusIcon({ record }) {
const theme = useTheme();
......@@ -18,7 +14,7 @@ export function RecordStatusIcon({ record }) {
},
inactive: {
title: "Inactive",
icon: <RadioButtonUnchecked />
icon: <StopCircle />
},
null: {
title: "Unknown",
......
src/components/records/RecordSearch.js
View file @ 70ffe569
......@@ -83,7 +83,7 @@ export function RecordSearch({ iocName, rowType }) {
const rowsPerPage = [20, 50];
const { pagination, setPagination } = usePagination({
const { pagination, setPagination, setTotalCount } = usePagination({
rowsPerPageOptions: rowsPerPage,
initLimit: urlPagination.rows ?? rowsPerPage[0],
initPage: urlPagination.page ?? 0
......@@ -91,8 +91,14 @@ export function RecordSearch({ iocName, rowType }) {
// update pagination whenever search result total pages change
useEffect(() => {
setPagination({ totalCount: records?.totalCount ?? 0 });
}, [setPagination, records?.totalCount]);
setTotalCount((prev) => {
if (prev === pagination.totalCount && prev > 0) {
return prev;
} else {
return records?.totalCount ?? 0;
}
});
}, [pagination, records?.totalCount, setTotalCount]);
// whenever url state changes, update pagination
useEffect(() => {
......@@ -110,6 +116,7 @@ export function RecordSearch({ iocName, rowType }) {
let requestParams = initRequestParams(pagination);
requestParams.pv_status = recordFilter;
requestParams.record_name = deserialize(urlState.query);
requestParams.ioc_name = iocName;
getRecords(requestParams);
return () => {
......
src/mocks/AppHarness.js
View file @ 70ffe569
......@@ -3,7 +3,6 @@ import { SnackbarProvider } from "notistack";
import { Container, CssBaseline, StyledEngineProvider } from "@mui/material";
import { ThemeProvider } from "@mui/material/styles";
import { theme } from "../style/Theme";
import { LegacyApiProvider } from "../api/SwaggerApi";
import { UserProvider } from "../api/UserProvider";
import { NotificationProvider } from "../components/common/notification/Notifications";
import NavigationMenu from "../components/navigation/NavigationMenu";
......@@ -16,9 +15,7 @@ export function RouterHarness({ children, initialHistory = ["/"] }) {
<ThemeProvider theme={theme}>
<CssBaseline />
<MemoryRouter initialEntries={initialHistory}>
<DeployAPIProvider>
<LegacyApiProvider>{children}</LegacyApiProvider>
</DeployAPIProvider>
<DeployAPIProvider>{children}</DeployAPIProvider>
</MemoryRouter>
</ThemeProvider>
</StyledEngineProvider>
......