[refactor] move around files and integrate tangled synchro for github

.github/workflows/sync-tangled.yaml

···
+name: sync-tangled
+
+on:
+  push:
+
+jobs:
+  sync:
+    name: ${{ matrix.name }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4.1.7
+        with:
+          fetch-depth: 0
+          ref: ${{ github.event.pull_request.head.sha }}
+      - name: sync tangled
+        env:
+          TANGLED_SSH_KEY: ${{ secrets.TANGLED_SSH_KEY }}
+        run: |
+          set -euo pipefail
+          # Turn off strict SSH key checking
+          mkdir -p ~/.ssh
+          echo "Host *
+            StrictHostKeyChecking no
+            UserKnownHostsFile=/dev/null" > ~/.ssh/config
+
+          # Write SSH key to disk
+          echo "$TANGLED_SSH_KEY" > ~/.ssh/tangled_key
+          chmod 600 ~/.ssh/tangled_key
+
+          # Configure SSH to use the key for tangled.sh
+          echo "Host tangled.sh
+            IdentityFile ~/.ssh/tangled_key" >> ~/.ssh/config
+
+          chmod 600 ~/.ssh/config
+
+          git remote add tangled [e-mail]:noob.quest/atproto-migrator
+          git push -f --all tangled
+          git push -f --tags tangled

public/main.css

···
-@import 'cssComponents/base.css';
-@import 'cssComponents/header.css';
-@import 'cssComponents/footer.css';
-@import 'cssComponents/login.css';
-@import 'cssComponents/forms.css';
-@import 'cssComponents/buttons.css';
-@import 'cssComponents/loading.css';
-@import 'cssComponents/migration.css';
-@import 'cssComponents/plc-token.css';
-@import 'cssComponents/actions.css';

src/components/common/NetworkWarning.tsx

···
-import { useNetwork } from '../../contexts/NetworkContext';
+import { useNetwork } from '../../contexts/networkContext';
 
 export default function NetworkWarning() {
   const { isOnline } = useNetwork();

src/main.css

···
+@import 'css/base.css';
+@import 'css/header.css';
+@import 'css/footer.css';
+@import 'css/login.css';
+@import 'css/forms.css';
+@import 'css/buttons.css';
+@import 'css/loading.css';
+@import 'css/migration.css';
+@import 'css/plcToken.css';
+@import 'css/actions.css';

src/main.tsx

···
 import { createRoot } from 'react-dom/client'
 import { BrowserRouter as Router } from 'react-router-dom'
 import { AtpAgent } from '@atproto/api'
-import { AvatarProvider } from './contexts/avatarContext'
-import { NetworkProvider } from './contexts/networkContext'
-import { AppRoutes } from './routes'
-import '../public/main.css'
+import { AvatarProvider } from './contexts/AvatarContext'
+import { NetworkProvider } from './contexts/NetworkContext'
+import { AppRoutes } from './Routes'
+import './main.css'
 
 const SESSION_KEY = 'atproto_session';
 const SESSION_EXPIRY = 60 * 60 * 1000; // 1 hour in milliseconds

src/pages/recoveryKey/RecoveryKeyProcess.tsx

···
 import { useNavigate } from 'react-router-dom';
 import { useEffect } from 'react';
 import { AtpAgent } from '@atproto/api';
-import Footer from '../../components/common/Footer';
-import Header from '../../components/common/Header';
+import Footer from '../../components/common/footer';
+import Header from '../../components/common/header';
 
 interface RecoveryKeyProcessProps {
   agent: AtpAgent;

src/routes.tsx

···
 import { useEffect } from 'react'
 import { Routes, Route, Navigate, useLocation } from 'react-router-dom'
 import { AtpAgent } from '@atproto/api'
-import NetworkWarning from './components/common/networkWarning'
-import Login from './pages/login'
-import Actions from './pages/actions'
-import Migration from './pages/migration/migration'
+import NetworkWarning from './components/common/NetworkWarning'
+import Login from './pages/Login'
+import Actions from './pages/Actions'
+import Migration from './pages/migration/Migration'
 import MigrationProcess from './pages/migration/MigrationProcess'
-import RecoveryKey from './pages/recoveryKey/recovery'
+import RecoveryKey from './pages/recoveryKey/Recovery'
 import RecoveryKeyProcess from './pages/recoveryKey/RecoveryKeyProcess'
 
 export function AppRoutes({ agent, onLogout, handleLogin }: {