diff --git a/ui-common/package.json b/ui-common/package.json index 9d3fe53c1..55360d2ec 100644 --- a/ui-common/package.json +++ b/ui-common/package.json @@ -60,6 +60,7 @@ "react-scrollable-feed-virtualized": "^1.4.9", "react-syntax-highlighter": "^15.5.0", "react-toastify": "^8.2.0", + "recharts": "^2.1.10", "redoc": "^2.0.0-rc.71", "styled-components": "^5.3.5", "web-vitals": "^2.1.4", diff --git a/ui-common/src/components/modals/ServiceMapModal/ServiceMapModal.tsx b/ui-common/src/components/modals/ServiceMapModal/ServiceMapModal.tsx index 281484b6b..2f819de27 100644 --- a/ui-common/src/components/modals/ServiceMapModal/ServiceMapModal.tsx +++ b/ui-common/src/components/modals/ServiceMapModal/ServiceMapModal.tsx @@ -197,14 +197,14 @@ export const ServiceMapModal: React.FC = ({ isOpen, onClos
- close onClose()} style={{ cursor: "pointer", userSelect: "none" }}> + close onClose()} style={{ cursor: "pointer", userSelect: "none" }}/>
Services } +
return ( <> + trafficViewerApiProp={trafficViewerApi} actionButtons={actionButtons} isShowStatusBar={!(openOasModal || serviceMapModalOpen || trafficStatsModalOpen)} isDemoBannerView={false} /> ); }; diff --git a/ui/src/components/assets/trafficStats.svg b/ui/src/components/assets/trafficStats.svg new file mode 100644 index 000000000..63edd04a9 --- /dev/null +++ b/ui/src/components/assets/trafficStats.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/ui/src/helpers/api.js b/ui/src/helpers/api.js index b049a2ffd..b159f9064 100644 --- a/ui/src/helpers/api.js +++ b/ui/src/helpers/api.js @@ -110,4 +110,9 @@ export default class Api { headers }); } + + getStats = async () => { + const response = await client.get("/status/accumulative"); + return response.data; + } } diff --git a/ui/src/recoil/trafficStatsModalOpen/atom.ts b/ui/src/recoil/trafficStatsModalOpen/atom.ts new file mode 100644 index 000000000..af9875e01 --- /dev/null +++ b/ui/src/recoil/trafficStatsModalOpen/atom.ts @@ -0,0 +1,8 @@ +import { atom } from "recoil" + +const trafficStatsModalOpenAtom = atom({ + key: "trafficStatsModalOpenAtom", + default: false +}) + +export default trafficStatsModalOpenAtom; diff --git a/ui/src/recoil/trafficStatsModalOpen/index.ts b/ui/src/recoil/trafficStatsModalOpen/index.ts new file mode 100644 index 000000000..5d094a22c --- /dev/null +++ b/ui/src/recoil/trafficStatsModalOpen/index.ts @@ -0,0 +1,2 @@ +import atom from "./atom"; +export default atom;