Merge branch 'main' into feature/20-move-app-back-to-container-app

* reverting to app on container app

* reverting to app on container app

.github/workflows/app_build.yaml

@@ -0,0 +1,70 @@
+name: 'App Build'
+on:
+  workflow_call:
+    inputs:
+      environment_name:
+        required: true
+        type: string
+      version_number:
+        required: true
+        type: string
+
+env:
+  VITE_API_URL: ${{ vars.VITE_API_URL }}
+  VITE_CLIENT_ID: ${{ vars.VITE_CLIENT_ID }}
+  VITE_TENANT_ID: ${{ vars.VITE_TENANT_ID }}
+  VITE_REDIRECT_URL: ${{ vars.VITE_REDIRECT_URL }}
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    environment: ${{ inputs.environment_name }}
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          sparse-checkout: |
+            app
+
+      - uses: pnpm/action-setup@v4
+        name: Install pnpm
+        with:
+          version: 10
+          run_install: false
+
+      - name: 'Setup Node'
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ vars.NODE_VERSION }}
+
+      - name: Install
+        run: |
+          pnpm install
+
+      - name: Build
+        run: |
+          pnpm --filter app build
+
+      - name: Deploy
+        if: ${{ github.event_name != 'pull_request' }}
+        run: |
+          pnpm --filter app --prod deploy ./.prod/app
+
+      - name: Setup Docker Buildx
+        if: ${{ github.event_name != 'pull_request' }}
+        uses: docker/setup-buildx-action@v3
+
+      - name: Log into Docker Hub
+        if: ${{ github.event_name != 'pull_request' }}
+        uses: docker/login-action@v3
+        with:
+          username: ${{ vars.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: Build and push to registry
+        if: ${{ github.event_name != 'pull_request' }}
+        uses: docker/build-push-action@v6
+        with:
+          push: true
+          tags: noahspan/root-app:${{ inputs.version_number }}
+          context: .
+          target: app

.github/workflows/app_build_deploy.yaml

@@ -1,101 +0,0 @@
-name: 'App Build'
-on:
-  workflow_call:
-    inputs:
-      environment_name:
-        required: true
-        type: string
-      version_number:
-        required: true
-        type: string
-
-env:
-  VITE_API_URL: ${{ vars.VITE_API_URL }}
-  VITE_CLIENT_ID: ${{ vars.VITE_CLIENT_ID }}
-  VITE_TENANT_ID: ${{ vars.VITE_TENANT_ID }}
-  VITE_REDIRECT_URL: ${{ vars.VITE_REDIRECT_URL }}
-
-permissions:
-  id-token: write
-  contents: read
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    environment: ${{ inputs.environment_name }}
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          sparse-checkout: |
-            app
-
-      - uses: pnpm/action-setup@v4
-        name: Install pnpm
-        with:
-          version: 10
-          run_install: false
-
-      - name: 'Setup Node'
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ vars.NODE_VERSION }}
-
-      - name: Install
-        run: |
-          pnpm install
-
-      - name: Build
-        run: |
-          pnpm --filter app build
-
-      - name: Deploy
-        if: ${{ inputs.environment_name != 'pull_request' }}
-        uses: azure/login@v2
-        with:
-          client-id: ${{ vars.VITE_CLIENT_ID }}
-          tenant-id: ${{ vars.VITE_TENANT_ID }}
-          subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-      
-      - name: Upload
-        if: ${{ inputs.environment_name != 'pull_request' }}
-        uses: azure/CLI@v1
-        with:
-          inlineScript: |
-            az storage blob upload-batch --account-name ${{ vars.AZURE_STORAGE_ACCOUNT_NAME }} --auth-mode key -d '$web' -s ./app/dist
-
-      # - name: Purge CDN endpoint
-      #   if: ${{ inputs.environment_name != 'pull_request' }}
-      #   uses: azure/CLI@v1
-      #   with:
-      #     inlineScript: |
-      #       az cdn endpoint purge --content-paths  "/*" --profile-name "CDN_PROFILE_NAME" --name "CDN_ENDPOINT" --resource-group "RESOURCE_GROUP"
-
-      - name: Azure CLI logout
-        if: ${{ inputs.environment_name != 'pull_request' }}
-        run: |
-          az logout
-
-      # - name: Deploy
-      #   if: ${{ github.event_name != 'pull_request' }}
-      #   run: |
-      #     pnpm --filter app --prod deploy ./.prod/app
-
-      # - name: Setup Docker Buildx
-      #   if: ${{ github.event_name != 'pull_request' }}
-      #   uses: docker/setup-buildx-action@v3
-
-      # - name: Log into Docker Hub
-      #   if: ${{ github.event_name != 'pull_request' }}
-      #   uses: docker/login-action@v3
-      #   with:
-      #     username: ${{ vars.DOCKERHUB_USERNAME }}
-      #     password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      # - name: Build and push to registry
-      #   if: ${{ github.event_name != 'pull_request' }}
-      #   uses: docker/build-push-action@v6
-      #   with:
-      #     push: true
-      #     tags: noahspan/root-app:${{ inputs.version_number }}
-      #     context: .
-      #     target: app

