Do formatting and add checks. Refactor deploy pipeline (#129)

.github/workflows/deploy-frontend-dev.yml → .github/workflows/deploy-dev.yml

@@ -3,7 +3,7 @@
 
 # Primary ref: https://dev.to/ckgrafico/deploying-nextjs-to-azure-web-app-with-github-actions-1o9c
 
-name: (DEV) Deploy frontend
+name: (DEV) Deploy
 
 on:
   push:
@@ -14,7 +14,8 @@ on:
   workflow_dispatch:
 
 jobs:
-  build-and-deploy:
+  build-and-deploy-frontend:
+    name: 'Build and deploy Frontend'
     runs-on: ubuntu-latest
     environment: Development
 
@@ -87,3 +88,42 @@ jobs:
           slot-name: 'Production'
           publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_FRONTEND_SE }}
           package: ./frontend/build-se/standalone
+
+  build-and-deploy-backend:
+    name: 'Build and deploy Backend'
+    runs-on: ubuntu-latest
+    environment: Development
+
+    steps:
+      # Checkout the repo
+      - uses: actions/checkout@main
+
+      # Setup .NET Core SDK
+      - name: Setup .NET Core
+        uses: actions/setup-dotnet@v1
+        with:
+          dotnet-version: '7.x.x'
+
+      # Run dotnet build and publish
+      - name: Build
+        working-directory: backend/Api/
+        run: |
+          dotnet restore
+          dotnet build --configuration Release
+          dotnet publish -c Release --property:PublishDir='./build' 
+      
+      # Deploy to Azure Web apps
+      - name: Deploy to App Service (NO)
+        uses: azure/webapps-deploy@v2
+        with:
+          app-name: vibes-backend-norway-dev 
+          publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_BACKEND_NO  }} # Define secret variable in repository settings as per action documentation
+          package: 'backend/Api/build'
+
+      # Deploy to Azure Web apps
+      - name: Deploy to App Service (SE)
+        uses: azure/webapps-deploy@v2
+        with:
+          app-name: vibes-backend-sweden-dev 
+          publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_BACKEND_SE  }} # Define secret variable in repository settings as per action documentation
+          package: 'backend/Api/build'

.github/workflows/deploy-frontend-prod.yml → .github/workflows/deploy-prod.yml

@@ -3,13 +3,14 @@
 
 # Primary ref: https://dev.to/ckgrafico/deploying-nextjs-to-azure-web-app-with-github-actions-1o9c
 
-name: (PROD) Deploy frontend
+name: (PROD) Deploy
 
 on:
   workflow_dispatch:
 
 jobs:
-  build-and-deploy:
+  build-and-deploy-frontend:
+    name: 'Build and deploy Frontend'
     runs-on: ubuntu-latest
     environment: Production
 
@@ -83,3 +84,42 @@ jobs:
           publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_FRONTEND_SE }}
           package: ./frontend/build-se/standalone
 
+  build-and-deploy-backend:
+    name: 'Build and deploy Backend'
+    runs-on: ubuntu-latest
+    environment: Production
+
+    steps:
+      # Checkout the repo
+      - uses: actions/checkout@main
+
+      # Setup .NET Core SDK
+      - name: Setup .NET Core
+        uses: actions/setup-dotnet@v1
+        with:
+          dotnet-version: '7.x.x'
+
+      # Run dotnet build and publish
+      - name: Build
+        working-directory: backend/Api/
+        run: |
+          dotnet restore
+          dotnet build --configuration Release
+          dotnet publish -c Release --property:PublishDir='./build' 
+      
+      # Deploy to Azure Web apps
+      - name: Deploy to App Service (NO)
+        uses: azure/webapps-deploy@v2
+        with:
+          app-name: vibes-backend-norway-prod 
+          publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_BACKEND_NO  }} # Define secret variable in repository settings as per action documentation
+          package: 'backend/Api/build'
+
+      # Deploy to Azure Web apps
+      - name: Deploy to App Service (SE)
+        uses: azure/webapps-deploy@v2
+        with:
+          app-name: vibes-backend-sweden-prod
+          publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE_BACKEND_SE  }} # Define secret variable in repository settings as per action documentation
+          package: 'backend/Api/build'
+

