noot

package.json

@@ -10,19 +10,27 @@
   "dependencies": {
     "@handsontable/vue3": "^12.0.1",
     "@types/qs": "^6.9.7",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "@types/uuid": "^8.3.4",
+    "@vitejs/plugin-react": "^4.3.1",
     "@vueuse/core": "^8.7.5",
     "axios": "^0.27.2",
     "handsontable": "^12.0.1",
     "loglevel": "^1.8.0",
     "pinia": "^2.0.14",
     "qs": "^6.10.5",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "typescript-cookie": "^1.0.4",
     "uuid": "^8.3.2",
     "vue": "^3.2.25"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^2.3.3",
+    "autoprefixer": "^10.4.20",
+    "postcss": "^8.4.40",
+    "tailwindcss": "^3.4.7",
     "typescript": "^4.5.4",
     "vite": "^2.9.9",
     "vue-tsc": "^0.34.7"

src/App.tsx

@@ -0,0 +1,5 @@
+
+export const App = ()=> {
+  return (<div>
+          </div>)
+  }

src/index.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/index.tsx

@@ -0,0 +1,10 @@
+import "index.css"
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import {App} from './App'
+
+ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
+  <React.StrictMode>
+    <App/>
+  </React.StrictMode>
+)

src/pages/login.tsx

@@ -1,91 +1,8 @@
-<template>
-  <div> {{loginString}} </div>
-  <section class="login_modal">
-    <div class="login_field">
-      <label for="userName">Username: </label>
-      <input
-        type="text"
-        id="login-username"
-        v-model="username"
-        required
-        />
-    </div>
-    <div class="login_field">
-      <label for="password">Password: </label>
-      <input
-        type="password"
-        id="login-password"
-        v-model="password"
-        required
-        />
-    </div>
-    <div class="login_field">
-      <button
-        type="button"
-        id="loginButton"
-        v-on:click="login()"
-        >Login</button>
 
-      <button
-        type="button"
-        id="logoutButton"
-        v-on:click="logout()"
-        >Logout</button>
-    </div>
 
-  </section>
+export const Login = () => {
-</template>
+
-<script lang="ts" setup>
+
-const username = ref("")
+  return <></>
-const password = ref("")
-const loginString = ref("not logged in")
 
-const login = () => {
-  new LoginHelper(username.value, password.value).login()
-    .then((session)=>{
-      console.log(session, "adding to storage")
-      storage.AddSession(session)
-      window.location.reload()
-    }).catch((e)=>{
-      if(e.code == "ERR_BAD_REQUEST") {
-        alert("invalid username/password")
-        return
-      }
-      alert("unknown error, please report")
-      console.log(e)
-    })
 }
-
-const logout = () => {
-  new LogoutHelper().logout().then(()=>{
-    storage.RemoveSession()
-    localStorage.clear()
-    window.location.reload()
-  })
-}
-
-const s = storage.GetSession()
-const api = new LTOApiv0(s)
-if (s != undefined) {
-  username.value = s.user
-}
-
-const updateLogin = () => {
-  api.GetLoggedin().then((res)=>{
-    if(res) {
-      loginString.value = "logged in as " + s.user
-    }
-  })
-}
-updateLogin()
-
-
-</script>
-
-<script lang="ts">
-import { defineComponent, computed, PropType, defineProps, defineEmits, ref} from 'vue';
-import { LTOApiv0 } from '../lib/lifeto';
-import { LoginHelper, LogoutHelper, Session } from '../lib/session';
-import { storage } from '../session_storage';
-
-</script>

tailwind.config.js

@@ -0,0 +1,10 @@
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}

vite.config.ts

@@ -1,9 +1,10 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import react from '@vitejs/plugin-react'
+
 
-// https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [vue()],
+  plugins: [react()],
   server: {
     proxy: {
       // with options
@@ -15,3 +16,18 @@ export default defineConfig({
     }
   }
 })
+
+// https://vitejs.dev/config/
+//export default defineConfig({
+//  plugins: [vue()],
+//  server: {
+//    proxy: {
+//      // with options
+//      '/lifeto': {
+//        target: "https://beta.lifeto.co/",
+//        changeOrigin: true,
+//        rewrite: (path) => path.replace(/^\/lifeto/, ''),
+//      },
+//    }
+//  }
+//})