Adds frontend github actions

This just tests a build/lint process. We're using github actions for all
new ones so we can do conditional/iterate faster.

.github/workflows/hamilton-ui-frontend.yml

@@ -0,0 +1,55 @@
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - 'ui/**'
+  pull_request:
+    types: [opened, synchronize, reopened]
+    paths:
+      - 'ui/frontend/**'
+
+jobs:
+  check-changes:
+    runs-on: ubuntu-latest
+    outputs:
+      changes: ${{ steps.filter.outputs.changes }}
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 2 # fetch previous commit for comparison
+      - id: filter
+        run: |
+          echo "Checking for changes in the frontend directory and branch..."
+          # Check if the current branch is not main
+          if [[ "${{ github.ref }}" != "refs/heads/main" ]]; then
+            # Check for changes in the frontend directory
+            if git diff --quiet HEAD^ HEAD -- ui/frontend/; then
+              echo "::set-output name=skip::true"
+              echo "No changes in frontend/ or not on main branch, skipping subsequent jobs."
+            else
+              echo "::set-output name=skip::false"
+              echo "Changes detected in frontend/ and not on main branch."
+            fi
+          else
+            echo "::set-output name=skip::false"
+            echo "On main branch, proceeding with subsequent jobs."
+          fi
+  build:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ui/frontend
+    strategy:
+      matrix:
+        node-version: [16.x]
+    steps:
+    - uses: actions/checkout@v3
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+    - run: npm install --ignore-scripts
+    - run: npm run lint-fix
+    - run: npm run format
+    - run: npm run build

ui/frontend/package.json

@@ -60,7 +60,7 @@
     "eject": "react-scripts eject",
     "lint": "eslint --ext .js,.ts,.jsx,.tsx --ignore-path .eslintignore .",
     "lint-fix": "eslint --ext .js,.ts,.jsx,.tsx --ignore-path .eslintignore . --fix",
-    "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx,css,md,json}' --config ./.prettierrc",
+    "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx,css,md,json}' --config ./.prettierrc.json",
     "configure-husky": "cd .. && npx husky install frontend/.husky && npx husky add frontend/.husky/pre-commit \"npx --no-install lint-staged\""
   },
   "eslintConfig": {

ui/frontend/src/App.tsx

@@ -80,7 +80,7 @@ export const App = () => {
     if (localMode && userName) {
       dispatch(setLocalUserName(userName));
     }
-  }, [userName]);
+  }, [userName, dispatch]);
   const [currentLoomVideo, setCurrentLoomVideo] = useState<
     keyof typeof HelpVideos | undefined
   >(undefined);