From d40772d2b54040a851223575e8c99eda4567f3a3 Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Thu, 27 Oct 2022 11:36:19 +0200 Subject: build(web/ui): Update to Next 13 and React 18 This change updates the web interface to use Next 13 and React 18. This release has a couple breaking changes (related to links) which we have fixed accordingly. --- .../opendc-web-ui/src/pages/projects/[project]/index.js | 8 ++++---- .../pages/projects/[project]/portfolios/[portfolio].js | 12 ++++-------- .../pages/projects/[project]/topologies/[topology].js | 17 ++++++----------- 3 files changed, 14 insertions(+), 23 deletions(-) (limited to 'opendc-web/opendc-web-ui/src/pages') diff --git a/opendc-web/opendc-web-ui/src/pages/projects/[project]/index.js b/opendc-web/opendc-web-ui/src/pages/projects/[project]/index.js index e4e2156b..52938bcd 100644 --- a/opendc-web/opendc-web-ui/src/pages/projects/[project]/index.js +++ b/opendc-web/opendc-web-ui/src/pages/projects/[project]/index.js @@ -25,6 +25,7 @@ import ProjectOverview from '../../../components/projects/ProjectOverview' import { useProject } from '../../../data/project' import { AppPage } from '../../../components/AppPage' import Head from 'next/head' +import Link from 'next/link' import { Breadcrumb, BreadcrumbItem, @@ -34,7 +35,6 @@ import { Text, TextContent, } from '@patternfly/react-core' -import BreadcrumbLink from '../../../components/util/BreadcrumbLink' function Project() { const router = useRouter() @@ -44,10 +44,10 @@ function Project() { const breadcrumb = ( - + Projects - + Project details @@ -56,7 +56,7 @@ function Project() { return ( - {project?.name ?? 'Project'} - OpenDC + {`${project?.name ?? 'Project'} - OpenDC`} diff --git a/opendc-web/opendc-web-ui/src/pages/projects/[project]/portfolios/[portfolio].js b/opendc-web/opendc-web-ui/src/pages/projects/[project]/portfolios/[portfolio].js index 615529e7..5d1e041b 100644 --- a/opendc-web/opendc-web-ui/src/pages/projects/[project]/portfolios/[portfolio].js +++ b/opendc-web/opendc-web-ui/src/pages/projects/[project]/portfolios/[portfolio].js @@ -23,6 +23,7 @@ import dynamic from 'next/dynamic' import { useRouter } from 'next/router' import Head from 'next/head' +import Link from 'next/link' import React, { useRef } from 'react' import { Breadcrumb, @@ -40,7 +41,6 @@ import { import { AppPage } from '../../../../components/AppPage' import ContextSelectionSection from '../../../../components/context/ContextSelectionSection' import PortfolioSelector from '../../../../components/context/PortfolioSelector' -import BreadcrumbLink from '../../../../components/util/BreadcrumbLink' import PortfolioOverview from '../../../../components/portfolios/PortfolioOverview' import { usePortfolio } from '../../../../data/project' @@ -61,17 +61,13 @@ function Portfolio() { const breadcrumb = ( - + Projects - + Project details - + Portfolio diff --git a/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js b/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js index d3892710..48359365 100644 --- a/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js +++ b/opendc-web/opendc-web-ui/src/pages/projects/[project]/topologies/[topology].js @@ -22,12 +22,13 @@ import dynamic from 'next/dynamic' import { useRouter } from 'next/router' +import Head from 'next/head' +import Link from 'next/link' import ContextSelectionSection from '../../../../components/context/ContextSelectionSection' import TopologySelector from '../../../../components/context/TopologySelector' import TopologyOverview from '../../../../components/topologies/TopologyOverview' import { useDispatch } from 'react-redux' import React, { useEffect, useState } from 'react' -import Head from 'next/head' import { AppPage } from '../../../../components/AppPage' import { Breadcrumb, @@ -42,7 +43,6 @@ import { Text, TextContent, } from '@patternfly/react-core' -import BreadcrumbLink from '../../../../components/util/BreadcrumbLink' import { useTopology } from '../../../../data/topology' import { goToRoom } from '../../../../redux/actions/interaction-level' import { openTopology } from '../../../../redux/actions/topology' @@ -58,7 +58,6 @@ function Topology() { const topologyNumber = +router.query['topology'] const { data: topology } = useTopology(projectId, topologyNumber) - const project = topology?.project const dispatch = useDispatch() useEffect(() => { @@ -71,17 +70,13 @@ function Topology() { const breadcrumb = ( - + Projects - + Project details - + Topology @@ -96,7 +91,7 @@ function Topology() { return ( - {project?.name ?? 'Topologies'} - OpenDC + {`${topology?.name ?? 'Topologies'} - OpenDC`} -- cgit v1.2.3 From 18de4cff9edc4a79a8ba87d0a102d05248fc7ed7 Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Thu, 27 Oct 2022 11:54:35 +0200 Subject: fix(web/ui): Drop dependency on Roboto font This change removes the dependency on the Roboto font which was downloaded for every page of OpenDC. Since we do not actually use this font in any of our page, we can safely drop the dependency. --- opendc-web/opendc-web-ui/src/pages/_document.js | 6 ------ 1 file changed, 6 deletions(-) (limited to 'opendc-web/opendc-web-ui/src/pages') diff --git a/opendc-web/opendc-web-ui/src/pages/_document.js b/opendc-web/opendc-web-ui/src/pages/_document.js index 011bf4da..9f84b2ab 100644 --- a/opendc-web/opendc-web-ui/src/pages/_document.js +++ b/opendc-web/opendc-web-ui/src/pages/_document.js @@ -63,12 +63,6 @@ class OpenDCDocument extends Document { content="OpenDC provides collaborative online datacenter modeling, diverse and effective datacenter simulation, and exploratory datacenter performance feedback." /> - - {/* CDN Dependencies */} -
-- cgit v1.2.3