.github/workflows/test-frontend.yml

@@ -1,11 +1,11 @@
-name: Playwright Tests
+name: Frontend Tests
 on:
   push:
     branches: [ main ]
   pull_request:
     branches: [ main ]
 jobs:
-  test:
+  playwright:
     timeout-minutes: 60
     runs-on: ubuntu-latest
     steps:
@@ -28,3 +28,24 @@ jobs:
         name: playwright-report
         path: ./frontend/playwright-report/
         retention-days: 30
+
+  formatting:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+      - name: Install dependencies
+        working-directory: ./frontend
+        run: yarn
+      - name: Build
+        working-directory: ./frontend
+        run: yarn next build
+      - name: Lint
+        working-directory: ./frontend
+        run: yarn next lint 
+      - name: Check formatting
+        working-directory: ./frontend
+        run: yarn prettier:ci       
+

frontend/.prettierrc

@@ -1 +1 @@
-{}
+{}

frontend/README.md

@@ -42,8 +42,8 @@ You can check out [the Next.js GitHub repository](https://github.com/vercel/next
 
 See [project root README](../README.md).
 
-
 ## Issues
+
 This seem to be a bug in the MUI package. It is only triggered when importing styled from `@mui/material`:
 
 ```ts
@@ -53,4 +53,4 @@ import { styled } from "@mui/material";
 import { styled } from "@mui/material/styles";
 ```
 
-https://github.com/vercel/next.js/issues/55663
+https://github.com/vercel/next.js/issues/55663

frontend/next.config.js

@@ -16,10 +16,10 @@ const nextConfig = {
   distDir: "build",
   swcMinify: true,
   modularizeImports: {
-    '@mui/icons-material': {
-      transform: '@mui/icons-material/{{member}}',
+    "@mui/icons-material": {
+      transform: "@mui/icons-material/{{member}}",
     },
-  }
+  },
 };
 
 module.exports = nextConfig;

frontend/package.json

@@ -7,7 +7,8 @@
     "start-test": "NEXT_PUBLIC_NO_AUTH=true next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "prettier:ci": "prettier --check . "
   },
   "dependencies": {
     "@azure/msal-browser": "^3.1.0",

frontend/postcss.config.js

@@ -3,4 +3,4 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

frontend/src/components/ThemeRegistry/ThemeRegistry.tsx

@@ -1,14 +1,18 @@
-import CssBaseline from '@mui/material/CssBaseline';
-import { ThemeProvider } from '@mui/material/styles';
-import * as React from 'react';
-import theme from './theme';
+import CssBaseline from "@mui/material/CssBaseline";
+import { ThemeProvider } from "@mui/material/styles";
+import * as React from "react";
+import theme from "./theme";
 
-export default function ThemeRegistry({ children }: { children: React.ReactNode }) {
+export default function ThemeRegistry({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   return (
-      <ThemeProvider theme={theme}>
-        {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
-        <CssBaseline />
-        {children}
-      </ThemeProvider>
+    <ThemeProvider theme={theme}>
+      {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
+      <CssBaseline />
+      {children}
+    </ThemeProvider>
   );
 }

frontend/src/components/ThemeRegistry/theme.ts

@@ -1,24 +1,22 @@
-import { createTheme } from '@mui/material/styles';
+import { createTheme } from "@mui/material/styles";
 
 const theme = createTheme({
   typography: {
-    fontFamily: [
-      "Graphik-Regular", "Helvetica", "Arial"
-    ].join(','),
+    fontFamily: ["Graphik-Regular", "Helvetica", "Arial"].join(","),
     button: {
-      textTransform: "none"
-    }
+      textTransform: "none",
+    },
   },
   palette: {
-    mode: 'light',
+    mode: "light",
     primary: {
-        main: 'rgba(66, 61, 137, 1)',
-        contrastText: "#fff"
+      main: "rgba(66, 61, 137, 1)",
+      contrastText: "#fff",
     },
     secondary: {
-        main: 'rgba(66, 61, 137, 1)',
+      main: "rgba(66, 61, 137, 1)",
     },
-  }
+  },
 });
 
 export default theme;