From f7f5265264685eb75e13b68beb1c5576e68e276d Mon Sep 17 00:00:00 2001 From: Luke Berndt Date: Wed, 5 Apr 2023 21:16:53 -0400 Subject: [PATCH] cleaned up admin --- account/server/config/express.js | 6 +- account/server/controllers/users.js | 2 +- account/src/App/App.js | 3 +- account/src/App/Navigation.js | 5 - account/src/App/NavigationContainer.js | 21 ---- account/src/User/Login.js | 2 +- admin/src/App/App.js | 2 - admin/src/App/Navigation.js | 4 - admin/src/App/Restricted.js | 7 +- admin/src/Components/About.js | 1 - admin/src/Components/Message.js | 38 +++--- admin/src/Group/GroupModal.js | 26 ++-- admin/src/Group/ListGroups.js | 21 +--- admin/src/System/CallChart.js | 144 ++++++++++------------- admin/src/System/CreateSystem.js | 22 +--- admin/src/System/ErrorChart.js | 9 +- admin/src/System/ListSystems.js | 9 +- admin/src/System/ResponsiveCallChart.js | 1 - admin/src/System/ResponsiveErrorChart.js | 1 - admin/src/System/System.js | 43 ++++--- admin/src/System/SystemCard.js | 1 - admin/src/System/SystemContainer.js | 40 ------- admin/src/System/SystemForm.js | 6 +- admin/src/System/UpdateSystem.js | 12 +- admin/src/features/api/apiSlice.js | 25 ++-- admin/src/features/user/userSlice.js | 2 - 26 files changed, 149 insertions(+), 304 deletions(-) delete mode 100644 account/src/App/NavigationContainer.js delete mode 100644 admin/src/System/SystemContainer.js diff --git a/account/server/config/express.js b/account/server/config/express.js index 0b814b2..7570a03 100644 --- a/account/server/config/express.js +++ b/account/server/config/express.js @@ -10,7 +10,8 @@ var backend_server = process.env['REACT_APP_BACKEND_SERVER'] != null ? process.e var frontend_server = process.env['REACT_APP_FRONTEND_SERVER'] != null ? process.env['REACT_APP_FRONTEND_SERVER'] : 'https://openmhz.com'; var socket_server = process.env['REACT_APP_SOCKET_SERVER'] != null ? process.env['REACT_APP_SOCKET_SERVER'] : 'wss://socket.openmhz.com'; //'https://s3.amazonaws.com/robotastic'; var account_server = process.env['REACT_APP_ACCOUNT_SERVER'] != null ? process.env['REACT_APP_ACCOUNT_SERVER'] : 'https://account.openmhz.com'; //'https://s3.amazonaws.com/robotastic'; -var dev_server = "http://account.openmhz.test:3000" +var account_dev_server = "http://account.openmhz.test:3000" +var admin_dev_server = "http://admin.openmhz.test:3000" module.exports = function(app, passport) { app.set("port", 3009) @@ -65,7 +66,8 @@ module.exports = function(app, passport) { allowedOrigins.push(frontend_server); allowedOrigins.push(backend_server); allowedOrigins.push(socket_server); - allowedOrigins.push(dev_server); + allowedOrigins.push(admin_dev_server); + allowedOrigins.push(account_dev_server); var origin = req.headers.origin; diff --git a/account/server/controllers/users.js b/account/server/controllers/users.js index 6e9af9e..ba1d9a6 100644 --- a/account/server/controllers/users.js +++ b/account/server/controllers/users.js @@ -27,7 +27,7 @@ exports.isLoggedIn = function (req, res, next) { exports.authenticated = function (req, res, next) { res.header('Cache-Control', 'private, no-cache, no-store, must-revalidate'); - console.log("account/server/controllers/users.js - exports.authenticated() Auth check for user: " + req.user + " is: " + req.isAuthenticated()); + console.log("account/server/controllers/users.js - exports.authenticated() Auth check for user: " + req.user.email + " is: " + req.isAuthenticated()); if (req.isAuthenticated()) { var clientUser = (({ firstName, diff --git a/account/src/App/App.js b/account/src/App/App.js index 379a1b9..c83679c 100644 --- a/account/src/App/App.js +++ b/account/src/App/App.js @@ -1,4 +1,4 @@ -import React, { Component } from "react" +import React from "react" import Navigation from "./Navigation" import { Routes, Route } from 'react-router-dom'; @@ -15,7 +15,6 @@ import ResetPassword from "../User/ResetPassword" import Terms from "../User/Terms" const App = (params) => { - const { store } = params; return (
diff --git a/account/src/App/Navigation.js b/account/src/App/Navigation.js index fd43cf1..d3fb101 100644 --- a/account/src/App/Navigation.js +++ b/account/src/App/Navigation.js @@ -1,15 +1,10 @@ -import { Link } from "react-router-dom"; import { Menu, Dropdown } from "semantic-ui-react"; -import React, { useEffect } from "react"; import { useSelector, useDispatch } from 'react-redux' import { logoutUser } from "../features/user/userSlice"; const navStyle = { marginBottom: "30px" }; -const blankStyle = { - marginBottom: "50px" -}; const Navigation = (props) => { const dispatch = useDispatch(); diff --git a/account/src/App/NavigationContainer.js b/account/src/App/NavigationContainer.js deleted file mode 100644 index ab31c72..0000000 --- a/account/src/App/NavigationContainer.js +++ /dev/null @@ -1,21 +0,0 @@ -import { connect } from "react-redux" -import * as userActions from "../User/user-actions" -import Navigation from "./Navigation" - - -// Function passed in to `connect` to subscribe to Redux store updates. -// Any time it updates, mapStateToProps is called. -const mapStateToProps = (state) => { - return { - user: state.user - } - -} - -// Connects React component to the redux store -// It does not modify the component class passed to it -// Instead, it returns a new, connected component class, for you to use. -export default connect( - mapStateToProps, - userActions -)(Navigation) diff --git a/account/src/User/Login.js b/account/src/User/Login.js index 993d76f..5b4ce20 100644 --- a/account/src/User/Login.js +++ b/account/src/User/Login.js @@ -43,7 +43,7 @@ const Login = (props) => { if (result.success) { if (nextLocation) { - switch (this.props.nextLocation) { + switch (nextLocation) { case "frontend": window.location = process.env.REACT_APP_FRONTEND_SERVER; break; diff --git a/admin/src/App/App.js b/admin/src/App/App.js index ed9a3f6..8b7ef2d 100644 --- a/admin/src/App/App.js +++ b/admin/src/App/App.js @@ -1,4 +1,3 @@ -import React, { Component } from "react" import Navigation from "./Navigation" import { Routes, Route } from 'react-router-dom'; @@ -12,7 +11,6 @@ import CreateSystem from "../System/CreateSystem" const App = (params) => { - const {store} = params; return (
diff --git a/admin/src/App/Navigation.js b/admin/src/App/Navigation.js index d5c4290..65abe0e 100644 --- a/admin/src/App/Navigation.js +++ b/admin/src/App/Navigation.js @@ -1,15 +1,11 @@ import { Link } from "react-router-dom"; import { Menu, Dropdown } from "semantic-ui-react"; -import React, { useEffect } from "react"; import { useSelector, useDispatch } from 'react-redux' import { logoutUser } from "../features/user/userSlice"; const navStyle = { marginBottom: "30px" }; -const blankStyle = { - marginBottom: "50px" -}; const Navigation = (props) => { const dispatch = useDispatch(); diff --git a/admin/src/App/Restricted.js b/admin/src/App/Restricted.js index 1c5db84..39c0df3 100644 --- a/admin/src/App/Restricted.js +++ b/admin/src/App/Restricted.js @@ -2,7 +2,7 @@ import React, { useEffect} from "react"; import { useSelector, useDispatch } from 'react-redux' import { authenticateUser } from "../features/user/userSlice"; -import { useNavigate } from 'react-router-dom'; + /** * Higher-order component (HOC) to wrap restricted pages */ @@ -10,8 +10,6 @@ import { useNavigate } from 'react-router-dom'; const Restricted = ({children }) => { const { authenticated, hasAuthenticated } = useSelector((state) => state.user); const dispatch = useDispatch(); - const navigate = useNavigate(); - useEffect(() => { dispatch(authenticateUser({})); },[]); @@ -21,8 +19,7 @@ const Restricted = ({children }) => { return children;; } else { - - navigate("/list-systems") + window.location = process.env.REACT_APP_ACCOUNT_SERVER + "/login?nextLocation=admin"; } } return
diff --git a/admin/src/Components/About.js b/admin/src/Components/About.js index 95cbc99..b02bda7 100644 --- a/admin/src/Components/About.js +++ b/admin/src/Components/About.js @@ -1,4 +1,3 @@ -import React, { Component } from "react"; import { Container, Header } from "semantic-ui-react"; const About = () => { diff --git a/admin/src/Components/Message.js b/admin/src/Components/Message.js index ca5b742..2b1830b 100644 --- a/admin/src/Components/Message.js +++ b/admin/src/Components/Message.js @@ -1,31 +1,21 @@ -import React, { Component } from "react"; +import React from "react"; import { Modal, Icon, Button, Header } from "semantic-ui-react"; -class Message extends Component { - constructor(props) { - super(props); - } +const Message = (props) => { - _logout = event => { - event.preventDefault(); - this.props.manualLogout(); - }; - - render() { - return ( - -
- -

{this.props.message}

- - - - - - ); - } -} + + + ); +}; export default Message; diff --git a/admin/src/Group/GroupModal.js b/admin/src/Group/GroupModal.js index 9ef7685..c890124 100644 --- a/admin/src/Group/GroupModal.js +++ b/admin/src/Group/GroupModal.js @@ -1,5 +1,5 @@ import React, { useEffect, useState, } from "react"; -import { useGetSystemsQuery, useGetTalkgroupsQuery, useGetGroupsQuery, useUpdateGroupMutation, useCreateGroupMutation, useDeleteGroupMutation, useSaveGroupOrderMutation} from '../features/api/apiSlice' +import { useGetTalkgroupsQuery, useGetGroupsQuery, useUpdateGroupMutation, useCreateGroupMutation} from '../features/api/apiSlice' import { Grid, @@ -21,15 +21,15 @@ const GroupModal = (props) => { name: "", items: [] } - const [editGroup, setEditGroup] = useState(false); + const [groupName, setGroupName] = useState(""); const [group, setGroup] = useState(emptyGroup) const [talkgroups, setTalkgroups] = useState(props.talkgroups ? props.talkgroups : []) - const { data: talkgroupsData, isSuccess: isTalkgroupsSuccess } = useGetTalkgroupsQuery(props.shortName); - const { data: groupsData, isSuccess: isGroupsSuccess } = useGetGroupsQuery(props.shortName); - const [ updateGroup,{ isLoading: isUpdating } ] = useUpdateGroupMutation(); - const [ createGroup,{ isLoading: isCreating } ] = useCreateGroupMutation(); + const { data: talkgroupsData} = useGetTalkgroupsQuery(props.shortName); + const { data: groupsData} = useGetGroupsQuery(props.shortName); + const [ updateGroup] = useUpdateGroupMutation(); + const [ createGroup] = useCreateGroupMutation(); useEffect(() => { if (talkgroupsData && groupsData && props.editGroupId) { @@ -66,7 +66,7 @@ const GroupModal = (props) => { if (!props.editGroupId && talkgroupsData) { setTalkgroups([...talkgroupsData]); } - },[talkgroupsData]); + },[talkgroupsData, props.editGroupId]); useEffect(() => { @@ -75,15 +75,9 @@ const GroupModal = (props) => { setGroup(emptyGroup); setTalkgroups( [...props.talkgroups]); } - },[props.editGroupId]); + },[props.editGroupId, props.talkgroups]); - - - - - - - const removeTalkgroup = (event, index) => { + const removeTalkgroup = (index) => { const item = { num: group.items[index].num, description: group.items[index].description @@ -106,7 +100,7 @@ const GroupModal = (props) => { } - const addTalkgroup = (event, index) => { + const addTalkgroup = (index) => { const item = { num: talkgroupsData[index].num, description: talkgroupsData[index].description diff --git a/admin/src/Group/ListGroups.js b/admin/src/Group/ListGroups.js index 4be34f7..b42bc7c 100644 --- a/admin/src/Group/ListGroups.js +++ b/admin/src/Group/ListGroups.js @@ -1,15 +1,4 @@ -import React, { Component } from "react"; -import ReactDOM from "react-dom"; -import { Link } from 'react-router-dom' import { - Container, - Header, - Form, - Grid, - Segment, - Input, - Button, - Message, Icon, Table } from "semantic-ui-react"; @@ -30,7 +19,7 @@ const ListGroups = (props) => { if (groups) { // if a group gets deleted, it will still be listed in the Order array for a little. for (const id of props.order) { - const group = props.groups.find( group => group._id == id ); + const group = props.groups.find( group => group._id === id ); if (group) { groupsDisplay.push(group) } @@ -58,13 +47,13 @@ const ListGroups = (props) => { onClick={e => props.editGroup(group._id)} /> props.reorderGroup(i, i-1)} /> props.reorderGroup(i, i+1)} /> { -class CallChart extends Component { -constructor(props) { - super(props); -} + var callData = props.data; + if (!callData) { + return ( + Loading + ) + } - render() { - var callData = this.props.data; - if (!callData) { - return ( + var callTotals = callData.callTotals; + var errorTotals = callData.errorTotals; - Loading + // Define the graph dimensions and margins + const width = props.width; + const height = 500; + const margin = { top: 20, bottom: 40, left: 40, right: 20 }; + const parseDate = timeParse("%Y%m%d"); + const format = timeFormat("%b %d"); + const formatDate = (date) => format(parseDate(date)); - ) - } - var callTotals = []; - var errorTotals = []; + // Then we'll create some bounds + const xMax = width - margin.left - margin.right; + const yMax = height - margin.top - margin.bottom; - // Define the graph dimensions and margins - const width = this.props.width; - const height = 500; - const margin = { top: 20, bottom: 40, left: 40, right: 20 }; - const parseDate = timeParse("%Y%m%d"); - const format = timeFormat("%b %d"); - const formatDate = (date) => format(parseDate(date)); + // accessors + const x = d => d.x; + const y = d => d.y; - // Then we'll create some bounds - const xMax = width - margin.left - margin.right; - const yMax = height - margin.top - margin.bottom; - - // accessors - const x = d => d.x; - const y = d => d.y; - - - - // Compose together the scale and accessor functions to get point functions - const dotColor = n => { - var colores_g = ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262", "#5574a6", "#3b3eac"]; - return colores_g[n % colores_g.length]; - } - - const compose = (scale, accessor) => (data) => scale(accessor(data)); - var xScale, yScale, xPoint, yPoint; - if (callData) { - // We'll use some mock data from `@vx/mock-data` for this. - callTotals = callData.callTotals; - errorTotals = callData.errorTotals; - // scales - xScale = scaleTime({ - range: [0, xMax], - domain: [callData.minDate, callData.maxDate], - tickFormat: () => (val) => formatDate(val) - }); - yScale = scaleLinear({ - range: [yMax, 0], - domain: [0, callData.maxValue], - }); - xPoint = compose(xScale, x); - yPoint = compose(yScale, y); - } + var xScale, yScale; + if (callData) { + // We'll use some mock data from `@vx/mock-data` for this. + // scales + xScale = scaleTime({ + range: [0, xMax], + domain: [callData.minDate, callData.maxDate], + tickFormat: () => (val) => formatDate(val) + }); + yScale = scaleLinear({ + range: [yMax, 0], + domain: [0, callData.maxValue], + }); + } return ( - - - 520 ? 10 : 5} /> - - - - - -); -} - - + + + 520 ? 10 : 5} /> + + + + + + ); } export default CallChart; diff --git a/admin/src/System/CreateSystem.js b/admin/src/System/CreateSystem.js index c8dc5e5..4823c2a 100644 --- a/admin/src/System/CreateSystem.js +++ b/admin/src/System/CreateSystem.js @@ -3,36 +3,24 @@ import React, { useState } from "react"; import { Container, Header, - Form, - Grid, - Segment, - Input, - Button, Divider, - Message, - Icon } from "semantic-ui-react"; import { useCreateSystemMutation} from '../features/api/apiSlice' -import { useSelector, useDispatch } from 'react-redux' -import { useLocation, useNavigate, useParams } from 'react-router-dom'; +import { useSelector } from 'react-redux' +import { useNavigate } from 'react-router-dom'; import SystemForm from "./SystemForm"; // ---------------------------------------------------- -const requestMessageStyle = { - color: "red" -}; - -// ---------------------------------------------------- -const CreateSystem = (props) => { +const CreateSystem = () => { const navigate = useNavigate(); - const [createSystem, { error }] = useCreateSystemMutation(); + const [createSystem ] = useCreateSystemMutation(); const { screenName } = useSelector((state) => state.user); const [requestMessage, setRequestMessage] = useState(""); const handleSubmit = async (system) => { try { - const originalPromiseResult = await createSystem(system).unwrap(); + await createSystem(system).unwrap(); navigate("/list-systems") } catch (error) { const message = error.data.message; diff --git a/admin/src/System/ErrorChart.js b/admin/src/System/ErrorChart.js index fc9bc47..7b2f36c 100644 --- a/admin/src/System/ErrorChart.js +++ b/admin/src/System/ErrorChart.js @@ -7,9 +7,7 @@ import { AxisBottom, AxisLeft } from '@visx/axis'; import { Loader } from "semantic-ui-react"; import { LegendOrdinal} from '@visx/legend'; class ErrorChart extends Component { - constructor(props) { - super(props); - } + render() { var errorData = this.props.data; @@ -44,12 +42,11 @@ class ErrorChart extends Component { return colores_g[n % colores_g.length]; } - const compose = (scale, accessor) => (data) => scale(accessor(data)); var zScale = scaleOrdinal({ domain: errorData.legend, range: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262", "#5574a6", "#3b3eac"] }); - var xScale, yScale, xPoint, yPoint; + var xScale, yScale; if (errorData) { // We'll use some mock data from `@vx/mock-data` for this. data = errorData.data; @@ -67,8 +64,6 @@ class ErrorChart extends Component { domain: errorData.legend, range: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499", "#22aa99", "#aaaa11", "#6633cc", "#e67300", "#8b0707", "#651067", "#329262", "#5574a6", "#3b3eac"] }); - xPoint = compose(xScale, x); - yPoint = compose(yScale, y); } diff --git a/admin/src/System/ListSystems.js b/admin/src/System/ListSystems.js index 610e1af..eaeac22 100644 --- a/admin/src/System/ListSystems.js +++ b/admin/src/System/ListSystems.js @@ -1,4 +1,3 @@ -import { Component, useRef } from "react"; import SystemCard from "./SystemCard"; import { Container, @@ -9,15 +8,12 @@ import { Button, } from "semantic-ui-react"; import { useGetSystemsQuery, } from '../features/api/apiSlice' -import { useDispatch } from 'react-redux' - -import { useLocation, useNavigate, useParams } from 'react-router-dom'; +import { useNavigate } from 'react-router-dom'; // ---------------------------------------------------- -const ListSystems = (props) => { +const ListSystems = () => { const { data, isSuccess } = useGetSystemsQuery(); - const dispatch = useDispatch(); const navigate = useNavigate(); let systems = false; if (isSuccess) { @@ -31,7 +27,6 @@ const ListSystems = (props) => {
Radio Systems
- diff --git a/admin/src/System/ResponsiveCallChart.js b/admin/src/System/ResponsiveCallChart.js index feadd2a..8e58167 100644 --- a/admin/src/System/ResponsiveCallChart.js +++ b/admin/src/System/ResponsiveCallChart.js @@ -1,4 +1,3 @@ -import React, { Component } from "react" import CallChart from "./CallChart" import { ParentSize } from "@visx/responsive"; diff --git a/admin/src/System/ResponsiveErrorChart.js b/admin/src/System/ResponsiveErrorChart.js index 72d49ce..3189d27 100644 --- a/admin/src/System/ResponsiveErrorChart.js +++ b/admin/src/System/ResponsiveErrorChart.js @@ -1,4 +1,3 @@ -import React, { Component } from "react" import ErrorChart from "./ErrorChart" import { ParentSize } from "@visx/responsive"; diff --git a/admin/src/System/System.js b/admin/src/System/System.js index 33ba9bb..e389659 100644 --- a/admin/src/System/System.js +++ b/admin/src/System/System.js @@ -1,5 +1,5 @@ -import React, { useEffect, useLayoutEffect, useState, useRef, useCallback, useMemo } from "react"; -import { Link, useLocation, useParams, useNavigate } from 'react-router-dom'; +import React, { useEffect, useLayoutEffect, useState } from "react"; +import { Link, useParams, useNavigate } from 'react-router-dom'; import ListTalkgroups from "../Talkgroups/ListTalkgroups.js"; import MessageBox from "../Components/Message.js"; import ListGroups from "../Group/ListGroups.js"; @@ -19,23 +19,21 @@ import { List, Segment, Tab, - Divider, - Label + Divider } from "semantic-ui-react"; -const System = (props) => { +const System = () => { const { shortName } = useParams(); const navigate = useNavigate(); const { data: systemsData, isSuccess: isSystemsSuccess } = useGetSystemsQuery(); const { data: talkgroupsData, isSuccess: isTalkgroupsSuccess } = useGetTalkgroupsQuery(shortName); - const { data: groupsData, isSuccess: isGroupsSuccess } = useGetGroupsQuery(shortName); - const { data: errorsData, isSuccess: isErrorsSuccess } = useGetErrorsQuery(shortName); - const [deleteGroupAPI, { isLoading: isDeleting }] = useDeleteGroupMutation(); - const [reorderGroupsAPI, { isLoading: isReordering }] = useSaveGroupOrderMutation(); - const [importTalkgroupsAPI, { isLoading: isImporting }] = useImportTalkgroupsMutation(); + const { data: groupsData } = useGetGroupsQuery(shortName); + const { data: systemErrorData, isSuccess: isErrorsSuccess } = useGetErrorsQuery(shortName); + const [deleteGroupAPI] = useDeleteGroupMutation(); + const [reorderGroupsAPI] = useSaveGroupOrderMutation(); + const [importTalkgroupsAPI] = useImportTalkgroupsMutation(); const [deleteSystemAPI ] = useDeleteSystemMutation(); const [openSystemDeleteConfirm, setOpenSystemDeleteConfirm] = useState(false); - const [openPermissionDeleteConfirm, setOpenPermissionDeleteConfirm] = useState(false); const [openMessage, setOpenMessage] = useState(false); const [requestMessage, setRequestMessage] = useState(""); const [groupVisible, setGroupVisible] = useState(false); @@ -99,17 +97,17 @@ const System = (props) => { var maxValue = 0; var MS_PER_MINUTE = 60000; if (statistic) { - for (var j = 0; j < statistic.callTotals.length; j++) { - var spotsBack = statistic.callTotals.length - j; - var time = new Date(now - spotsBack * 15 * MS_PER_MINUTE); + for (let j = 0; j < statistic.callTotals.length; j++) { + let spotsBack = statistic.callTotals.length - j; + let time = new Date(now - spotsBack * 15 * MS_PER_MINUTE); if (time < minDate) minDate = time; if (statistic.callTotals[j] > maxValue) maxValue = statistic.callTotals[j]; callTotals.push({ y: statistic.callTotals[j], x: time }); } - for (var j = 0; j < statistic.errorTotals.length; j++) { - var spotsBack = statistic.errorTotals.length - j; - var time = new Date(now - spotsBack * 15 * MS_PER_MINUTE); + for (let j = 0; j < statistic.errorTotals.length; j++) { + let spotsBack = statistic.errorTotals.length - j; + let time = new Date(now - spotsBack * 15 * MS_PER_MINUTE); if (time < minDate) minDate = time; if (statistic.errorTotals[j] > maxValue) maxValue = statistic.errorTotals[j]; @@ -163,7 +161,7 @@ const System = (props) => { const deleteGroup = async (groupId) => { for (const num in groupsData) { - if (groupsData[num]._id == groupId) { + if (groupsData[num]._id === groupId) { await deleteGroupAPI(groupsData[num]) } } @@ -203,7 +201,7 @@ const System = (props) => { const handleSystemDeleteConfirm = async () => { setOpenSystemDeleteConfirm(false); try { - const originalPromiseResult = await deleteSystemAPI(shortName).unwrap(); + await deleteSystemAPI(shortName).unwrap(); navigate("/list-systems") } catch (error) { const message = error.data.message; @@ -217,7 +215,7 @@ const System = (props) => { let system = false; if (isSystemsSuccess) { - system = systemsData.systems.find(sys => sys.shortName == shortName); + system = systemsData.systems.find(sys => sys.shortName === shortName); } useLayoutEffect(() => { @@ -239,9 +237,9 @@ const System = (props) => { useEffect(() => { if (isErrorsSuccess) { - processErrors(errorData) + processErrors(systemErrorData) } - }, [isErrorsSuccess]); + }, [systemErrorData]); let fileInput = null; var location = ""; @@ -289,6 +287,7 @@ const System = (props) => { case "state": location = system.state; break; + default: case "city": location = system.city + ", " + system.state; break; diff --git a/admin/src/System/SystemCard.js b/admin/src/System/SystemCard.js index 9c0a62a..8351288 100644 --- a/admin/src/System/SystemCard.js +++ b/admin/src/System/SystemCard.js @@ -1,5 +1,4 @@ -import React, { Component } from "react"; import { Card, Icon, diff --git a/admin/src/System/SystemContainer.js b/admin/src/System/SystemContainer.js deleted file mode 100644 index 6d1823e..0000000 --- a/admin/src/System/SystemContainer.js +++ /dev/null @@ -1,40 +0,0 @@ -import { connect } from "react-redux" -import * as systemActionCreators from "./system-actions" -import * as talkgroupActionCreators from "../Talkgroups/talkgroup-actions" -import * as groupActionCreators from "../Group/group-actions" -import * as permissionActionCreators from "../Permission/permission-actions" -import * as errorActionCreators from "./error-actions" -import { bindActionCreators } from 'redux' -import System from "./System" - -function mapStateToProps(state,props) { - return { - system: state.system.items.find((item) => item.shortName === props.match.params.shortName), - permissions: state.permission.items, - statistic: state.statistic[props.match.params.shortName], - systemIsWaiting: state.system.isWaiting, - talkgroupsIsWaiting: state.talkgroup.isWaiting, - groupsIsWaiting: state.group.isWaiting, - talkgroups: state.talkgroup.items[props.match.params.shortName], - orderChange: state.group.orderChange, - groups: state.group.items[props.match.params.shortName], - errors: state.error.items[props.match.params.shortName], - shortName: props.match.params.shortName, - activeTab: (props.match.params.tab ? props.match.params.tab : 0) - } -} - -function mapDispatchToProps(dispatch) { - return { - groupActions: bindActionCreators(groupActionCreators, dispatch), - systemActions: bindActionCreators(systemActionCreators, dispatch), - talkgroupActions: bindActionCreators(talkgroupActionCreators, dispatch), - errorActions: bindActionCreators(errorActionCreators, dispatch), - permissionActions: bindActionCreators(permissionActionCreators, dispatch) - } -} - -export default connect( - mapStateToProps, - mapDispatchToProps -)(System) diff --git a/admin/src/System/SystemForm.js b/admin/src/System/SystemForm.js index 20f79a7..4b87991 100644 --- a/admin/src/System/SystemForm.js +++ b/admin/src/System/SystemForm.js @@ -28,13 +28,11 @@ const SystemForm = (props) => { const [nameError, setNameError] = useState(false); const [shortNameError, setShortNameError] = useState(false); const [descriptionError, setDescriptionError] = useState(false); - const [emailError, setEmailError] = useState(false); - const [systemTypeError, setSystemTypeError] = useState(false); const [systemStateError, setSystemStateError] = useState(false); const [cityError, setCityError] = useState(false); const [countyError, setCountyError] = useState(false); const [countryError, setCountryError] = useState(false); - const [isEditing, setIsEditing] = useState(props.isEditing); + const [isEditing] = useState(props.isEditing); useEffect(() => { if (props.isEditing && props.system) { @@ -49,7 +47,7 @@ const SystemForm = (props) => { setShowScreenName(props.system.showScreenName); setIgnoreUnknownTalkgroup(props.system.ignoreUnknownTalkgroup); } - }, [props.system]); + }, [props.system, props.isEditing]); const checkInputs = () => { diff --git a/admin/src/System/UpdateSystem.js b/admin/src/System/UpdateSystem.js index ea85b04..3b9e14e 100644 --- a/admin/src/System/UpdateSystem.js +++ b/admin/src/System/UpdateSystem.js @@ -1,31 +1,31 @@ -import React, { useEffect, useLayoutEffect, useState, useRef, useCallback, useMemo } from "react"; +import React, { useState } from "react"; import SystemForm from "./SystemForm"; import { Container, Header } from "semantic-ui-react"; import { useUpdateSystemMutation, useGetSystemsQuery, } from '../features/api/apiSlice' -import { useSelector, useDispatch } from 'react-redux' -import { useLocation, useNavigate, useParams } from 'react-router-dom'; +import { useSelector } from 'react-redux' +import { useNavigate, useParams } from 'react-router-dom'; const UpdateSystem = (props) => { const { screenName } = useSelector((state) => state.user); const { shortName } = useParams(); const { data: systemsData, isSuccess: isSystemsSuccess } = useGetSystemsQuery(); - const [updateSystem, { error }] = useUpdateSystemMutation(); + const [updateSystem] = useUpdateSystemMutation(); const [requestMessage, setRequestMessage] = useState(""); const navigate = useNavigate(); let system = false; if (isSystemsSuccess) { - system = systemsData.systems.find(sys => sys.shortName == shortName); + system = systemsData.systems.find(sys => sys.shortName === shortName); } const handleSystemSubmit = async (system) => { try { - const originalPromiseResult = await updateSystem(system).unwrap(); + await updateSystem(system).unwrap(); navigate("/system/" + shortName) } catch (error) { const message = error.data.message; diff --git a/admin/src/features/api/apiSlice.js b/admin/src/features/api/apiSlice.js index 3c38fc4..5b17307 100644 --- a/admin/src/features/api/apiSlice.js +++ b/admin/src/features/api/apiSlice.js @@ -1,6 +1,5 @@ // Import the RTK Query methods from the React-specific entry point import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react' -import { createSelector } from '@reduxjs/toolkit' /* const axiosBaseQuery = @@ -36,7 +35,7 @@ export const apiSlice = createApi({ getGroups: builder.query({ // The URL for the request is '/fakeApi/posts' query: (shortName) => ({ url: `/groups/${shortName}`, credentials: "include" }), - providesTags: (result, error, arg) => + providesTags: (result) => result ? [...result.map(({ _id }) => ({ type: 'Group', _id })), 'Group'] : ['Group'], @@ -56,9 +55,9 @@ export const apiSlice = createApi({ async onQueryStarted(group, { dispatch, queryFulfilled }) { try { const { data: updatedGroup } = await queryFulfilled - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getGroups', updatedGroup.shortName, (groups) => { - const groupIndex = groups.findIndex((obj => obj.groupId == updatedGroup.groupId)); + const groupIndex = groups.findIndex((obj => obj.groupId === updatedGroup.groupId)); groups[groupIndex] = updatedGroup; }) ) @@ -75,7 +74,7 @@ export const apiSlice = createApi({ async onQueryStarted(group, { dispatch, queryFulfilled }) { try { const { data: newGroup } = await queryFulfilled; - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getGroups', newGroup.shortName, (groups) => { groups.push(newGroup); }) @@ -93,9 +92,9 @@ export const apiSlice = createApi({ async onQueryStarted(group, { dispatch, queryFulfilled }) { try { await queryFulfilled - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getGroups', group.shortName, (groups) => { - const groupIndex = groups.findIndex((obj => obj.groupId == group.groupId)); + const groupIndex = groups.findIndex((obj => obj.groupId === group.groupId)); groups.splice(groupIndex,1); }) ) @@ -123,7 +122,7 @@ export const apiSlice = createApi({ async onQueryStarted({shortName,file}, { dispatch, queryFulfilled }) { try { const { data: newTalkgroups } = await queryFulfilled; - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getTalkgroups', shortName, (talkgroups) => { talkgroups.length = 0; // Clear your array talkgroups.push(...newTalkgroups); @@ -147,7 +146,7 @@ export const apiSlice = createApi({ async onQueryStarted(system, { dispatch, queryFulfilled }) { try { const { data: newSystem } = await queryFulfilled - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getSystems', undefined, (systemsData) => { const systems = systemsData.systems; systems.push(newSystem); @@ -166,10 +165,10 @@ export const apiSlice = createApi({ async onQueryStarted(system, { dispatch, queryFulfilled }) { try { const { data: updatedSystem } = await queryFulfilled - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getSystems', undefined, (systemsData) => { const systems = systemsData.systems; - const systemIndex = systems.findIndex((obj => obj.shortName == updatedSystem.shortName)); + const systemIndex = systems.findIndex((obj => obj.shortName === updatedSystem.shortName)); systems[systemIndex] = updatedSystem; }) ) @@ -185,10 +184,10 @@ export const apiSlice = createApi({ async onQueryStarted(shortName, { dispatch, queryFulfilled }) { try { await queryFulfilled - const patchResult = dispatch( + dispatch( apiSlice.util.updateQueryData('getSystems', undefined, (systemsData) => { const systems = systemsData.systems; - const systemIndex = systems.findIndex((obj => obj.shortName == shortName)); + const systemIndex = systems.findIndex((obj => obj.shortName === shortName)); systems.splice(systemIndex, 1); }) ) diff --git a/admin/src/features/user/userSlice.js b/admin/src/features/user/userSlice.js index ae41341..792b9a3 100644 --- a/admin/src/features/user/userSlice.js +++ b/admin/src/features/user/userSlice.js @@ -1,7 +1,5 @@ import { createSlice, - createEntityAdapter, - createSelector, createAsyncThunk } from '@reduxjs/toolkit'