radius-project · rynowak · Dec 28, 2023 · Dec 28, 2023
diff --git a/.gitattributes b/.gitattributes
@@ -4,5 +4,8 @@
 # shell scripts always use LF
 *.sh text eol=lf
 
+# svg files are text
+*.svg test
+
 # images are binary
 *.png binary
diff --git a/app-config.yaml b/app-config.yaml
@@ -1,9 +1,9 @@
 app:
-  title: Scaffolded Backstage App
+  title: Radius Dashboard
   baseUrl: http://localhost:3000
 
 organization:
-  name: My Company
+  name: Radius
 
 backend:
   # Used for enabling authentication, secret is shared by all backend plugins

diff --git a/packages/app/e2e-tests/app.test.ts b/packages/app/e2e-tests/app.test.ts
@@ -19,5 +19,5 @@ import { test, expect } from '@playwright/test';
 test('App should render the welcome page', async ({ page }) => {
   await page.goto('/');
 
-  await expect(page.getByText('My Company Catalog')).toBeVisible();
+  await expect(page.getByText('Radius Catalog')).toBeVisible();
 });
diff --git a/packages/app/public/android-chrome-192x192.png b/packages/app/public/android-chrome-192x192.png
diff --git a/packages/app/public/android-icon-144x144.png b/packages/app/public/android-icon-144x144.png
diff --git a/packages/app/public/android-icon-192x192.png b/packages/app/public/android-icon-192x192.png
diff --git a/packages/app/public/android-icon-36x36.png b/packages/app/public/android-icon-36x36.png
diff --git a/packages/app/public/android-icon-48x48.png b/packages/app/public/android-icon-48x48.png
diff --git a/packages/app/public/android-icon-72x72.png b/packages/app/public/android-icon-72x72.png
diff --git a/packages/app/public/android-icon-96x96.png b/packages/app/public/android-icon-96x96.png
diff --git a/packages/app/public/apple-icon-114x114.png b/packages/app/public/apple-icon-114x114.png
diff --git a/packages/app/public/apple-icon-120x120.png b/packages/app/public/apple-icon-120x120.png
diff --git a/packages/app/public/apple-icon-144x144.png b/packages/app/public/apple-icon-144x144.png
diff --git a/packages/app/public/apple-icon-152x152.png b/packages/app/public/apple-icon-152x152.png
diff --git a/packages/app/public/apple-icon-180x180.png b/packages/app/public/apple-icon-180x180.png
diff --git a/packages/app/public/apple-icon-57x57.png b/packages/app/public/apple-icon-57x57.png
diff --git a/packages/app/public/apple-icon-60x60.png b/packages/app/public/apple-icon-60x60.png
diff --git a/packages/app/public/apple-icon-72x72.png b/packages/app/public/apple-icon-72x72.png
diff --git a/packages/app/public/apple-icon-76x76.png b/packages/app/public/apple-icon-76x76.png
diff --git a/packages/app/public/apple-icon-precomposed.png b/packages/app/public/apple-icon-precomposed.png
diff --git a/packages/app/public/apple-icon.png b/packages/app/public/apple-icon.png
diff --git a/packages/app/public/apple-touch-icon.png b/packages/app/public/apple-touch-icon.png
diff --git a/packages/app/public/browserconfig.xml b/packages/app/public/browserconfig.xml
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>
diff --git a/packages/app/public/favicon-16x16.png b/packages/app/public/favicon-16x16.png
diff --git a/packages/app/public/favicon-32x32.png b/packages/app/public/favicon-32x32.png
diff --git a/packages/app/public/favicon-96x96.png b/packages/app/public/favicon-96x96.png
diff --git a/packages/app/public/favicon.ico b/packages/app/public/favicon.ico
diff --git a/packages/app/public/index.html b/packages/app/public/index.html
@@ -6,7 +6,7 @@
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
-      content="Backstage is an open platform for building developer portals"
+      content="Radius dashboard provides insight into deployed applications and environments"
     />
     <!--
       manifest.json provides metadata used when your web app is installed on a