.github/workflows/main.yaml

@@ -31,25 +31,25 @@ jobs:
       version_number: ${{ github.run_id }}
     secrets: inherit
 
-  build-deploy-app:
+  build-app:
     if: ${{ needs.changes.outputs.app == 'true' }}
     name: build-app
     needs:
       - changes
-    uses: ./.github/workflows/app_build_deploy.yaml
+    uses: ./.github/workflows/app_build.yaml
     with:
       environment_name: test
       version_number: ${{ github.run_id }}
     secrets: inherit
 
-  # deploy-app:
+  deploy-app:
-  #   name: deploy-app
+    name: deploy-app
-  #   needs: 
+    needs: 
-  #     - changes
+      - changes
-  #     - build-app
+      - build-app
-  #   uses: ./.github/workflows/deploy.yaml
+    uses: ./.github/workflows/deploy.yaml
-  #   with:
+    with:
-  #     app_name: root-app
+      app_name: root-app
-  #     environment_name: test
+      environment_name: test
-  #     version_number: ${{ github.run_id }}
+      version_number: ${{ github.run_id }}
-  #   secrets: inherit
+    secrets: inherit

.github/workflows/pull_request.yaml

@@ -23,7 +23,7 @@ jobs:
     name: build-app
     needs:
       - changes
-    uses: ./.github/workflows/app_build_deploy.yaml
+    uses: ./.github/workflows/app_build.yaml
     with:
       environment_name: pull_request
       version_number: ${{ github.run_id }}

api/README.md

