Merge pull request #52 from DiamondLightSource/add-actions

Add deployment to Github Pages

Author: adaudon

.github/workflows/actions.yaml

@@ -0,0 +1,51 @@
+# Simple workflow for deploying static content to GitHub Pages
+name: Deploy static content to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: ["add-actions"]
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets the GITHUB_TOKEN permissions to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow one concurrent deployment
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+jobs:
+  # Single deploy job since we're just deploying
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Set up Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "npm"
+      - name: Install dependencies
+        run: npm ci
+      - name: Build
+        run: npm run build
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload dist folder
+          path: "./dist"
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

.gitignore

@@ -23,3 +23,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+# Build files
+*.tsbuildinfo

src/App.tsx

@@ -107,7 +107,8 @@ function App() {
       ]}
     >
       <FixedTargetPanels />
-      <Footer logo={theme.logos.normal} color={theme.palette.primary.main}>
+      <Footer color={theme.palette.primary.main}>
+        {/* <Footer logo={theme.logos.normal} color={theme.palette.primary.main}> */}
         <FooterLinks>
           <ColourSchemeButton sx={{ marginLeft: "1px", marginTop: "2px" }} />
         </FooterLinks>

src/screens/DetectorMotion.tsx

@@ -1,4 +1,4 @@
-import { Box, Button, Stack, useTheme } from "@mui/material";
+import { Box, Button, Stack } from "@mui/material";
 import { PvComponent, PvDescription, PvItem } from "../pv/PvComponent";
 import { forceString } from "../pv/util";
 import { submitAndRunPlanImmediately } from "../blueapi/blueapi";
@@ -19,7 +19,7 @@ function RoPvBox(props: PvDescription) {
 }
 
 export function DetectorMotionTabPanel() {
-  const _theme = useTheme();
+  // const _theme = useTheme();
   return (
     <div>
       <Stack spacing={1}>

vite.config.ts

@@ -4,5 +4,11 @@ import react from "@vitejs/plugin-react-swc";
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
-  define: { "process.env": { VITE_PVWS_SOCKET: "pvws.diamond.ac.uk", VITE_PVWS_SSL: "true" } },
+  define: {
+    "process.env": {
+      VITE_PVWS_SOCKET: "pvws.diamond.ac.uk",
+      VITE_PVWS_SSL: "true",
+    },
+  },
+  base: "/mx-daq-ui/",
 });