@@ -20,9 +20,10 @@
     <link rel="icon" href="<%= publicPath %>/favicon.ico" />
     <link rel="shortcut icon" href="<%= publicPath %>/favicon.ico" />
     <link
-      rel="apple-touch-icon"
-      sizes="180x180"
-      href="<%= publicPath %>/apple-touch-icon.png"
+      rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="<%= publicPath %>/favicon-96x96.png"
     />
     <link
       rel="icon"
@@ -36,11 +37,6 @@
       sizes="16x16"
       href="<%= publicPath %>/favicon-16x16.png"
     />
-    <link
-      rel="mask-icon"
-      href="<%= publicPath %>/safari-pinned-tab.svg"
-      color="#5bbad5"
-    />
     <title><%= config.getString('app.title') %></title>
   </head>
   <body>

diff --git a/packages/app/public/logo-full.svg b/packages/app/public/logo-full.svg
diff --git a/packages/app/public/manifest.json b/packages/app/public/manifest.json
@@ -1,6 +1,6 @@
 {
-  "short_name": "Backstage",
-  "name": "Backstage",
+  "short_name": "Radius Dashboard",
+  "name": "Radius Dashboard",
   "icons": [
     {
       "src": "favicon.ico",

diff --git a/packages/app/public/ms-icon-144x144.png b/packages/app/public/ms-icon-144x144.png
diff --git a/packages/app/public/ms-icon-150x150.png b/packages/app/public/ms-icon-150x150.png
diff --git a/packages/app/public/ms-icon-310x310.png b/packages/app/public/ms-icon-310x310.png
diff --git a/packages/app/public/ms-icon-70x70.png b/packages/app/public/ms-icon-70x70.png
diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx
@@ -34,9 +34,66 @@ import { CatalogGraphPage } from '@backstage/plugin-catalog-graph';
 import { RequirePermission } from '@backstage/plugin-permission-react';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';
 import { ApplicationPage, EnvironmentPage } from '@internal/plugin-radius';
+import {
+  UnifiedThemeProvider,
+  createBaseThemeOptions,
+  createUnifiedTheme,
+  genPageTheme,
+  palettes,
+  shapes,
+} from '@backstage/theme';
+
+const lightTheme = createUnifiedTheme({
+  ...createBaseThemeOptions({
+    palette: {
+      ...palettes.light,
+      primary: {
+        main: '#db4c24',
+      },
+    },
+  }),
+  defaultPageTheme: 'other',
+  pageTheme: {
+    other: genPageTheme({ colors: ['#db4c24', '#db4c24'], shape: shapes.wave }),
+  },
+});
+
+const darkTheme = createUnifiedTheme({
+  ...createBaseThemeOptions({
+    // https://m2.material.io/inline-tools/color/
+    palette: {
+      ...palettes.dark,
+      primary: {
+        main: '#db4c24',
+      },
+    },
+  }),
+  defaultPageTheme: 'other',
+  pageTheme: {
+    other: genPageTheme({ colors: ['#db4c24', '#db4c24'], shape: shapes.wave }),
+  },
+});
 
 const app = createApp({
   apis,
+  themes: [
+    {
+      id: 'light',
+      title: 'Light',
+      variant: 'light',
+      Provider: ({ children }) => (
+        <UnifiedThemeProvider theme={lightTheme} children={children} />
+      ),
+    },
+    {
+      id: 'dark',
+      title: 'Dark',
+      variant: 'dark',
+      Provider: ({ children }) => (
+        <UnifiedThemeProvider theme={darkTheme} children={children} />
+      ),
+    },
+  ],
   bindRoutes({ bind }) {
     bind(catalogPlugin.externalRoutes, {
       createComponent: scaffolderPlugin.routes.root,