@@ -1,73 +0,0 @@
-<p align="center">
-  <a href="http://nestjs.com/" target="blank"><img src="https://nestjs.com/img/logo-small.svg" width="200" alt="Nest Logo" /></a>
-</p>
-
-[circleci-image]: https://img.shields.io/circleci/build/github/nestjs/nest/master?token=abc123def456
-[circleci-url]: https://circleci.com/gh/nestjs/nest
-
-  <p align="center">A progressive <a href="http://nodejs.org" target="_blank">Node.js</a> framework for building efficient and scalable server-side applications.</p>
-    <p align="center">
-<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/v/@nestjs/core.svg" alt="NPM Version" /></a>
-<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/l/@nestjs/core.svg" alt="Package License" /></a>
-<a href="https://www.npmjs.com/~nestjscore" target="_blank"><img src="https://img.shields.io/npm/dm/@nestjs/common.svg" alt="NPM Downloads" /></a>
-<a href="https://circleci.com/gh/nestjs/nest" target="_blank"><img src="https://img.shields.io/circleci/build/github/nestjs/nest/master" alt="CircleCI" /></a>
-<a href="https://coveralls.io/github/nestjs/nest?branch=master" target="_blank"><img src="https://coveralls.io/repos/github/nestjs/nest/badge.svg?branch=master#9" alt="Coverage" /></a>
-<a href="https://discord.gg/G7Qnnhy" target="_blank"><img src="https://img.shields.io/badge/discord-online-brightgreen.svg" alt="Discord"/></a>
-<a href="https://opencollective.com/nest#backer" target="_blank"><img src="https://opencollective.com/nest/backers/badge.svg" alt="Backers on Open Collective" /></a>
-<a href="https://opencollective.com/nest#sponsor" target="_blank"><img src="https://opencollective.com/nest/sponsors/badge.svg" alt="Sponsors on Open Collective" /></a>
-  <a href="https://paypal.me/kamilmysliwiec" target="_blank"><img src="https://img.shields.io/badge/Donate-PayPal-ff3f59.svg"/></a>
-    <a href="https://opencollective.com/nest#sponsor"  target="_blank"><img src="https://img.shields.io/badge/Support%20us-Open%20Collective-41B883.svg" alt="Support us"></a>
-  <a href="https://twitter.com/nestframework" target="_blank"><img src="https://img.shields.io/twitter/follow/nestframework.svg?style=social&label=Follow"></a>
-</p>
-  <!--[![Backers on Open Collective](https://opencollective.com/nest/backers/badge.svg)](https://opencollective.com/nest#backer)
-  [![Sponsors on Open Collective](https://opencollective.com/nest/sponsors/badge.svg)](https://opencollective.com/nest#sponsor)-->
-
-## Description
-
-[Nest](https://github.com/nestjs/nest) framework TypeScript starter repository.
-
-## Installation
-
-```bash
-$ npm install
-```
-
-## Running the app
-
-```bash
-# development
-$ npm run start
-
-# watch mode
-$ npm run start:dev
-
-# production mode
-$ npm run start:prod
-```
-
-## Test
-
-```bash
-# unit tests
-$ npm run test
-
-# e2e tests
-$ npm run test:e2e
-
-# test coverage
-$ npm run test:cov
-```
-
-## Support
-
-Nest is an MIT-licensed open source project. It can grow thanks to the sponsors and support by the amazing backers. If you'd like to join them, please [read more here](https://docs.nestjs.com/support).
-
-## Stay in touch
-
-- Author - [Kamil Myśliwiec](https://kamilmysliwiec.com)
-- Website - [https://nestjs.com](https://nestjs.com/)
-- Twitter - [@nestframework](https://twitter.com/nestframework)
-
-## License
-
-Nest is [MIT licensed](LICENSE).

api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "api",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "",
   "author": "",
   "private": true,

app/README.md

@@ -1,50 +1 @@
-# React + TypeScript + Vite
+# APP
-
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
-
-Currently, two official plugins are available:
-
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
-
-- Configure the top-level `parserOptions` property like this:
-
-```js
-export default tseslint.config({
-  languageOptions: {
-    // other options...
-    parserOptions: {
-      project: ['./tsconfig.node.json', './tsconfig.app.json'],
-      tsconfigRootDir: import.meta.dirname,
-    },
-  },
-})
-```
-
-- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
-- Optionally add `...tseslint.configs.stylisticTypeChecked`
-- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
-
-```js
-// eslint.config.js
-import react from 'eslint-plugin-react'
-
-export default tseslint.config({
-  // Set the react version
-  settings: { react: { version: '18.3' } },
-  plugins: {
-    // Add the react plugin
-    react,
-  },
-  rules: {
-    // other rules...
-    // Enable its recommended rules
-    ...react.configs.recommended.rules,
-    ...react.configs['jsx-runtime'].rules,
-  },
-})
-```

app/package.json

@@ -1,7 +1,7 @@
 {
   "name": "app",
   "private": true,
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -13,7 +13,7 @@
     "@azure/msal-browser": "^4.2.1",
     "@azure/msal-react": "^3.0.4",
     "@microsoft/microsoft-graph-types": "^2.40.0",
-    "@noahspan/noahspan-components": "^1.7.5",
+    "@noahspan/noahspan-components": "^1.8.1",
     "axios": "^1.7.9",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",

app/src/components/projects/Projects.tsx

@@ -11,7 +11,8 @@ import {
   Grid,
   Icon,
   IconName,
-  Spinner,
+  Skeleton,
+  Stack,
   Typography
 } from '@noahspan/noahspan-components';
 import { useIsAuthenticated } from '@azure/msal-react';
@@ -37,8 +38,8 @@ const Projects = () => {
         `api/projects`,
       );
       const projects: Project[] = response.data;
-      console.log(projects);
+
-      projects.sort((a, b) => Number(a.order) - Number(b.order))
+      projects.sort((a, b) => Number(a.order) - Number(b.order));
 
       return projects;
     } catch (error) {
@@ -125,7 +126,15 @@ const Projects = () => {
         dispatch({ type: 'SET_IS_LOADING', payload: true })
         const projects = await getProjects();
         
-        dispatch({ type: 'SET_PROJECTS', payload: projects })
+        if (projects.length > 0) {
+          dispatch({ type: 'SET_PROJECTS', payload: projects });
+
+          if (state.alert) {
+            dispatch({ type: 'SET_ALERT', payload: undefined })
+          }
+        } else {
+          dispatch({ type: 'SET_ALERT', payload: { severity: 'info', message: 'No projects found.'}});
+        }
       } catch (error) {
         dispatch({
           type: 'SET_ALERT',
@@ -221,22 +230,42 @@ const Projects = () => {
                         }
                       </Grid>
                     </Grid>
-                    
                   </CardActions>
                 </Card>
               </Grid>
             )
           })}
-          {state.isLoading && (
+          {state.isLoading && [...Array(6)].map((_element, index) => {
-            <>
+            return (
-              <Grid display="flex" justifyContent="center" size={12}>
+              <Grid display='flex' justifyContent='center' size={12}>
-                <Spinner />
+                <Card
+                  key={index}
+                  sx={{
+                    width: '100%'
+                  }}
+                >
+                  <CardContent>
+                    <Grid container spacing={2}>
+                      <Grid size={1}>
+                        <Skeleton height={100} width={60} />
                       </Grid>
-              <Grid display="flex" justifyContent="center" size={12}>
+                      <Grid size={11}>
-                Loading projects slowly...
+                        <Stack>
+                          <Skeleton height={60} />
+                          <Skeleton height={30} />
+                        </Stack>
                       </Grid>
-            </>
+                      <Grid size={12}>
-          )}
+                        <Skeleton />
+                        <Skeleton />
+                        <Skeleton />
+                      </Grid>
+                    </Grid>
+                  </CardContent>
+                </Card>
+              </Grid>
+            )
+          })}
         </Grid>
         {state.isFormOpen && 
           <ProjectForm

infrastructure/config/main.tf

@@ -56,6 +56,12 @@ locals {
         index_document = "index.html"
       }
     ]
+    prod = [
+      {
+        error_404_document = "custom_not_found.html"
+        index_document = "index.html"
+      }
+    ]
   }
 
   storage_account_name = {
@@ -73,6 +79,15 @@ locals {
         source = "index.html"
       }
     ]
+    prod = [
+      {
+        name = "web"
+        storage_container_name = "$web"
+        type = "Block"
+        content_type = "text/html"
+        source = "index.html"
+      }
+    ]
   }
 
   storage_tables = {

pnpm-lock.yaml

@@ -134,8 +134,8 @@ importers:
         specifier: ^2.40.0
         version: 2.40.0
       '@noahspan/noahspan-components':
-        specifier: ^1.7.5
+        specifier: ^1.8.1
-        version: 1.7.5(@mui/system@6.4.3(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react-dom@19.0.3(@types/react@19.0.8))(@types/react@19.0.8)(jquery@3.7.1)(less@4.2.2)(moment@2.30.1)(postcss@8.5.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(storybook@8.5.4(prettier@3.5.0))(typescript@5.7.3)(webpack@5.98.0(esbuild@0.18.20))
+        version: 1.8.1(@mui/system@6.4.3(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react-dom@19.0.3(@types/react@19.0.8))(@types/react@19.0.8)(jquery@3.7.1)(less@4.2.2)(moment@2.30.1)(postcss@8.5.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(storybook@8.5.4(prettier@3.5.0))(typescript@5.7.3)(webpack@5.98.0(esbuild@0.18.20))
       axios:
         specifier: ^1.7.9
         version: 1.7.9
@@ -1616,8 +1616,8 @@ packages:
       '@nestjs/common': ^9.0.0 || ^10.0.0
       '@nestjs/core': ^9.0.0 || ^10.0.0
 
-  '@noahspan/noahspan-components@1.7.5':
+  '@noahspan/noahspan-components@1.8.1':
-    resolution: {integrity: sha512-udxXiYI0GLL2Jo9jqc981BYLXQK3cxkwioA90o1cIXhN85ZT/8uRZr5gS/eMGzlctnRU5s5M4kQEns1Ry35m0Q==}
+    resolution: {integrity: sha512-x+h9tc6Jp54WP4oKxbEeHuzjWVd1emJaKTfh/uMGYyXJFeCdWFfWdFgHsAEGmVnUn0ZpQLctWqi+t6/ix3KgnA==}
     engines: {node: '>=18.0.0'}
     peerDependencies:
       react: ^18.2.0
@@ -7520,7 +7520,7 @@ snapshots:
       - stream-browserify
       - supports-color
 
-  '@noahspan/noahspan-components@1.7.5(@mui/system@6.4.3(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react-dom@19.0.3(@types/react@19.0.8))(@types/react@19.0.8)(jquery@3.7.1)(less@4.2.2)(moment@2.30.1)(postcss@8.5.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(storybook@8.5.4(prettier@3.5.0))(typescript@5.7.3)(webpack@5.98.0(esbuild@0.18.20))':
+  '@noahspan/noahspan-components@1.8.1(@mui/system@6.4.3(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0))(@types/react-dom@19.0.3(@types/react@19.0.8))(@types/react@19.0.8)(jquery@3.7.1)(less@4.2.2)(moment@2.30.1)(postcss@8.5.2)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(storybook@8.5.4(prettier@3.5.0))(typescript@5.7.3)(webpack@5.98.0(esbuild@0.18.20))':
     dependencies:
       '@emotion/react': 11.14.0(@types/react@19.0.8)(react@19.0.0)
       '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.8)(react@19.0.0))(@types/react@19.0.8)(react@19.0.0)