From 6c80e90df124360ae5b3987e8ff638fb9b7fbaeb Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Fri, 20 Sep 2024 08:53:06 +0200
Subject: [PATCH 1/5] Added: - app settings and app-settings-item component to
 handle advanced settings with action - Added settings page to admin - reset
 style for florating labels

---
 .../src/modules/layout/components/Sidebar.vue |   6 +
 web-app/packages/admin-app/src/router.ts      |  22 +--
 .../admin/components/AdminProjectsTable.vue   |   3 +
 .../admin-lib/src/modules/admin/routes.ts     |   3 +-
 .../modules/admin/views/AccountDetailView.vue | 136 +++++++-----------
 .../src/modules/admin/views/ProjectView.vue   |  71 ++++-----
 .../src/modules/admin/views/SettingsView.vue  |  54 +++++--
 .../admin/views/SettingsViewTemplate.vue      |  51 +++++--
 .../themes/mm-theme-light/_extensions.scss    |   5 +
 .../components/app-settings/AppSettings.vue   |  28 ++++
 .../app-settings/AppSettingsItem.vue          |  23 +++
 .../common/components/app-settings/index.ts   |   7 +
 .../common/components/app-settings/types.ts   |   5 +
 .../lib/src/common/components/index.ts        |   1 +
 .../layout/components/SideBarTemplate.vue     |   2 +-
 15 files changed, 257 insertions(+), 160 deletions(-)
 create mode 100644 web-app/packages/lib/src/common/components/app-settings/AppSettings.vue
 create mode 100644 web-app/packages/lib/src/common/components/app-settings/AppSettingsItem.vue
 create mode 100644 web-app/packages/lib/src/common/components/app-settings/index.ts
 create mode 100644 web-app/packages/lib/src/common/components/app-settings/types.ts

diff --git a/web-app/packages/admin-app/src/modules/layout/components/Sidebar.vue b/web-app/packages/admin-app/src/modules/layout/components/Sidebar.vue
index c01bf6e4..d151c0fd 100644
--- a/web-app/packages/admin-app/src/modules/layout/components/Sidebar.vue
+++ b/web-app/packages/admin-app/src/modules/layout/components/Sidebar.vue
@@ -24,6 +24,12 @@ const sidebarItems = computed<SideBarItemModel[]>(() => [
     to: '/projects',
     icon: 'ti ti-article',
     active: route.matched.some((item) => item.name === AdminRoutes.PROJECTS)
+  },
+  {
+    title: 'Settings',
+    to: '/settings',
+    icon: 'ti ti-settings',
+    active: route.matched.some((item) => item.name === AdminRoutes.SETTINGS)
   }
 ])
 </script>
diff --git a/web-app/packages/admin-app/src/router.ts b/web-app/packages/admin-app/src/router.ts
index 38049626..32035f5f 100644
--- a/web-app/packages/admin-app/src/router.ts
+++ b/web-app/packages/admin-app/src/router.ts
@@ -5,11 +5,9 @@
 import {
   AccountsView,
   AccountDetailView,
-  //   SettingsView,
-  //   ProjectSettingsView,
+  SettingsView,
   ProjectsView,
   ProjectView,
-  //   LoginView,
   //   useAdminStore
   AdminRoutes
 } from '@mergin/admin-lib'
@@ -95,7 +93,7 @@ export const createRouter = (pinia: Pinia) => {
           header: AppHeader
         },
         props: true
-      }
+      },
 
       //   redirect: { name: 'project-tree' },
       //   children: [
@@ -178,12 +176,16 @@ export const createRouter = (pinia: Pinia) => {
       //     }
       //   ]
       // },
-      // {
-      //   path: '/settings',
-      //   name: 'settings',
-      //   component: SettingsView,
-      //   props: true
-      // }
+      {
+        path: '/settings',
+        name: AdminRoutes.SETTINGS,
+        components: {
+          default: SettingsView,
+          sidebar: Sidebar,
+          header: AppHeader
+        },
+        props: true
+      }
     ]
   })
 
diff --git a/web-app/packages/admin-lib/src/modules/admin/components/AdminProjectsTable.vue b/web-app/packages/admin-lib/src/modules/admin/components/AdminProjectsTable.vue
index 3992fb06..82bd31ea 100644
--- a/web-app/packages/admin-lib/src/modules/admin/components/AdminProjectsTable.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/components/AdminProjectsTable.vue
@@ -45,6 +45,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
           @sort="onSort"
           @row-click="rowClick"
           data-cy="projects-table"
+          :row-class="(data) => (data.removed_at ? 'opacity-80' : '')"
         >
           <template v-for="header in headers" :key="header.field">
             <PColumn
@@ -273,6 +274,8 @@ export default defineComponent({
     },
 
     rowClick(event: DataTableRowClickEvent) {
+      if (event.data.removed_at) return
+
       this.$router.push({
         name: AdminRoutes.PROJECT,
         params: {
diff --git a/web-app/packages/admin-lib/src/modules/admin/routes.ts b/web-app/packages/admin-lib/src/modules/admin/routes.ts
index 0485b9fc..5692a42c 100644
--- a/web-app/packages/admin-lib/src/modules/admin/routes.ts
+++ b/web-app/packages/admin-lib/src/modules/admin/routes.ts
@@ -8,7 +8,8 @@ export enum AdminRoutes {
   ACCOUNTS = 'accounts',
   ACCOUNT = 'account',
   PROJECTS = 'projects',
-  PROJECT = 'project'
+  PROJECT = 'project',
+  SETTINGS = 'settings'
 }
 
 export const getRoutes = (): RouteRecord[] => []
diff --git a/web-app/packages/admin-lib/src/modules/admin/views/AccountDetailView.vue b/web-app/packages/admin-lib/src/modules/admin/views/AccountDetailView.vue
index ca5a0339..f013e6fa 100644
--- a/web-app/packages/admin-lib/src/modules/admin/views/AccountDetailView.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/views/AccountDetailView.vue
@@ -48,7 +48,7 @@
             >
               <dt class="paragraph-p6 opacity-80 mb-2">Full name</dt>
               <dd class="font-semibold" data-cy="profile-name">
-                {{ profile.name || '-' }}
+                {{ profile?.name || '-' }}
               </dd>
             </div>
             <div class="col-6 flex flex-column align-items-end">
@@ -64,73 +64,28 @@
     <app-container>
       <app-section>
         <template #title>Advanced</template>
-        <div class="flex flex-column row-gap-3 paragraph-p5 px-4 pb-4">
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <p class="title-t3">Receive notifications</p>
-              <span class="paragraph-p6 opacity-80">
-                <template v-if="profile?.receive_notifications"
-                  >User has enabled receiving notifications</template
-                >
-                <template v-else>User has disabled notifications.</template>
-              </span>
-            </div>
+
+        <app-settings :items="settingsItems">
+          <template #notifications>
             <div class="flex-shrink-0 paragraph-p1">
-              <i v-if="profile.receive_notifications" class="ti ti-check" />
+              <i v-if="profile?.receive_notifications" class="ti ti-check" />
               <i v-else class="ti ti-x" />
             </div>
-          </div>
-
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <p class="title-t3">Access to admin panel</p>
-              <span class="paragraph-p6 opacity-80">
-                Enabling this option will provide access to the admin panel.
-              </span>
-            </div>
-            <div
-              class="flex align-items-center flex-shrink-0"
-              data-cy="profile-notification"
-            >
-              <PInputSwitch
-                :modelValue="user?.is_admin"
-                @change="switchAdminAccess"
-              />
-            </div>
-          </div>
-
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <p class="title-t3">Account activation</p>
-              <span class="paragraph-p6 opacity-80">
-                <template v-if="user?.active">
-                  The user's account is currently active. Deactivation will lead
-                  to a temporary ban from Mergin Maps usage.
-                </template>
-                <template v-else>
-                  The user's account is currently inactive. Activating it will
-                  allow access to Mergin Maps.
-                </template>
-              </span>
+          </template>
+          <template #adminAccess>
+            <div class="flex-shrink-0 paragraph-p1">
+              <div
+                class="flex align-items-center flex-shrink-0"
+                data-cy="profile-notification"
+              >
+                <PInputSwitch
+                  :modelValue="user?.is_admin"
+                  @change="switchAdminAccess"
+                />
+              </div>
             </div>
+          </template>
+          <template #accountActivation>
             <div class="flex-shrink-0">
               <PButton
                 @click="changeStatusDialog"
@@ -141,21 +96,8 @@
                 class="w-auto mr-1"
               />
             </div>
-          </div>
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <p class="title-t3">Delete account</p>
-              <span class="paragraph-p6 opacity-80"
-                >Deleting this user will remove them and all their data. This
-                action cannot be undone.</span
-              >
-            </div>
+          </template>
+          <template #deleteAccount>
             <div class="flex-shrink-0">
               <PButton
                 @click="confirmDeleteUser"
@@ -164,8 +106,8 @@
                 label="Delete account"
               />
             </div>
-          </div>
-        </div>
+          </template>
+        </app-settings>
       </app-section>
     </app-container>
   </admin-layout>
@@ -177,7 +119,9 @@ import {
   useDialogStore,
   AppSection,
   AppContainer,
-  ConfirmDialogProps
+  ConfirmDialogProps,
+  AppSettings,
+  AppSettingsItemConfig
 } from '@mergin/lib'
 import { computed, watch } from 'vue'
 import { useRoute } from 'vue-router'
@@ -189,6 +133,34 @@ const route = useRoute()
 const adminStore = useAdminStore()
 const dialogStore = useDialogStore()
 
+const settingsItems = computed<AppSettingsItemConfig[]>(() => [
+  {
+    key: 'notifications',
+    title: 'Receive notifications',
+    description: profile?.value?.receive_notifications
+      ? 'User has enabled receiving notifications'
+      : 'User has disabled notifications.'
+  },
+  {
+    key: 'adminAccess',
+    title: 'Access to admin panel',
+    description: 'Enabling this option will provide access to the admin panel.'
+  },
+  {
+    key: 'accountActivation',
+    title: 'Account activation',
+    description: user?.value?.active
+      ? "The user's account is currently active. Deactivation will lead to a temporary ban from Mergin Maps usage."
+      : "The user's account is currently inactive. Activating it will allow access to Mergin Maps."
+  },
+  {
+    key: 'deleteAccount',
+    title: 'Delete account',
+    description:
+      'Deleting this user will remove them and all their data. This action cannot be undone.'
+  }
+])
+
 const user = computed(() => adminStore.user)
 const profile = computed(() => adminStore.user?.profile)
 const routeUsername = computed(() => route?.params?.username)
diff --git a/web-app/packages/admin-lib/src/modules/admin/views/ProjectView.vue b/web-app/packages/admin-lib/src/modules/admin/views/ProjectView.vue
index 37fbc44a..9a60e9d8 100644
--- a/web-app/packages/admin-lib/src/modules/admin/views/ProjectView.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/views/ProjectView.vue
@@ -20,13 +20,13 @@
             <div>
               <dt class="paragraph-p6 opacity-80">Created</dt>
               <dd class="font-semibold" data-cy="project-owner">
-                {{ $filters.date(project?.created) }}
+                {{ $filters.datetime(project?.created) }}
               </dd>
             </div>
             <div>
               <dt class="paragraph-p6 opacity-80">Updated</dt>
               <dd class="font-semibold" data-cy="project-created">
-                {{ $filters.date(project?.updated) }}
+                {{ $filters.datetime(project?.updated) }}
               </dd>
             </div>
             <div>
@@ -43,49 +43,14 @@
     <app-container>
       <app-section>
         <template #title>Advanced</template>
-        <div class="flex flex-column row-gap-3 paragraph-p5 px-4 pb-4">
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <template v-if="project?.access?.public">
-                <p class="title-t3">Public project</p>
-                <span class="paragraph-p6 opacity-80"
-                  >The project will be visible to everyone if it is marked as
-                  public.</span
-                >
-              </template>
-              <template v-else>
-                <p class="title-t3">This is private project</p>
-                <span class="paragraph-p6 opacity-80"
-                  >Make this project visible to anyone.</span
-                >
-              </template>
-            </div>
-            <div class="flex-shrink-0">
+        <app-settings :items="settingsItems">
+          <template #publicProject>
+            <div class="flex-shrink-0 paragraph-p1">
               <i v-if="project?.access?.public" class="ti ti-check" />
               <i v-else class="ti ti-x" />
             </div>
-          </div>
-
-          <div
-            :class="[
-              'flex flex-column align-items-start',
-              'row-gap-2',
-              'md:align-items-center md:flex-row'
-            ]"
-          >
-            <div class="flex-grow-1">
-              <p class="title-t3">Delete project</p>
-              <span class="paragraph-p6 opacity-80"
-                >Deleting this project will remove it and all its data. This
-                action cannot be undone.</span
-              >
-            </div>
+          </template>
+          <template #deleteProject>
             <div class="flex-shrink-0">
               <PButton
                 @click="confirmDelete"
@@ -94,8 +59,8 @@
                 label="Delete project"
               />
             </div>
-          </div>
-        </div>
+          </template>
+        </app-settings>
       </app-section>
     </app-container>
   </admin-layout>
@@ -108,7 +73,9 @@ import {
   AppSection,
   AppContainer,
   ConfirmDialogProps,
-  useProjectStore
+  useProjectStore,
+  AppSettingsItemConfig,
+  AppSettings
 } from '@mergin/lib'
 import { computed, watch, defineProps } from 'vue'
 import { useRoute } from 'vue-router'
@@ -126,6 +93,20 @@ defineProps<{
   namespace: string
 }>()
 
+const settingsItems = computed<AppSettingsItemConfig[]>(() => [
+  {
+    key: 'publicProject',
+    title: 'Public project',
+    description:
+      'The project will be visible to everyone if it is marked as public.'
+  },
+  {
+    key: 'deleteProject',
+    title: 'Delete project',
+    description:
+      'Deleting this project will remove it and all its data. This action cannot be undone.'
+  }
+])
 const project = computed(() => projectStore.project)
 const routeProjectName = computed(() => route?.params?.projectName as string)
 const routeWorkspaceName = computed(() => route?.params?.namespace as string)
diff --git a/web-app/packages/admin-lib/src/modules/admin/views/SettingsView.vue b/web-app/packages/admin-lib/src/modules/admin/views/SettingsView.vue
index d5959366..ff79e782 100644
--- a/web-app/packages/admin-lib/src/modules/admin/views/SettingsView.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/views/SettingsView.vue
@@ -6,26 +6,54 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 
 <template>
   <settings-view-template>
-    <usage-information-card />
-    <check-for-updates-card />
+    <app-settings-item v-for="item in settingsItems" :key="item.key">
+      <template #title>{{ item.title }}</template>
+      <template #description
+        >{{ item.description
+        }}<template v-if="item.key === 'usageInformation'">
+          Click
+          <a
+            class="font-semibold text-color-forest"
+            :href="instanceStore.configData?.docs_url"
+            target="_blank"
+            >here</a
+          >
+          for more information.</template
+        ></template
+      >
+      <template #action>
+        <div class="flex-shrink-0 paragraph-p1">
+          <i
+            v-if="instanceStore.configData?.collect_statistics"
+            class="ti ti-check"
+          />
+          <i v-else class="ti ti-x" />
+        </div>
+      </template>
+    </app-settings-item>
   </settings-view-template>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
+<script setup lang="ts">
+import {
+  AppSettingsItemConfig,
+  useInstanceStore,
+  AppSettingsItem
+} from '@mergin/lib'
+import { ref } from 'vue'
 
-import CheckForUpdatesCard from '@/modules/admin/components/CheckForUpdatesCard.vue'
-import UsageInformationCard from '@/modules/admin/components/UsageInformationCard.vue'
 import SettingsViewTemplate from '@/modules/admin/views/SettingsViewTemplate.vue'
 
-export default defineComponent({
-  name: 'SettingsView',
-  components: {
-    CheckForUpdatesCard,
-    SettingsViewTemplate,
-    UsageInformationCard
+const instanceStore = useInstanceStore()
+
+const settingsItems = ref<AppSettingsItemConfig[]>([
+  {
+    title: 'Collect statistics',
+    description:
+      'Help us improve Mergin Maps by sharing usage information. Mergin Maps collects anonymous usage information to make the service better overtime. You can opt-out anytime.',
+    key: 'usageInformation'
   }
-})
+])
 </script>
 
 <style scoped></style>
diff --git a/web-app/packages/admin-lib/src/modules/admin/views/SettingsViewTemplate.vue b/web-app/packages/admin-lib/src/modules/admin/views/SettingsViewTemplate.vue
index fdbc6e1e..ee4880c7 100644
--- a/web-app/packages/admin-lib/src/modules/admin/views/SettingsViewTemplate.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/views/SettingsViewTemplate.vue
@@ -6,21 +6,56 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 
 <template>
   <admin-layout>
-    <slot />
+    <app-container>
+      <app-section ground>
+        <template #header><h1 class="headline-h3">Settings</h1></template>
+      </app-section>
+    </app-container>
+
+    <app-container>
+      <app-section>
+        <template #title>Advanced</template>
+        <app-settings :items="settingsItems">
+          <slot />
+          <template #checkForUpdates
+            ><PInputSwitch
+              :modelValue="adminStore.checkForUpdates"
+              @change="switchCheckForUpdates"
+          /></template>
+        </app-settings>
+      </app-section>
+    </app-container>
   </admin-layout>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
+<script setup lang="ts">
+import {
+  AppContainer,
+  AppSection,
+  AppSettings,
+  AppSettingsItemConfig
+} from '@mergin/lib'
+
+import { useAdminStore } from '../store'
 
 import AdminLayout from '@/modules/admin/components/AdminLayout.vue'
 
-export default defineComponent({
-  name: 'SettingsViewTemplate',
-  components: {
-    AdminLayout
-  }
+withDefaults(defineProps<{ settingsItems?: AppSettingsItemConfig[] }>(), {
+  settingsItems: () => [
+    {
+      title: 'Check for updates',
+      description: 'Let Mergin Maps automatically check for new updates',
+      key: 'checkForUpdates'
+    }
+  ]
 })
+
+const adminStore = useAdminStore()
+
+function switchCheckForUpdates() {
+  const value = !adminStore.checkForUpdates
+  adminStore.setCheckUpdatesToCookies({ value })
+}
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/web-app/packages/lib/src/assets/sass/themes/mm-theme-light/_extensions.scss b/web-app/packages/lib/src/assets/sass/themes/mm-theme-light/_extensions.scss
index fe13acfc..be31a2b8 100644
--- a/web-app/packages/lib/src/assets/sass/themes/mm-theme-light/_extensions.scss
+++ b/web-app/packages/lib/src/assets/sass/themes/mm-theme-light/_extensions.scss
@@ -34,6 +34,11 @@ label {
   line-height: 2;
 }
 
+.p-float-label label {
+  font-size: inherit;
+  line-height: inherit;
+}
+
 /** Primevue overrides */
 
 // Customization of infinite border of tabs using classes instead pt because, we want to have access to variables
diff --git a/web-app/packages/lib/src/common/components/app-settings/AppSettings.vue b/web-app/packages/lib/src/common/components/app-settings/AppSettings.vue
new file mode 100644
index 00000000..091b3d82
--- /dev/null
+++ b/web-app/packages/lib/src/common/components/app-settings/AppSettings.vue
@@ -0,0 +1,28 @@
+<template>
+  <div class="flex flex-column row-gap-3 px-4 pb-4">
+    <app-settings-item v-for="(item, index) in items" :key="index">
+      <template #title>{{ item.title }}</template>
+      <template #description>{{ item.description }}</template>
+      <template #action>
+        <slot :name="item.key" :item="item"></slot>
+      </template>
+    </app-settings-item>
+    <slot></slot>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps } from 'vue'
+
+import AppSettingsItem from './AppSettingsItem.vue'
+import { AppSettingsItemConfig } from './types'
+
+withDefaults(
+  defineProps<{
+    items?: AppSettingsItemConfig[]
+  }>(),
+  {
+    items: () => []
+  }
+)
+</script>
diff --git a/web-app/packages/lib/src/common/components/app-settings/AppSettingsItem.vue b/web-app/packages/lib/src/common/components/app-settings/AppSettingsItem.vue
new file mode 100644
index 00000000..adc7df7a
--- /dev/null
+++ b/web-app/packages/lib/src/common/components/app-settings/AppSettingsItem.vue
@@ -0,0 +1,23 @@
+<template>
+  <div
+    :class="[
+      'flex flex-column align-items-start',
+      'row-gap-2',
+      'md:align-items-center md:flex-row'
+    ]"
+  >
+    <div class="flex-grow-1">
+      <p class="title-t3">
+        <slot name="title"></slot>
+      </p>
+      <span class="paragraph-p6 opacity-80">
+        <slot name="description"></slot>
+      </span>
+    </div>
+    <slot name="action"></slot>
+  </div>
+</template>
+
+<script setup lang="ts">
+// No props or additional logic needed
+</script>
diff --git a/web-app/packages/lib/src/common/components/app-settings/index.ts b/web-app/packages/lib/src/common/components/app-settings/index.ts
new file mode 100644
index 00000000..e1b438e4
--- /dev/null
+++ b/web-app/packages/lib/src/common/components/app-settings/index.ts
@@ -0,0 +1,7 @@
+// Copyright (C) Lutra Consulting Limited
+//
+// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
+
+export { default as AppSettings } from './AppSettings.vue'
+export { default as AppSettingsItem } from './AppSettingsItem.vue'
+export * from './types'
diff --git a/web-app/packages/lib/src/common/components/app-settings/types.ts b/web-app/packages/lib/src/common/components/app-settings/types.ts
new file mode 100644
index 00000000..eb0bcf18
--- /dev/null
+++ b/web-app/packages/lib/src/common/components/app-settings/types.ts
@@ -0,0 +1,5 @@
+export interface AppSettingsItemConfig {
+  key: string
+  title: string
+  description: string
+}
diff --git a/web-app/packages/lib/src/common/components/index.ts b/web-app/packages/lib/src/common/components/index.ts
index 41361e34..c3fbe448 100644
--- a/web-app/packages/lib/src/common/components/index.ts
+++ b/web-app/packages/lib/src/common/components/index.ts
@@ -17,3 +17,4 @@ export { default as TipMessage } from './TipMessage.vue'
 export { default as AppOnboardingPage } from './AppOnboardingPage.vue'
 export * from './types'
 export * from './data-view'
+export * from './app-settings'
diff --git a/web-app/packages/lib/src/modules/layout/components/SideBarTemplate.vue b/web-app/packages/lib/src/modules/layout/components/SideBarTemplate.vue
index c2e8ce32..30c62238 100644
--- a/web-app/packages/lib/src/modules/layout/components/SideBarTemplate.vue
+++ b/web-app/packages/lib/src/modules/layout/components/SideBarTemplate.vue
@@ -74,7 +74,7 @@ import { ProjectRouteName } from '@/modules/project'
 const route = useRoute()
 const layoutStore = useLayoutStore()
 const props = defineProps<{
-  sidebarItems: SideBarItemModel[]
+  sidebarItems?: SideBarItemModel[]
 }>()
 
 const initialSidebarItems = computed<SideBarItemModel[]>(() => {

From 2aba981f98dc3019654326443faca2f4b014b9bf Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Fri, 20 Sep 2024 11:23:55 +0200
Subject: [PATCH 2/5] Updates for latest server version

---
 .../admin-lib/src/modules/admin/adminApi.ts   |  2 +-
 .../admin/components/CheckForUpdates.vue      | 17 ++--
 .../admin-lib/src/modules/admin/store.ts      | 86 +++++++++++--------
 3 files changed, 59 insertions(+), 46 deletions(-)

diff --git a/web-app/packages/admin-lib/src/modules/admin/adminApi.ts b/web-app/packages/admin-lib/src/modules/admin/adminApi.ts
index e9569e10..a7d25bc6 100644
--- a/web-app/packages/admin-lib/src/modules/admin/adminApi.ts
+++ b/web-app/packages/admin-lib/src/modules/admin/adminApi.ts
@@ -58,7 +58,7 @@ export const AdminApi = {
     )
   },
 
-  async getServerVersion(): Promise<
+  async getLatestServerVersion(): Promise<
     AxiosResponse<LatestServerVersionResponse>
   > {
     return AdminModule.httpService.get('/v1/latest-version')
diff --git a/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdates.vue b/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdates.vue
index 9edb465f..9cf4cbf4 100644
--- a/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdates.vue
+++ b/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdates.vue
@@ -5,9 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 -->
 
 <template>
-  <app-container
-    v-if="adminStore.displayUpdateAvailable && adminStore.info_url"
-  >
+  <app-container v-if="adminStore.displayUpdateAvailable">
     <app-section-banner>
       <template #title>Update available 🎉!</template>
       <template #description
@@ -26,22 +24,19 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
 </template>
 
 <script lang="ts" setup>
-import { useInstanceStore, AppSectionBanner, AppContainer } from '@mergin/lib'
+import { AppSectionBanner, AppContainer } from '@mergin/lib'
+import { onMounted } from 'vue'
 
 import { useAdminStore } from '@/modules/admin/store'
 
-const instanceStore = useInstanceStore()
 const adminStore = useAdminStore()
 
-adminStore.getCheckUpdateFromCookies()
-adminStore.checkVersions({
-  major: instanceStore.configData?.major,
-  minor: instanceStore.configData?.minor,
-  fix: instanceStore.configData?.fix ?? null
+onMounted(async () => {
+  await adminStore.checkVersions()
 })
 
 function openUpdateUrl() {
-  window.open(adminStore.info_url, '_blank')
+  window.open(adminStore.latestServerVersion?.info_url, '_blank')
 }
 </script>
 
diff --git a/web-app/packages/admin-lib/src/modules/admin/store.ts b/web-app/packages/admin-lib/src/modules/admin/store.ts
index b8d74bfd..272bf19c 100644
--- a/web-app/packages/admin-lib/src/modules/admin/store.ts
+++ b/web-app/packages/admin-lib/src/modules/admin/store.ts
@@ -16,7 +16,9 @@ import { defineStore, getActivePinia } from 'pinia'
 import Cookies from 'universal-cookie'
 import { AdminApi } from '@/modules/admin/adminApi'
 import {
+  LatestServerVersionResponse,
   PaginatedAdminProjectsParams,
+  PaginatedAdminProjectsResponse,
   UpdateUserPayload,
   UsersResponse
 } from '@/modules/admin/types'
@@ -29,14 +31,14 @@ export interface AdminState {
     count: number
   }
   projects: {
-    items: any[]
+    items: PaginatedAdminProjectsResponse[]
     count: number
     loading: boolean
   }
   user?: UserResponse
   checkForUpdates?: boolean
-  info_url?: string
   isServerConfigHidden: boolean
+  latestServerVersion?: LatestServerVersionResponse
 }
 
 const cookies = new Cookies()
@@ -56,16 +58,44 @@ export const useAdminStore = defineStore('adminModule', {
     },
     user: null,
     checkForUpdates: undefined,
-    info_url: undefined,
-    isServerConfigHidden: false
+    isServerConfigHidden: false,
+    latestServerVersion: undefined
   }),
-
   getters: {
     displayUpdateAvailable: (state) => {
-      return !!state.checkForUpdates
+      if (!state.checkForUpdates) {
+        return false
+      }
+
+      const instanceStore = useInstanceStore()
+      const config = instanceStore.configData
+
+      if (!state.latestServerVersion || !config) {
+        return false
+      }
+
+      const { major, minor, fix } = state.latestServerVersion
+
+      if (
+        (config.major || config.major === 0) &&
+        (config.minor || config.minor === 0)
+      ) {
+        if (major > config.major) {
+          return true
+        } else if (major === config.major) {
+          if (minor > config.minor) {
+            return true
+          } else if (minor === config.minor) {
+            if (fix > config.fix) {
+              return true
+            }
+          }
+        }
+      }
+
+      return false
     }
   },
-
   actions: {
     setLoading(value) {
       this.loading = value
@@ -76,9 +106,6 @@ export const useAdminStore = defineStore('adminModule', {
     setCheckForUpdates(value) {
       this.checkForUpdates = value
     },
-    setInfoUrl(value: string) {
-      this.info_url = value
-    },
     setIsServerConfigHidden(value: boolean) {
       this.isServerConfigHidden = value
     },
@@ -167,31 +194,22 @@ export const useAdminStore = defineStore('adminModule', {
       }
     },
 
-    async checkVersions(payload) {
+    async getLatestServerVersion() {
+      const notificationStore = useNotificationStore()
       try {
-        const response = await AdminApi.getServerVersion()
-        const { major, minor, fix } = response.data
-        // compare payload - major, minor and fix version from config with latest-version from server
-        if (
-          (payload.major || payload.major === 0) &&
-          (payload.minor || payload.minor === 0)
-        ) {
-          let isUpdate = false
-          if (major > payload.major) {
-            isUpdate = true
-          } else if (major === payload.major) {
-            if (minor > payload.minor) {
-              isUpdate = true
-            } else if (minor === payload.minor) {
-              if (fix > payload.fix) {
-                isUpdate = true
-              }
-            }
-          }
-          if (isUpdate) {
-            this.setInfoUrl(response.data.info_url)
-          }
-        }
+        const response = await AdminApi.getLatestServerVersion()
+        this.latestServerVersion = response.data
+      } catch (e) {
+        notificationStore.error({ text: errorUtils.getErrorMessage(e) })
+      }
+    },
+
+    async checkVersions() {
+      try {
+        await this.getCheckUpdateFromCookies()
+        if (!this.checkForUpdates) return
+
+        await this.getLatestServerVersion()
       } catch (e) {
         console.error(e)
       }

From 92d49c86ea718cc3f8a946769a5b50a64837716b Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Fri, 20 Sep 2024 11:29:11 +0200
Subject: [PATCH 3/5] Cleanup of not necessary components

---
 web-app/packages/admin-app/package.json       |  1 -
 .../admin/components/CheckForUpdatesCard.vue  | 61 -------------------
 .../admin/components/UsageInformationCard.vue | 50 ---------------
 .../src/modules/admin/components/index.ts     |  2 -
 web-app/yarn.lock                             |  5 --
 5 files changed, 119 deletions(-)
 delete mode 100644 web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdatesCard.vue
 delete mode 100644 web-app/packages/admin-lib/src/modules/admin/components/UsageInformationCard.vue

diff --git a/web-app/packages/admin-app/package.json b/web-app/packages/admin-app/package.json
index b7b59ccb..f4c897cb 100644
--- a/web-app/packages/admin-app/package.json
+++ b/web-app/packages/admin-app/package.json
@@ -22,7 +22,6 @@
     "@tabler/icons-webfont": "^2.42.0",
     "axios": "^0.28.1",
     "lodash": "^4.17.21",
-    "material-icons": "^0.2.3",
     "pinia": "^2.1.7",
     "primeflex": "^3.3.1",
     "primevue": "3.43.0",
diff --git a/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdatesCard.vue b/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdatesCard.vue
deleted file mode 100644
index 3bfafb45..00000000
--- a/web-app/packages/admin-lib/src/modules/admin/components/CheckForUpdatesCard.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card class="mt-6 pa-4">
-    <div class="flex-row justify-space-between" style="display: flex">
-      <div class="flex-column" style="max-width: 70%">
-        <h3 class="black--text">Check for updates</h3>
-        <div>
-          Let Mergin Maps automatically check for new updates to ensure you can
-          always use the latest features
-        </div>
-      </div>
-      <v-switch
-        color="secondary"
-        v-model="checkUpdates"
-        hide-details
-        inset
-        @change="onChangeSwitch"
-      ></v-switch>
-    </div>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useAdminStore } from '@/modules/admin/store'
-
-export default defineComponent({
-  name: 'CheckForUpdatesCard',
-  computed: {
-    ...mapState(useAdminStore, ['checkForUpdates'])
-  },
-  data() {
-    return {
-      checkUpdates: true
-    }
-  },
-  watch: {
-    checkForUpdates: {
-      immediate: true,
-      async handler(value) {
-        this.checkUpdates = value === undefined ? true : value
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useAdminStore, ['setCheckUpdatesToCookies']),
-    onChangeSwitch(value) {
-      this.setCheckUpdatesToCookies({ value })
-    }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/admin-lib/src/modules/admin/components/UsageInformationCard.vue b/web-app/packages/admin-lib/src/modules/admin/components/UsageInformationCard.vue
deleted file mode 100644
index 2e2c819c..00000000
--- a/web-app/packages/admin-lib/src/modules/admin/components/UsageInformationCard.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card class="mt-6 pa-4">
-    <div class="flex-row justify-space-between" style="display: flex">
-      <div class="flex-column" style="max-width: 70%">
-        <h3 class="black--text">Anonymous data collection</h3>
-        <div>
-          Mergin Maps collects anonymous usage information to make the service
-          better overtime. You can opt-out anytime.
-          <a class="black--text" :href="docsLinkMerginCe" target="_blank">
-            Click here to learn more.
-          </a>
-        </div>
-      </div>
-      <v-switch
-        color="secondary"
-        v-model="usageStatus"
-        disabled
-        hide-details
-        inset
-      ></v-switch>
-    </div>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { useInstanceStore } from '@mergin/lib'
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'UsageInformationCard',
-  computed: {
-    ...mapState(useInstanceStore, ['configData']),
-    usageStatus() {
-      return this.configData?.collect_statistics
-    },
-    docsLinkMerginCe(): string {
-      return `${this.configData?.docs_url ?? ''}/dev/mergince/`
-    }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/admin-lib/src/modules/admin/components/index.ts b/web-app/packages/admin-lib/src/modules/admin/components/index.ts
index ac6e1f5c..f831d33a 100644
--- a/web-app/packages/admin-lib/src/modules/admin/components/index.ts
+++ b/web-app/packages/admin-lib/src/modules/admin/components/index.ts
@@ -4,9 +4,7 @@
 
 export { default as AdminLayout } from './AdminLayout.vue'
 export { default as CheckForUpdates } from './CheckForUpdates.vue'
-export { default as CheckForUpdatesCard } from './CheckForUpdatesCard.vue'
 export { default as CreateUserForm } from './CreateUserForm.vue'
 export { default as ServerNotConfigured } from './ServerNotConfigured.vue'
-export { default as UsageInformationCard } from './UsageInformationCard.vue'
 export { default as AdminProjectsTable } from './AdminProjectsTable.vue'
 export { default as AccountsTable } from './AccountsTable.vue'
diff --git a/web-app/yarn.lock b/web-app/yarn.lock
index 1e890214..a2e6424f 100644
--- a/web-app/yarn.lock
+++ b/web-app/yarn.lock
@@ -2400,11 +2400,6 @@ magic-string@^0.30.5:
   dependencies:
     "@jridgewell/sourcemap-codec" "^1.4.15"
 
-material-icons@^0.2.3:
-  version "0.2.3"
-  resolved "https://registry.yarnpkg.com/material-icons/-/material-icons-0.2.3.tgz#1f84d50effbb700287ba44a21bbce0339252ccaf"
-  integrity sha512-1Q5wp4aeGWjE5POMtdLmqJn94QM7vmUCeJhNO5m0oDrtW1jfWlaLK73vF3C7/fuMD7NIVicyK8TSkwd+diFgaQ==
-
 memorystream@^0.3.1:
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/memorystream/-/memorystream-0.3.1.tgz#86d7090b30ce455d63fbae12dda51a47ddcaf9b2"

From 160ee4dfa4e47461cf6fb3dffaf63f18cd322d01 Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Fri, 20 Sep 2024 13:54:02 +0200
Subject: [PATCH 4/5] cleanup of lib-vue2

---
 web-app/README.md                             |   5 +-
 web-app/package.json                          |  12 +-
 web-app/packages/admin-app/vite.config.ts     |   1 -
 web-app/packages/admin-lib/package.json       |   1 +
 web-app/packages/admin-lib/vite.config.ts     |   2 +-
 web-app/packages/lib-vue2/.env                |   1 -
 web-app/packages/lib-vue2/.eslintignore       |   4 -
 web-app/packages/lib-vue2/.eslintrc.cjs       |  21 -
 web-app/packages/lib-vue2/babel.config.js     |   3 -
 web-app/packages/lib-vue2/components.d.ts     |  59 --
 web-app/packages/lib-vue2/package.json        |  61 --
 .../lib-vue2/src/assets/App_Store.svg         |  46 --
 .../src/assets/MM_logo_HORIZ_NEG_color.svg    |   1 -
 .../MM_logo_HORIZ_NEG_color.svg.license       |   3 -
 .../src/assets/MM_logo_HORIZ_color.svg        |   1 -
 .../assets/MM_logo_HORIZ_color.svg.license    |   3 -
 .../packages/lib-vue2/src/assets/huawei.svg   |  28 -
 .../src/assets/qgis-icons/mIconDbSchema.svg   |   1 -
 .../qgis-icons/mIconDbSchema.svg.license      |   1 -
 .../src/assets/qgis-icons/mIconFolder.svg     |   1 -
 .../assets/qgis-icons/mIconFolder.svg.license |   2 -
 .../src/assets/qgis-icons/mIconRaster.svg     |   1 -
 .../assets/qgis-icons/mIconRaster.svg.license |   2 -
 .../src/assets/qgis-icons/mIconTableLayer.svg |   1 -
 .../qgis-icons/mIconTableLayer.svg.license    |   2 -
 .../src/assets/qgis-icons/mIconZip.svg        |   1 -
 .../assets/qgis-icons/mIconZip.svg.license    |   2 -
 .../src/assets/qgis-icons/providerQgis.svg    |   1 -
 .../qgis-icons/providerQgis.svg.license       |   1 -
 .../src/common/components/ActionButton.vue    |  36 -
 .../src/common/components/CustomPage.vue      |  82 ---
 .../common/components/FullStorageWarning.vue  |  26 -
 .../components/FullStorageWarningTemplate.vue |  32 -
 .../src/common/components/GlobalWarning.vue   |  23 -
 .../components/GlobalWarningTemplate.vue      |  21 -
 .../src/common/components/MerginLogoLight.vue |  15 -
 .../src/common/components/ProgressSpinner.vue |  19 -
 .../src/common/components/UploadProgress.vue  |  77 ---
 .../src/common/components/UsageStatus.vue     |  23 -
 .../common/components/UsageStatusTemplate.vue |  22 -
 .../src/common/components/WarningMessage.vue  |  29 -
 .../components/WarningMessageTemplate.vue     |  25 -
 .../src/common/components/base/BaseItem.vue   | 101 ---
 .../src/common/components/base/index.ts       |   5 -
 .../lib-vue2/src/common/components/index.ts   |  19 -
 .../lib-vue2/src/common/date_utils.ts         | 104 ---
 .../lib-vue2/src/common/error_utils.ts        |  17 -
 .../packages/lib-vue2/src/common/errors.ts    |  14 -
 .../lib-vue2/src/common/html_utils.ts         |  46 --
 web-app/packages/lib-vue2/src/common/http.ts  | 149 -----
 web-app/packages/lib-vue2/src/common/index.ts |  21 -
 .../lib-vue2/src/common/mergin_utils.ts       | 146 -----
 .../lib-vue2/src/common/mixins/FormMixin.ts   |  30 -
 .../lib-vue2/src/common/mixins/index.ts       |   5 -
 .../lib-vue2/src/common/module_utils.ts       |  47 --
 .../lib-vue2/src/common/number_utils.ts       |  45 --
 .../lib-vue2/src/common/path_utils.ts         |  10 -
 .../lib-vue2/src/common/permission_utils.ts   | 150 -----
 .../lib-vue2/src/common/route_utils.ts        |  60 --
 .../router_without_navigation_failure.ts      |  25 -
 .../lib-vue2/src/common/text_utils.ts         |  21 -
 web-app/packages/lib-vue2/src/common/types.ts |  69 --
 web-app/packages/lib-vue2/src/env.d.ts        |  13 -
 web-app/packages/lib-vue2/src/main.ts         |   6 -
 .../lib-vue2/src/modules/app/index.ts         |   6 -
 .../lib-vue2/src/modules/app/module.ts        |  12 -
 .../lib-vue2/src/modules/app/store.ts         |  21 -
 .../components/DashboardAccessRequestsRow.vue |  53 --
 .../DashboardFullStorageWarningRow.vue        |  33 -
 .../components/DashboardProjectsRow.vue       |  30 -
 .../components/DashboardUsageInfoRow.vue      |  33 -
 .../src/modules/dashboard/components/index.ts |   7 -
 .../lib-vue2/src/modules/dashboard/index.ts   |   7 -
 .../lib-vue2/src/modules/dashboard/module.ts  |  12 -
 .../dashboard/views/DashboardViewTemplate.vue | 196 ------
 .../src/modules/dashboard/views/index.ts      |   5 -
 .../dialog/components/ConfirmDialog.vue       |  75 ---
 .../dialog/components/DialogWindows.vue       |  41 --
 .../src/modules/dialog/components/index.ts    |   6 -
 .../lib-vue2/src/modules/dialog/index.ts      |   8 -
 .../lib-vue2/src/modules/dialog/module.ts     |  12 -
 .../lib-vue2/src/modules/dialog/store.ts      |  58 --
 .../lib-vue2/src/modules/dialog/types.ts      |  17 -
 .../modules/form/MerginComponentUuidMixin.ts  |  16 -
 .../lib-vue2/src/modules/form/index.ts        |   7 -
 .../lib-vue2/src/modules/form/module.ts       |  12 -
 .../lib-vue2/src/modules/form/store.ts        |  78 ---
 .../lib-vue2/src/modules/form/types.ts        |  30 -
 .../packages/lib-vue2/src/modules/index.ts    |  14 -
 .../lib-vue2/src/modules/instance/index.ts    |   8 -
 .../src/modules/instance/instanceApi.ts       |  24 -
 .../lib-vue2/src/modules/instance/module.ts   |  17 -
 .../lib-vue2/src/modules/instance/store.ts    |  83 ---
 .../lib-vue2/src/modules/instance/types.ts    |  29 -
 .../layout/components/AppHeaderTemplate.vue   | 271 --------
 .../modules/layout/components/PageView.vue    |  83 ---
 .../modules/layout/components/SideBarItem.vue |  70 --
 .../layout/components/SideBarTemplate.vue     | 119 ----
 .../src/modules/layout/components/index.ts    |   8 -
 .../lib-vue2/src/modules/layout/index.ts      |   8 -
 .../lib-vue2/src/modules/layout/module.ts     |  12 -
 .../lib-vue2/src/modules/layout/store.ts      |  29 -
 .../src/modules/layout/views/NotFoundView.vue |  48 --
 .../src/modules/layout/views/RootView.vue     |  39 --
 .../src/modules/layout/views/index.ts         |   5 -
 .../notification/components/Notifications.vue |  53 --
 .../modules/notification/components/index.ts  |   5 -
 .../src/modules/notification/index.ts         |   7 -
 .../src/modules/notification/module.ts        |  12 -
 .../src/modules/notification/store.ts         |  89 ---
 .../components/AccountAutocomplete.vue        | 265 --------
 .../project/components/CloneDialog.vue        |  52 --
 .../components/CloneDialogTemplate.vue        |  96 ---
 .../modules/project/components/DropArea.vue   | 260 --------
 .../components/FileChangesetSummaryTable.vue  |  82 ---
 .../modules/project/components/FileIcon.vue   | 103 ---
 .../modules/project/components/FileMenu.vue   |  52 --
 .../modules/project/components/FolderDiff.vue |  54 --
 .../project/components/PermissionInfo.vue     |  57 --
 .../components/ProjectAccessRequestTable.vue  |  46 --
 .../ProjectAccessRequestTableTemplate.vue     | 251 -------
 .../components/ProjectAccessRequests.vue      | 361 ----------
 .../project/components/ProjectForm.vue        |  88 ---
 .../components/ProjectPermissionsTemplate.vue | 395 -----------
 .../project/components/ProjectShareButton.vue |  36 -
 .../components/ProjectShareButtonTemplate.vue |  61 --
 .../project/components/ProjectShareDialog.vue | 217 ------
 .../project/components/ProjectsTable.vue      | 412 ------------
 .../components/ProjectsTableDataLoader.vue    | 146 -----
 .../project/components/UploadPanel.vue        | 259 --------
 .../src/modules/project/components/index.ts   |  24 -
 .../lib-vue2/src/modules/project/index.ts     |  10 -
 .../lib-vue2/src/modules/project/module.ts    |  32 -
 .../src/modules/project/projectApi.ts         | 269 --------
 .../lib-vue2/src/modules/project/routes.ts    |   7 -
 .../lib-vue2/src/modules/project/store.ts     | 618 ------------------
 .../lib-vue2/src/modules/project/types.ts     | 313 ---------
 .../modules/project/views/FileBrowserView.vue | 471 -------------
 .../modules/project/views/FileDetailView.vue  | 232 -------
 .../project/views/FileVersionDetailView.vue   | 179 -----
 .../views/ProjectSettingsViewTemplate.vue     | 210 ------
 .../project/views/ProjectVersionsView.vue     |  34 -
 .../views/ProjectVersionsViewTemplate.vue     | 293 ---------
 .../project/views/ProjectViewTemplate.vue     | 478 --------------
 .../views/ProjectsListViewTemplate.vue        | 157 -----
 .../project/views/VersionDetailView.vue       | 256 --------
 .../src/modules/project/views/index.ts        |  13 -
 .../packages/lib-vue2/src/modules/types.ts    |  22 -
 .../user/components/ChangePasswordForm.vue    | 148 -----
 .../user/components/EditProfileForm.vue       | 113 ----
 .../components/ProfileAccessRequestsRow.vue   |  38 --
 .../user/components/UserSearchChip.vue        |  32 -
 .../src/modules/user/components/index.ts      |   8 -
 .../lib-vue2/src/modules/user/constants.ts    |  13 -
 .../lib-vue2/src/modules/user/index.ts        |  11 -
 .../lib-vue2/src/modules/user/module.ts       |  32 -
 .../lib-vue2/src/modules/user/routes.ts       |   7 -
 .../lib-vue2/src/modules/user/store.ts        | 586 -----------------
 .../lib-vue2/src/modules/user/types.ts        | 146 -----
 .../lib-vue2/src/modules/user/userApi.ts      |  94 ---
 .../modules/user/views/ChangePasswordView.vue | 186 ------
 .../modules/user/views/LoginViewTemplate.vue  | 270 --------
 .../user/views/ProfileViewTemplate.vue        | 348 ----------
 .../modules/user/views/VerifyEmailView.vue    |  59 --
 .../lib-vue2/src/modules/user/views/index.ts  |   8 -
 .../packages/lib-vue2/src/sass/dashboard.scss |  11 -
 .../packages/lib-vue2/src/sass/overrides.sass |  49 --
 .../packages/lib-vue2/src/sass/project.scss   |  30 -
 .../packages/lib-vue2/src/sass/variables.scss |  40 --
 .../src/sass/vuetify-material/_appbar.sass    |  71 --
 .../src/sass/vuetify-material/_buttons.sass   |  85 ---
 .../src/sass/vuetify-material/_card.sass      | 128 ----
 .../src/sass/vuetify-material/_chip.sass      |  23 -
 .../src/sass/vuetify-material/_footer.sass    |  48 --
 .../src/sass/vuetify-material/_map.sass       |  16 -
 .../src/sass/vuetify-material/_modal.sass     |  41 --
 .../sass/vuetify-material/_notification.sass  |  27 -
 .../sass/vuetify-material/_pagination.sass    |  18 -
 .../src/sass/vuetify-material/_settings.sass  |  53 --
 .../src/sass/vuetify-material/_sidebar.sass   |  83 ---
 .../src/sass/vuetify-material/_tab.sass       |  25 -
 .../src/sass/vuetify-material/_table.sass     |  35 -
 .../src/sass/vuetify-material/_view.sass      |  37 --
 web-app/packages/lib-vue2/src/shims-svg.d.ts  |   9 -
 web-app/packages/lib-vue2/src/shims-tsx.d.ts  |  15 -
 web-app/packages/lib-vue2/src/shims-vue.d.ts  |  16 -
 web-app/packages/lib-vue2/tsconfig.json       |  52 --
 web-app/packages/lib-vue2/tsconfig.node.json  |  13 -
 web-app/packages/lib-vue2/vite.config.ts      | 104 ---
 web-app/packages/lib/package.json             |   1 +
 web-app/yarn.lock                             |  56 +-
 191 files changed, 10 insertions(+), 13695 deletions(-)
 delete mode 100644 web-app/packages/lib-vue2/.env
 delete mode 100644 web-app/packages/lib-vue2/.eslintignore
 delete mode 100644 web-app/packages/lib-vue2/.eslintrc.cjs
 delete mode 100644 web-app/packages/lib-vue2/babel.config.js
 delete mode 100644 web-app/packages/lib-vue2/components.d.ts
 delete mode 100644 web-app/packages/lib-vue2/package.json
 delete mode 100644 web-app/packages/lib-vue2/src/assets/App_Store.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/huawei.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg
 delete mode 100644 web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg.license
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/ActionButton.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/CustomPage.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/FullStorageWarning.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/FullStorageWarningTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/GlobalWarning.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/GlobalWarningTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/MerginLogoLight.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/ProgressSpinner.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/UploadProgress.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/UsageStatus.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/UsageStatusTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/WarningMessage.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/WarningMessageTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/base/BaseItem.vue
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/base/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/date_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/error_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/errors.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/html_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/http.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/mergin_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/mixins/FormMixin.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/mixins/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/module_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/number_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/path_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/permission_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/route_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/router_without_navigation_failure.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/text_utils.ts
 delete mode 100644 web-app/packages/lib-vue2/src/common/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/env.d.ts
 delete mode 100644 web-app/packages/lib-vue2/src/main.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/app/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/app/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/app/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardAccessRequestsRow.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardFullStorageWarningRow.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardProjectsRow.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardUsageInfoRow.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/views/DashboardViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dashboard/views/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/components/ConfirmDialog.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/components/DialogWindows.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/dialog/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/form/MerginComponentUuidMixin.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/form/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/form/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/form/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/form/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/instance/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/instance/instanceApi.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/instance/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/instance/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/instance/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/components/AppHeaderTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/components/PageView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/components/SideBarItem.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/components/SideBarTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/views/NotFoundView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/views/RootView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/layout/views/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/notification/components/Notifications.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/notification/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/notification/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/notification/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/notification/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/AccountAutocomplete.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/CloneDialog.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/CloneDialogTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/DropArea.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/FileChangesetSummaryTable.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/FileIcon.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/FileMenu.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/FolderDiff.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/PermissionInfo.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTable.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTableTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequests.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectForm.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectPermissionsTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButton.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButtonTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectShareDialog.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectsTable.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/ProjectsTableDataLoader.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/UploadPanel.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/projectApi.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/routes.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/FileBrowserView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/FileDetailView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/FileVersionDetailView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/ProjectSettingsViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/ProjectViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/ProjectsListViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/VersionDetailView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/project/views/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/components/ChangePasswordForm.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/components/EditProfileForm.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/components/ProfileAccessRequestsRow.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/components/UserSearchChip.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/components/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/constants.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/module.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/routes.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/store.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/types.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/userApi.ts
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/views/ChangePasswordView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/views/LoginViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/views/ProfileViewTemplate.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/views/VerifyEmailView.vue
 delete mode 100644 web-app/packages/lib-vue2/src/modules/user/views/index.ts
 delete mode 100644 web-app/packages/lib-vue2/src/sass/dashboard.scss
 delete mode 100644 web-app/packages/lib-vue2/src/sass/overrides.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/project.scss
 delete mode 100644 web-app/packages/lib-vue2/src/sass/variables.scss
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_appbar.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_buttons.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_card.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_chip.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_footer.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_map.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_modal.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_notification.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_pagination.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_settings.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_sidebar.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_tab.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_table.sass
 delete mode 100644 web-app/packages/lib-vue2/src/sass/vuetify-material/_view.sass
 delete mode 100644 web-app/packages/lib-vue2/src/shims-svg.d.ts
 delete mode 100644 web-app/packages/lib-vue2/src/shims-tsx.d.ts
 delete mode 100644 web-app/packages/lib-vue2/src/shims-vue.d.ts
 delete mode 100644 web-app/packages/lib-vue2/tsconfig.json
 delete mode 100644 web-app/packages/lib-vue2/tsconfig.node.json
 delete mode 100644 web-app/packages/lib-vue2/vite.config.ts

diff --git a/web-app/README.md b/web-app/README.md
index 053a0e40..76f3d62f 100644
--- a/web-app/README.md
+++ b/web-app/README.md
@@ -11,18 +11,17 @@ Monorepo for mergin frontend stuff:
 * monorepo consists of root directory with own package.json and individual workspaces in `packages` directory
 * root package.json defines common devDependencies and it cannot hold any non-development dependency
 * individual workspace package.json defines dependencies used in that particular workspace package
-* frontend applications (e.g. app) is also a workspace package (@mergin/app) held in directory [./packages/app](./packages/app).
+* frontend application (e.g. app) is also a workspace package (@mergin/app) held in directory [./packages/app](./packages/app).
 
 Application constist of several packages in `packages` directory:
 
 - @mergin/lib - Shared library for common features
-- @mergin/lib-vue2 - Shared library for common features with vuetify and vue 2.7
 - @mergin/admin-lib - Shared library for admin
 - @mergin/app - Web appliacation"
 - @mergin/admin-app - Web application for administration
 
 Library packages with *-lib* name are containing shared code for *-app* applications.
 
-Web application *@mergin/app* is using shared library *@mergin/lib*. Web application for administration *admin-app* is using shared libraries with vue 2.7 *@mergin/admin-lib* and *@mergin/lib-vue2*.
+Web application *@mergin/app* is using shared library *@mergin/lib*. Web application for administration *admin-app* is using shared library *@mergin/admin-lib*.
 
 For details about development follow instructions in [development guide](../development.md).
\ No newline at end of file
diff --git a/web-app/package.json b/web-app/package.json
index 3ccd6578..184ca149 100755
--- a/web-app/package.json
+++ b/web-app/package.json
@@ -6,7 +6,6 @@
     "packages/admin-lib",
     "packages/app",
     "packages/admin-app",
-    "packages/lib-vue2",
     "packages/*"
   ],
   "scripts": {
@@ -25,20 +24,17 @@
     "build:dev": "yarn workspace @mergin/app build:dev",
     "build:admin": "yarn workspace @mergin/admin-app build",
     "build:admin:dev": "yarn workspace @mergin/admin-app build:dev",
-    "clean:libs": "yarn workspace @mergin/lib clean && yarn workspace @mergin/admin-lib clean && yarn workspace @mergin/lib-vue2 clean",
+    "clean:libs": "yarn workspace @mergin/lib clean && yarn workspace @mergin/admin-lib clean",
     "clean:libs:noadmin": "yarn workspace @mergin/lib clean",
     "i18n:report": "yarn workspace @mergin/app 18n:report",
-    "link:dependencies": "yarn link:register && yarn link @mergin/lib && yarn link @mergin/admin-lib && yarn link @mergin/lib-vue2",
+    "link:dependencies": "yarn link:register && yarn link @mergin/lib && yarn link @mergin/admin-lib",
     "link:register": "yarn workspaces run link:register",
     "link:unregister": "yarn workspaces run link:unregister",
     "types:libs": "yarn workspaces run build:types",
     "types:lib": "yarn workspace @mergin/lib build:types",
-    "types:lib-vue2": "yarn workspace @mergin/lib-vue2 build:types",
     "types:admin-lib": "yarn workspace @mergin/admin-lib build:types",
     "watch:lib": "yarn workspace @mergin/lib build:lib:watch",
-    "watch:lib-vue2": "yarn workspace @mergin/lib-vue2 build:lib:watch",
     "watch:lib:types": "yarn workspace @mergin/lib build:types:watch",
-    "watch:lib-vue2:types": "yarn workspace @mergin/lib-vue2 build:types:watch",
     "watch:admin-lib": "yarn workspace @mergin/admin-lib build:lib:watch",
     "watch:admin-lib:types": "yarn workspace @mergin/admin-lib build:types:watch",
     "lint:all": "yarn workspaces run lint",
@@ -80,7 +76,5 @@
     "node": ">=18"
   },
   "version": "0.0.0",
-  "dependencies": {
-    "@vitejs/plugin-vue2": "^2.3.1"
-  }
+  "dependencies": {}
 }
diff --git a/web-app/packages/admin-app/vite.config.ts b/web-app/packages/admin-app/vite.config.ts
index d5a8efb3..c390a2a7 100644
--- a/web-app/packages/admin-app/vite.config.ts
+++ b/web-app/packages/admin-app/vite.config.ts
@@ -43,7 +43,6 @@ export default defineConfig(({ mode }) => ({
       'vue',
       'pinia',
       'vue-router',
-      'vuetify',
       'primevue',
       '@mergin/lib',
       '@mergin/admin-lib'
diff --git a/web-app/packages/admin-lib/package.json b/web-app/packages/admin-lib/package.json
index 037e7e10..a72de51d 100644
--- a/web-app/packages/admin-lib/package.json
+++ b/web-app/packages/admin-lib/package.json
@@ -43,6 +43,7 @@
     "axios": "^0.28.1",
     "axios-retry": "^3.2.4",
     "lodash": "^4.17.21",
+    "pinia": "^2.1.7",
     "primeflex": "^3.3.1",
     "primevue": "3.43.0",
     "universal-cookie": "^4.0.4",
diff --git a/web-app/packages/admin-lib/vite.config.ts b/web-app/packages/admin-lib/vite.config.ts
index ae43ac7e..a7089e0d 100644
--- a/web-app/packages/admin-lib/vite.config.ts
+++ b/web-app/packages/admin-lib/vite.config.ts
@@ -35,7 +35,7 @@ export default defineConfig(({ mode }) => ({
     alias: {
       '@': resolve(__dirname, './src')
     },
-    dedupe: ['vue', 'pinia', 'vue-router', 'vuetify', 'primevue', '@mergin/lib']
+    dedupe: ['vue', 'pinia', 'vue-router', 'primevue', '@mergin/lib']
   },
   build: {
     sourcemap: mode !== 'production',
diff --git a/web-app/packages/lib-vue2/.env b/web-app/packages/lib-vue2/.env
deleted file mode 100644
index 0d2a175b..00000000
--- a/web-app/packages/lib-vue2/.env
+++ /dev/null
@@ -1 +0,0 @@
-VITE_VUE_APP_JOIN_COMMUNITY_LINK=https://merginmaps.com/community/join
diff --git a/web-app/packages/lib-vue2/.eslintignore b/web-app/packages/lib-vue2/.eslintignore
deleted file mode 100644
index 1c1cbe7a..00000000
--- a/web-app/packages/lib-vue2/.eslintignore
+++ /dev/null
@@ -1,4 +0,0 @@
-node_modules/
-
-dist/
-types/
diff --git a/web-app/packages/lib-vue2/.eslintrc.cjs b/web-app/packages/lib-vue2/.eslintrc.cjs
deleted file mode 100644
index 51dfd9e4..00000000
--- a/web-app/packages/lib-vue2/.eslintrc.cjs
+++ /dev/null
@@ -1,21 +0,0 @@
-module.exports = {
-  env: {
-    node: true
-  },
-  extends: [
-    'plugin:vue/essential',
-    'eslint:recommended',
-    '@vue/typescript/recommended'
-  ],
-  parser: 'vue-eslint-parser',
-  parserOptions: {
-    parser: '@typescript-eslint/parser',
-    ecmaVersion: 2020,
-    sourceType: 'module'
-  },
-  plugins: ['@typescript-eslint'],
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
-  }
-}
diff --git a/web-app/packages/lib-vue2/babel.config.js b/web-app/packages/lib-vue2/babel.config.js
deleted file mode 100644
index 19904989..00000000
--- a/web-app/packages/lib-vue2/babel.config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
-  presets: []
-}
diff --git a/web-app/packages/lib-vue2/components.d.ts b/web-app/packages/lib-vue2/components.d.ts
deleted file mode 100644
index 168fdd0a..00000000
--- a/web-app/packages/lib-vue2/components.d.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-/* eslint-disable */
-/* prettier-ignore */
-// @ts-nocheck
-// Generated by unplugin-vue-components
-// Read more: https://github.com/vuejs/core/pull/3399
-export {}
-
-declare module 'vue' {
-  export interface GlobalComponents {
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
-    VAutocomplete: typeof import('vuetify/lib')['VAutocomplete']
-    VAvatar: typeof import('vuetify/lib')['VAvatar']
-    VBtn: typeof import('vuetify/lib')['VBtn']
-    VBtnToggle: typeof import('vuetify/lib')['VBtnToggle']
-    VCard: typeof import('vuetify/lib')['VCard']
-    VCardActions: typeof import('vuetify/lib')['VCardActions']
-    VCardText: typeof import('vuetify/lib')['VCardText']
-    VCardTitle: typeof import('vuetify/lib')['VCardTitle']
-    VCheckbox: typeof import('vuetify/lib')['VCheckbox']
-    VChip: typeof import('vuetify/lib')['VChip']
-    VChipGroup: typeof import('vuetify/lib')['VChipGroup']
-    VCol: typeof import('vuetify/lib')['VCol']
-    VContainer: typeof import('vuetify/lib')['VContainer']
-    VDataIterator: typeof import('vuetify/lib')['VDataIterator']
-    VDataTable: typeof import('vuetify/lib')['VDataTable']
-    VDialog: typeof import('vuetify/lib')['VDialog']
-    VDivider: typeof import('vuetify/lib')['VDivider']
-    VForm: typeof import('vuetify/lib')['VForm']
-    VIcon: typeof import('vuetify/lib')['VIcon']
-    VImg: typeof import('vuetify/lib')['VImg']
-    VLayout: typeof import('vuetify/lib')['VLayout']
-    VList: typeof import('vuetify/lib')['VList']
-    VListGroup: typeof import('vuetify/lib')['VListGroup']
-    VListItem: typeof import('vuetify/lib')['VListItem']
-    VListItemAvatar: typeof import('vuetify/lib')['VListItemAvatar']
-    VListItemContent: typeof import('vuetify/lib')['VListItemContent']
-    VListItemIcon: typeof import('vuetify/lib')['VListItemIcon']
-    VListItemSubtitle: typeof import('vuetify/lib')['VListItemSubtitle']
-    VListItemTitle: typeof import('vuetify/lib')['VListItemTitle']
-    VMenu: typeof import('vuetify/lib')['VMenu']
-    VNavigationDrawer: typeof import('vuetify/lib')['VNavigationDrawer']
-    VPagination: typeof import('vuetify/lib')['VPagination']
-    VProgressCircular: typeof import('vuetify/lib')['VProgressCircular']
-    VResponsive: typeof import('vuetify/lib')['VResponsive']
-    VRow: typeof import('vuetify/lib')['VRow']
-    VSelect: typeof import('vuetify/lib')['VSelect']
-    VSnackbar: typeof import('vuetify/lib')['VSnackbar']
-    VSpacer: typeof import('vuetify/lib')['VSpacer']
-    VTab: typeof import('vuetify/lib')['VTab']
-    VTabs: typeof import('vuetify/lib')['VTabs']
-    VTabsSlider: typeof import('vuetify/lib')['VTabsSlider']
-    VTextarea: typeof import('vuetify/lib')['VTextarea']
-    VTextField: typeof import('vuetify/lib')['VTextField']
-    VToolbar: typeof import('vuetify/lib')['VToolbar']
-    VToolbarTitle: typeof import('vuetify/lib')['VToolbarTitle']
-    VTooltip: typeof import('vuetify/lib')['VTooltip']
-  }
-}
diff --git a/web-app/packages/lib-vue2/package.json b/web-app/packages/lib-vue2/package.json
deleted file mode 100644
index e2d574f1..00000000
--- a/web-app/packages/lib-vue2/package.json
+++ /dev/null
@@ -1,61 +0,0 @@
-{
-  "name": "@mergin/lib-vue2",
-  "version": "0.1.0",
-  "private": true,
-  "type": "module",
-  "files": [
-    "dist",
-    "types"
-  ],
-  "main": "dist/lib.js",
-  "module": "dist/lib.js",
-  "types": "types/main.d.ts",
-  "exports": {
-    ".": {
-      "import": "./dist/lib.js",
-      "require": "./dist/lib.umd.cjs"
-    },
-    "./dist/": {
-      "import": "./dist/",
-      "require": "./dist/"
-    }
-  },
-  "scripts": {
-    "dev": "vite",
-    "preview": "vite preview",
-    "build:watch": "npm-run-all -p build:lib:watch build:types:watch",
-    "build:lib": "vue-demi-switch 2.7 && yarn clean:types:temp && vite build --mode development",
-    "build:lib:prod": "vue-demi-switch 2.7 && yarn clean:types:temp && vite build",
-    "build:lib:watch": "yarn clean:types:temp && vite build --watch --mode development",
-    "build:lib:all": "vue-demi-switch 2.7 && yarn build:lib && yarn build:types",
-    "build:lib:all:prod": "vue-demi-switch 2.7 && yarn build:lib:prod",
-    "build:types": "yarn clean:types && (vue-tsc --declaration --emitDeclarationOnly || true) && tsc-alias",
-    "build:types:watch": "yarn build:types && (concurrently \"vue-tsc --watch\" \"tsc-alias -w\")",
-    "clean": "yarn clean:lib && yarn clean:types",
-    "clean:lib": "rimraf ./dist",
-    "clean:types:temp": "rimraf ./**/*.vue.ts",
-    "clean:types": "rimraf ./types ./tsconfig.tsbuildinfo && yarn clean:types:temp",
-    "link:register": "yarn link",
-    "link:unregister": "yarn unlink || true",
-    "lint": "eslint . --ext .js,.vue,.ts"
-  },
-  "dependencies": {
-    "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
-    "axios": "^0.28.1",
-    "axios-retry": "^3.2.4",
-    "date-fns": "^2.28.0",
-    "lodash": "^4.17.21",
-    "universal-cookie": "^4.0.4",
-    "vue": "^2.7.14",
-    "vue-router": "^3.6.5",
-    "vue-tabler-icons": "^1.0",
-    "vuetify": "^2.6.15"
-  },
-  "peerDependencies": {
-    "pinia": ">=2.x",
-    "portal-vue": "2.x",
-    "vue": "2.x",
-    "vuetify": "2.x"
-  },
-  "devDependencies": {}
-}
diff --git a/web-app/packages/lib-vue2/src/assets/App_Store.svg b/web-app/packages/lib-vue2/src/assets/App_Store.svg
deleted file mode 100644
index 072b425a..00000000
--- a/web-app/packages/lib-vue2/src/assets/App_Store.svg
+++ /dev/null
@@ -1,46 +0,0 @@
-<svg id="livetype" xmlns="http://www.w3.org/2000/svg" width="119.66407" height="40" viewBox="0 0 119.66407 40">
-  <title>Download_on_the_App_Store_Badge_US-UK_RGB_blk_4SVG_092917</title>
-  <g>
-    <g>
-      <g>
-        <path d="M110.13477,0H9.53468c-.3667,0-.729,0-1.09473.002-.30615.002-.60986.00781-.91895.0127A13.21476,13.21476,0,0,0,5.5171.19141a6.66509,6.66509,0,0,0-1.90088.627A6.43779,6.43779,0,0,0,1.99757,1.99707,6.25844,6.25844,0,0,0,.81935,3.61816a6.60119,6.60119,0,0,0-.625,1.90332,12.993,12.993,0,0,0-.1792,2.002C.00587,7.83008.00489,8.1377,0,8.44434V31.5586c.00489.3105.00587.6113.01515.9219a12.99232,12.99232,0,0,0,.1792,2.0019,6.58756,6.58756,0,0,0,.625,1.9043A6.20778,6.20778,0,0,0,1.99757,38.001a6.27445,6.27445,0,0,0,1.61865,1.1787,6.70082,6.70082,0,0,0,1.90088.6308,13.45514,13.45514,0,0,0,2.0039.1768c.30909.0068.6128.0107.91895.0107C8.80567,40,9.168,40,9.53468,40H110.13477c.3594,0,.7246,0,1.084-.002.3047,0,.6172-.0039.9219-.0107a13.279,13.279,0,0,0,2-.1768,6.80432,6.80432,0,0,0,1.9082-.6308,6.27742,6.27742,0,0,0,1.6172-1.1787,6.39482,6.39482,0,0,0,1.1816-1.6143,6.60413,6.60413,0,0,0,.6191-1.9043,13.50643,13.50643,0,0,0,.1856-2.0019c.0039-.3106.0039-.6114.0039-.9219.0078-.3633.0078-.7246.0078-1.0938V9.53613c0-.36621,0-.72949-.0078-1.09179,0-.30664,0-.61426-.0039-.9209a13.5071,13.5071,0,0,0-.1856-2.002,6.6177,6.6177,0,0,0-.6191-1.90332,6.46619,6.46619,0,0,0-2.7988-2.7998,6.76754,6.76754,0,0,0-1.9082-.627,13.04394,13.04394,0,0,0-2-.17676c-.3047-.00488-.6172-.01074-.9219-.01269-.3594-.002-.7246-.002-1.084-.002Z" style="fill: #a6a6a6"/>
-        <path d="M8.44483,39.125c-.30468,0-.602-.0039-.90429-.0107a12.68714,12.68714,0,0,1-1.86914-.1631,5.88381,5.88381,0,0,1-1.65674-.5479,5.40573,5.40573,0,0,1-1.397-1.0166,5.32082,5.32082,0,0,1-1.02051-1.3965,5.72186,5.72186,0,0,1-.543-1.6572,12.41351,12.41351,0,0,1-.1665-1.875c-.00634-.2109-.01464-.9131-.01464-.9131V8.44434S.88185,7.75293.8877,7.5498a12.37039,12.37039,0,0,1,.16553-1.87207,5.7555,5.7555,0,0,1,.54346-1.6621A5.37349,5.37349,0,0,1,2.61183,2.61768,5.56543,5.56543,0,0,1,4.01417,1.59521a5.82309,5.82309,0,0,1,1.65332-.54394A12.58589,12.58589,0,0,1,7.543.88721L8.44532.875H111.21387l.9131.0127a12.38493,12.38493,0,0,1,1.8584.16259,5.93833,5.93833,0,0,1,1.6709.54785,5.59374,5.59374,0,0,1,2.415,2.41993,5.76267,5.76267,0,0,1,.5352,1.64892,12.995,12.995,0,0,1,.1738,1.88721c.0029.2832.0029.5874.0029.89014.0079.375.0079.73193.0079,1.09179V30.4648c0,.3633,0,.7178-.0079,1.0752,0,.3252,0,.6231-.0039.9297a12.73126,12.73126,0,0,1-.1709,1.8535,5.739,5.739,0,0,1-.54,1.67,5.48029,5.48029,0,0,1-1.0156,1.3857,5.4129,5.4129,0,0,1-1.3994,1.0225,5.86168,5.86168,0,0,1-1.668.5498,12.54218,12.54218,0,0,1-1.8692.1631c-.2929.0068-.5996.0107-.8974.0107l-1.084.002Z"/>
-      </g>
-      <g id="_Group_" data-name="&lt;Group&gt;">
-        <g id="_Group_2" data-name="&lt;Group&gt;">
-          <g id="_Group_3" data-name="&lt;Group&gt;">
-            <path id="_Path_" data-name="&lt;Path&gt;" d="M24.76888,20.30068a4.94881,4.94881,0,0,1,2.35656-4.15206,5.06566,5.06566,0,0,0-3.99116-2.15768c-1.67924-.17626-3.30719,1.00483-4.1629,1.00483-.87227,0-2.18977-.98733-3.6085-.95814a5.31529,5.31529,0,0,0-4.47292,2.72787c-1.934,3.34842-.49141,8.26947,1.3612,10.97608.9269,1.32535,2.01018,2.8058,3.42763,2.7533,1.38706-.05753,1.9051-.88448,3.5794-.88448,1.65876,0,2.14479.88448,3.591.8511,1.48838-.02416,2.42613-1.33124,3.32051-2.66914a10.962,10.962,0,0,0,1.51842-3.09251A4.78205,4.78205,0,0,1,24.76888,20.30068Z" style="fill: #fff"/>
-            <path id="_Path_2" data-name="&lt;Path&gt;" d="M22.03725,12.21089a4.87248,4.87248,0,0,0,1.11452-3.49062,4.95746,4.95746,0,0,0-3.20758,1.65961,4.63634,4.63634,0,0,0-1.14371,3.36139A4.09905,4.09905,0,0,0,22.03725,12.21089Z" style="fill: #fff"/>
-          </g>
-        </g>
-        <g>
-          <path d="M42.30227,27.13965h-4.7334l-1.13672,3.35645H34.42727l4.4834-12.418h2.083l4.4834,12.418H43.438ZM38.0591,25.59082h3.752l-1.84961-5.44727h-.05176Z" style="fill: #fff"/>
-          <path d="M55.15969,25.96973c0,2.81348-1.50586,4.62109-3.77832,4.62109a3.0693,3.0693,0,0,1-2.84863-1.584h-.043v4.48438h-1.8584V21.44238H48.4302v1.50586h.03418a3.21162,3.21162,0,0,1,2.88281-1.60059C53.645,21.34766,55.15969,23.16406,55.15969,25.96973Zm-1.91016,0c0-1.833-.94727-3.03809-2.39258-3.03809-1.41992,0-2.375,1.23047-2.375,3.03809,0,1.82422.95508,3.0459,2.375,3.0459C52.30227,29.01563,53.24953,27.81934,53.24953,25.96973Z" style="fill: #fff"/>
-          <path d="M65.12453,25.96973c0,2.81348-1.50586,4.62109-3.77832,4.62109a3.0693,3.0693,0,0,1-2.84863-1.584h-.043v4.48438h-1.8584V21.44238H58.395v1.50586h.03418A3.21162,3.21162,0,0,1,61.312,21.34766C63.60988,21.34766,65.12453,23.16406,65.12453,25.96973Zm-1.91016,0c0-1.833-.94727-3.03809-2.39258-3.03809-1.41992,0-2.375,1.23047-2.375,3.03809,0,1.82422.95508,3.0459,2.375,3.0459C62.26711,29.01563,63.21438,27.81934,63.21438,25.96973Z" style="fill: #fff"/>
-          <path d="M71.71047,27.03613c.1377,1.23145,1.334,2.04,2.96875,2.04,1.56641,0,2.69336-.80859,2.69336-1.91895,0-.96387-.67969-1.541-2.28906-1.93652l-1.60937-.3877c-2.28027-.55078-3.33887-1.61719-3.33887-3.34766,0-2.14258,1.86719-3.61426,4.51855-3.61426,2.624,0,4.42285,1.47168,4.4834,3.61426h-1.876c-.1123-1.23926-1.13672-1.9873-2.63379-1.9873s-2.52148.75684-2.52148,1.8584c0,.87793.6543,1.39453,2.25488,1.79l1.36816.33594c2.54785.60254,3.60645,1.626,3.60645,3.44238,0,2.32324-1.85059,3.77832-4.79395,3.77832-2.75391,0-4.61328-1.4209-4.7334-3.667Z" style="fill: #fff"/>
-          <path d="M83.34621,19.2998v2.14258h1.72168v1.47168H83.34621v4.99121c0,.77539.34473,1.13672,1.10156,1.13672a5.80752,5.80752,0,0,0,.61133-.043v1.46289a5.10351,5.10351,0,0,1-1.03223.08594c-1.833,0-2.54785-.68848-2.54785-2.44434V22.91406H80.16262V21.44238H81.479V19.2998Z" style="fill: #fff"/>
-          <path d="M86.065,25.96973c0-2.84863,1.67773-4.63867,4.29395-4.63867,2.625,0,4.29492,1.79,4.29492,4.63867,0,2.85645-1.66113,4.63867-4.29492,4.63867C87.72609,30.6084,86.065,28.82617,86.065,25.96973Zm6.69531,0c0-1.9541-.89551-3.10742-2.40137-3.10742s-2.40039,1.16211-2.40039,3.10742c0,1.96191.89453,3.10645,2.40039,3.10645S92.76027,27.93164,92.76027,25.96973Z" style="fill: #fff"/>
-          <path d="M96.18606,21.44238h1.77246v1.541h.043a2.1594,2.1594,0,0,1,2.17773-1.63574,2.86616,2.86616,0,0,1,.63672.06934v1.73828a2.59794,2.59794,0,0,0-.835-.1123,1.87264,1.87264,0,0,0-1.93652,2.083v5.37012h-1.8584Z" style="fill: #fff"/>
-          <path d="M109.3843,27.83691c-.25,1.64355-1.85059,2.77148-3.89844,2.77148-2.63379,0-4.26855-1.76465-4.26855-4.5957,0-2.83984,1.64355-4.68164,4.19043-4.68164,2.50488,0,4.08008,1.7207,4.08008,4.46582v.63672h-6.39453v.1123a2.358,2.358,0,0,0,2.43555,2.56445,2.04834,2.04834,0,0,0,2.09082-1.27344Zm-6.28223-2.70215h4.52637a2.1773,2.1773,0,0,0-2.2207-2.29785A2.292,2.292,0,0,0,103.10207,25.13477Z" style="fill: #fff"/>
-        </g>
-      </g>
-    </g>
-    <g id="_Group_4" data-name="&lt;Group&gt;">
-      <g>
-        <path d="M37.82619,8.731a2.63964,2.63964,0,0,1,2.80762,2.96484c0,1.90625-1.03027,3.002-2.80762,3.002H35.67092V8.731Zm-1.22852,5.123h1.125a1.87588,1.87588,0,0,0,1.96777-2.146,1.881,1.881,0,0,0-1.96777-2.13379h-1.125Z" style="fill: #fff"/>
-        <path d="M41.68068,12.44434a2.13323,2.13323,0,1,1,4.24707,0,2.13358,2.13358,0,1,1-4.24707,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C44.57522,13.99463,45.01369,13.42432,45.01369,12.44434Z" style="fill: #fff"/>
-        <path d="M51.57326,14.69775h-.92187l-.93066-3.31641h-.07031l-.92676,3.31641h-.91309l-1.24121-4.50293h.90137l.80664,3.436h.06641l.92578-3.436h.85254l.92578,3.436h.07031l.80273-3.436h.88867Z" style="fill: #fff"/>
-        <path d="M53.85354,10.19482H54.709v.71533h.06641a1.348,1.348,0,0,1,1.34375-.80225,1.46456,1.46456,0,0,1,1.55859,1.6748v2.915h-.88867V12.00586c0-.72363-.31445-1.0835-.97168-1.0835a1.03294,1.03294,0,0,0-1.0752,1.14111v2.63428h-.88867Z" style="fill: #fff"/>
-        <path d="M59.09377,8.437h.88867v6.26074h-.88867Z" style="fill: #fff"/>
-        <path d="M61.21779,12.44434a2.13346,2.13346,0,1,1,4.24756,0,2.1338,2.1338,0,1,1-4.24756,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C64.11232,13.99463,64.5508,13.42432,64.5508,12.44434Z" style="fill: #fff"/>
-        <path d="M66.4009,13.42432c0-.81055.60352-1.27783,1.6748-1.34424l1.21973-.07031v-.38867c0-.47559-.31445-.74414-.92187-.74414-.49609,0-.83984.18213-.93848.50049h-.86035c.09082-.77344.81836-1.26953,1.83984-1.26953,1.12891,0,1.76563.562,1.76563,1.51318v3.07666h-.85547v-.63281h-.07031a1.515,1.515,0,0,1-1.35254.707A1.36026,1.36026,0,0,1,66.4009,13.42432Zm2.89453-.38477v-.37646l-1.09961.07031c-.62012.0415-.90137.25244-.90137.64941,0,.40527.35156.64111.835.64111A1.0615,1.0615,0,0,0,69.29543,13.03955Z" style="fill: #fff"/>
-        <path d="M71.34816,12.44434c0-1.42285.73145-2.32422,1.86914-2.32422a1.484,1.484,0,0,1,1.38086.79h.06641V8.437h.88867v6.26074h-.85156v-.71143h-.07031a1.56284,1.56284,0,0,1-1.41406.78564C72.0718,14.772,71.34816,13.87061,71.34816,12.44434Zm.918,0c0,.95508.4502,1.52979,1.20313,1.52979.749,0,1.21191-.583,1.21191-1.52588,0-.93848-.46777-1.52979-1.21191-1.52979C72.72121,10.91846,72.26613,11.49707,72.26613,12.44434Z" style="fill: #fff"/>
-        <path d="M79.23,12.44434a2.13323,2.13323,0,1,1,4.24707,0,2.13358,2.13358,0,1,1-4.24707,0Zm3.333,0c0-.97607-.43848-1.54687-1.208-1.54687-.77246,0-1.207.5708-1.207,1.54688,0,.98389.43457,1.55029,1.207,1.55029C82.12453,13.99463,82.563,13.42432,82.563,12.44434Z" style="fill: #fff"/>
-        <path d="M84.66945,10.19482h.85547v.71533h.06641a1.348,1.348,0,0,1,1.34375-.80225,1.46456,1.46456,0,0,1,1.55859,1.6748v2.915H87.605V12.00586c0-.72363-.31445-1.0835-.97168-1.0835a1.03294,1.03294,0,0,0-1.0752,1.14111v2.63428h-.88867Z" style="fill: #fff"/>
-        <path d="M93.51516,9.07373v1.1416h.97559v.74854h-.97559V13.2793c0,.47168.19434.67822.63672.67822a2.96657,2.96657,0,0,0,.33887-.02051v.74023a2.9155,2.9155,0,0,1-.4834.04541c-.98828,0-1.38184-.34766-1.38184-1.21582v-2.543h-.71484v-.74854h.71484V9.07373Z" style="fill: #fff"/>
-        <path d="M95.70461,8.437h.88086v2.48145h.07031a1.3856,1.3856,0,0,1,1.373-.80664,1.48339,1.48339,0,0,1,1.55078,1.67871v2.90723H98.69v-2.688c0-.71924-.335-1.0835-.96289-1.0835a1.05194,1.05194,0,0,0-1.13379,1.1416v2.62988h-.88867Z" style="fill: #fff"/>
-        <path d="M104.76125,13.48193a1.828,1.828,0,0,1-1.95117,1.30273A2.04531,2.04531,0,0,1,100.73,12.46045a2.07685,2.07685,0,0,1,2.07617-2.35254c1.25293,0,2.00879.856,2.00879,2.27V12.688h-3.17969v.0498a1.1902,1.1902,0,0,0,1.19922,1.29,1.07934,1.07934,0,0,0,1.07129-.5459Zm-3.126-1.45117h2.27441a1.08647,1.08647,0,0,0-1.1084-1.1665A1.15162,1.15162,0,0,0,101.63527,12.03076Z" style="fill: #fff"/>
-      </g>
-    </g>
-  </g>
-</svg>
diff --git a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg b/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg
deleted file mode 100644
index 0e417d73..00000000
--- a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 699.19 206.67"><defs><style>.e{fill:#fff;}.f{fill:#00a884;}</style></defs><g id="a"/><g id="b"/><g id="c"/><g id="d"><g><g><g><path class="f" d="M420.05,81.03h16.13v6.55c3.95-5.29,8.82-7.73,15.12-7.73,5.88,0,9.91,2.35,13.27,7.73,4.28-5.29,9.24-7.81,15.79-7.81,10.5,0,16.55,5.71,16.55,15.46v30.41h-17.47v-23.86c0-5.46-1.68-7.98-5.96-7.98s-6.3,2.6-6.3,8.15v23.69h-17.39v-23.27c0-5.96-1.68-8.57-6.22-8.57-3.95,0-6.05,2.69-6.05,7.9v23.94h-17.47v-44.6Z"/><path class="f" d="M534.2,121.35c-4.54,4.03-9.66,5.88-16.21,5.88-10.16,0-15.79-5.21-15.79-14.2,0-9.91,6.22-12.68,19.4-14.36,8.57-1.09,12.26-.67,12.26-4.79,0-2.6-2.1-3.7-6.38-3.7-3.7,0-5.63,1.43-5.96,4.45h-17.3c.17-10,8.23-15.2,23.86-15.2,8.15,0,14.36,1.76,17.39,3.78,4.7,3.19,5.71,6.55,5.71,12.52v24.86c0,1.6,.67,2.94,1.93,3.78v1.26h-17.81l-1.09-4.28Zm-13.94-8.82c0,2.52,1.76,4.03,5.04,4.03,5.96,0,8.48-2.69,8.48-8.57,0-.76,0-1.51-.08-2.27-8.23,3.11-13.44,2.52-13.44,6.8Z"/><path class="f" d="M558.98,81.03h15.71v5.71c3.53-4.79,8.06-6.89,14.45-6.89,11.34,0,19.4,9.24,19.4,23.6s-7.81,23.69-19.74,23.69c-5.46,0-9.49-1.76-12.6-5.71v22.09h-17.22v-62.5Zm24.7,12.1c-5.29,0-7.48,3.28-7.48,10.33s2.44,10.08,7.31,10.08,7.31-3.36,7.31-10.08-2.27-10.33-7.14-10.33Z"/><path class="f" d="M628.28,111.61c0,3.78,1.93,5.63,5.8,5.63s5.8-1.34,5.8-3.7c0-3.19-2.52-3.53-7.48-4.62-13.78-2.94-20.16-5.38-20.16-14.78s7.48-14.7,21.92-14.7c13.36,0,20.66,4.79,21.76,14.03h-15.96c-.25-2.6-2.44-4.37-5.63-4.37s-4.79,1.18-4.79,3.11c0,3.19,2.94,3.19,8.48,4.45,13.27,3.02,19.4,5.46,19.4,15.12,0,10.16-7.98,15.46-23.6,15.46-14.45,0-22.01-5.21-22.76-15.62h17.22Z"/></g><polygon class="f" points="97.68 141.13 135.47 141.13 135.47 65.54 97.68 65.54 97.68 46.64 154.37 46.64 154.37 160.03 97.68 160.03 97.68 141.13"/><path class="f" d="M67.1,103.33c0,16.89,13.69,30.58,30.58,30.58v-61.15c-16.89,0-30.58,13.69-30.58,30.57Z"/></g><g><g><path class="e" d="M226.82,97.67c0-7.81-1.43-11.51-8.06-11.51-7.06,0-11.26,4.54-11.26,12.6v25.96h-7.48v-27.05c0-7.81-1.43-11.51-8.06-11.51-6.97,0-11.26,4.62-11.26,12.6v25.96h-7.39v-43.93h7.06v6.22c3.28-4.96,7.64-7.31,13.69-7.31,5.54,0,9.24,2.18,12.01,6.89,3.78-4.7,8.15-6.89,14.11-6.89s10.08,2.18,12.26,5.96c1.68,3.02,1.76,6.72,1.76,11.42v27.64h-7.39v-27.05Z"/><path class="e" d="M279.74,110.52c-1.6,9.74-8.9,15.62-19.24,15.62-12.1,0-19.74-8.65-19.74-22.93,0-15.2,7.64-23.86,19.74-23.86s19.82,7.98,19.82,22.26c0,1.09,0,2.18-.08,3.28h-31.75c.17,9.32,4.87,14.53,12.68,14.53,6.05,0,10.08-3.19,11.26-8.9h7.31Zm-7.14-11.76c-.08-8.32-4.37-12.85-11.84-12.85s-11.59,4.45-12.26,12.85h24.11Z"/><path class="e" d="M286.29,80.78h7.14v7.9c2.35-5.96,6.38-8.82,12.18-8.82,.67,0,1.26,0,1.93,.08v7.81c-.59-.08-1.18-.08-1.76-.08-7.9,0-12.1,4.37-12.1,12.6v24.44h-7.39v-43.93Z"/><path class="e" d="M329.3,126.14c-11.76,0-19.74-9.24-19.74-23.52s7.9-23.27,19.82-23.27c6.64,0,10.58,2.86,13.86,6.97v-5.54h7.14v43.01c0,13.36-5.88,19.24-20.5,19.24-11.84,0-18.56-4.96-18.56-12.85v-.34h7.22v.17c0,4.54,3.86,6.8,11.59,6.8,9.49,0,13.1-3.44,13.1-11.42v-6.05c-3.44,4.54-8.06,6.8-13.94,6.8Zm-12.01-23.35c0,10.67,4.96,16.72,13.02,16.72,8.99,0,13.19-5.29,13.19-16.46s-4.54-17.05-13.27-17.05c-8.23,0-12.94,5.88-12.94,16.8Z"/><path class="e" d="M359.12,64.32h7.39v8.4h-7.39v-8.4Zm0,16.46h7.39v43.93h-7.39v-43.93Z"/><path class="e" d="M404.48,97.67c0-7.81-1.76-11.42-8.82-11.42-8.15,0-13.02,4.79-13.02,13.44v25.03h-7.39v-43.93h7.06v6.38c3.36-5.04,7.98-7.48,14.11-7.48,6.64,0,11.17,2.02,13.61,5.96,1.85,2.86,1.93,6.3,1.93,10.58v28.48h-7.48v-27.05Z"/></g><polygon class="e" points="97.68 141.13 59.88 141.13 59.88 65.54 97.68 65.54 97.68 46.64 40.99 46.64 40.99 160.03 97.68 160.03 97.68 141.13"/><path class="e" d="M128.26,103.33c0,16.89-13.69,30.58-30.58,30.58v-61.15c16.89,0,30.58,13.69,30.58,30.57Z"/></g></g></g></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg.license b/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg.license
deleted file mode 100644
index a56f08b1..00000000
--- a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_NEG_color.svg.license
+++ /dev/null
@@ -1,3 +0,0 @@
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
diff --git a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg b/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg
deleted file mode 100644
index 81ddf965..00000000
--- a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg
+++ /dev/null
@@ -1 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 699.19 206.67"><defs><style>.e{fill:#2d052d;}.f{fill:#00a884;}</style></defs><g id="a"/><g id="b"/><g id="c"/><g id="d"><g><g><g><path class="f" d="M420.05,81.03h16.13v6.55c3.95-5.29,8.82-7.73,15.12-7.73,5.88,0,9.91,2.35,13.27,7.73,4.28-5.29,9.24-7.81,15.79-7.81,10.5,0,16.55,5.71,16.55,15.46v30.41h-17.47v-23.86c0-5.46-1.68-7.98-5.96-7.98s-6.3,2.6-6.3,8.15v23.69h-17.39v-23.27c0-5.96-1.68-8.57-6.22-8.57-3.95,0-6.05,2.69-6.05,7.9v23.94h-17.47v-44.6Z"/><path class="f" d="M534.2,121.35c-4.54,4.03-9.66,5.88-16.21,5.88-10.16,0-15.79-5.21-15.79-14.2,0-9.91,6.22-12.68,19.4-14.36,8.57-1.09,12.26-.67,12.26-4.79,0-2.6-2.1-3.7-6.38-3.7-3.7,0-5.63,1.43-5.96,4.45h-17.3c.17-10,8.23-15.2,23.86-15.2,8.15,0,14.36,1.76,17.39,3.78,4.7,3.19,5.71,6.55,5.71,12.52v24.86c0,1.6,.67,2.94,1.93,3.78v1.26h-17.81l-1.09-4.28Zm-13.94-8.82c0,2.52,1.76,4.03,5.04,4.03,5.96,0,8.48-2.69,8.48-8.57,0-.76,0-1.51-.08-2.27-8.23,3.11-13.44,2.52-13.44,6.8Z"/><path class="f" d="M558.98,81.03h15.71v5.71c3.53-4.79,8.06-6.89,14.45-6.89,11.34,0,19.4,9.24,19.4,23.6s-7.81,23.69-19.74,23.69c-5.46,0-9.49-1.76-12.6-5.71v22.09h-17.22v-62.5Zm24.7,12.1c-5.29,0-7.48,3.28-7.48,10.33s2.44,10.08,7.31,10.08,7.31-3.36,7.31-10.08-2.27-10.33-7.14-10.33Z"/><path class="f" d="M628.28,111.61c0,3.78,1.93,5.63,5.8,5.63s5.8-1.34,5.8-3.7c0-3.19-2.52-3.53-7.48-4.62-13.78-2.94-20.16-5.38-20.16-14.78s7.48-14.7,21.92-14.7c13.36,0,20.66,4.79,21.76,14.03h-15.96c-.25-2.6-2.44-4.37-5.63-4.37s-4.79,1.18-4.79,3.11c0,3.19,2.94,3.19,8.48,4.45,13.27,3.02,19.4,5.46,19.4,15.12,0,10.16-7.98,15.46-23.6,15.46-14.45,0-22.01-5.21-22.76-15.62h17.22Z"/></g><polygon class="f" points="97.68 141.13 135.47 141.13 135.47 65.54 97.68 65.54 97.68 46.64 154.37 46.64 154.37 160.03 97.68 160.03 97.68 141.13"/><path class="f" d="M67.1,103.33c0,16.89,13.69,30.58,30.58,30.58v-61.15c-16.89,0-30.58,13.69-30.58,30.57Z"/></g><g><g><path class="e" d="M226.82,97.67c0-7.81-1.43-11.51-8.06-11.51-7.06,0-11.26,4.54-11.26,12.6v25.96h-7.48v-27.05c0-7.81-1.43-11.51-8.06-11.51-6.97,0-11.26,4.62-11.26,12.6v25.96h-7.39v-43.93h7.06v6.22c3.28-4.96,7.64-7.31,13.69-7.31,5.54,0,9.24,2.18,12.01,6.89,3.78-4.7,8.15-6.89,14.11-6.89s10.08,2.18,12.26,5.96c1.68,3.02,1.76,6.72,1.76,11.42v27.64h-7.39v-27.05Z"/><path class="e" d="M279.74,110.52c-1.6,9.74-8.9,15.62-19.24,15.62-12.1,0-19.74-8.65-19.74-22.93,0-15.2,7.64-23.86,19.74-23.86s19.82,7.98,19.82,22.26c0,1.09,0,2.18-.08,3.28h-31.75c.17,9.32,4.87,14.53,12.68,14.53,6.05,0,10.08-3.19,11.26-8.9h7.31Zm-7.14-11.76c-.08-8.32-4.37-12.85-11.84-12.85s-11.59,4.45-12.26,12.85h24.11Z"/><path class="e" d="M286.29,80.78h7.14v7.9c2.35-5.96,6.38-8.82,12.18-8.82,.67,0,1.26,0,1.93,.08v7.81c-.59-.08-1.18-.08-1.76-.08-7.9,0-12.1,4.37-12.1,12.6v24.44h-7.39v-43.93Z"/><path class="e" d="M329.3,126.14c-11.76,0-19.74-9.24-19.74-23.52s7.9-23.27,19.82-23.27c6.64,0,10.58,2.86,13.86,6.97v-5.54h7.14v43.01c0,13.36-5.88,19.24-20.5,19.24-11.84,0-18.56-4.96-18.56-12.85v-.34h7.22v.17c0,4.54,3.86,6.8,11.59,6.8,9.49,0,13.1-3.44,13.1-11.42v-6.05c-3.44,4.54-8.06,6.8-13.94,6.8Zm-12.01-23.35c0,10.67,4.96,16.72,13.02,16.72,8.99,0,13.19-5.29,13.19-16.46s-4.54-17.05-13.27-17.05c-8.23,0-12.94,5.88-12.94,16.8Z"/><path class="e" d="M359.12,64.32h7.39v8.4h-7.39v-8.4Zm0,16.46h7.39v43.93h-7.39v-43.93Z"/><path class="e" d="M404.48,97.67c0-7.81-1.76-11.42-8.82-11.42-8.15,0-13.02,4.79-13.02,13.44v25.03h-7.39v-43.93h7.06v6.38c3.36-5.04,7.98-7.48,14.11-7.48,6.64,0,11.17,2.02,13.61,5.96,1.85,2.86,1.93,6.3,1.93,10.58v28.48h-7.48v-27.05Z"/></g><polygon class="e" points="97.68 141.13 59.88 141.13 59.88 65.54 97.68 65.54 97.68 46.64 40.99 46.64 40.99 160.03 97.68 160.03 97.68 141.13"/><path class="e" d="M128.26,103.33c0,16.89-13.69,30.58-30.58,30.58v-61.15c16.89,0,30.58,13.69,30.58,30.57Z"/></g></g></g></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg.license b/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg.license
deleted file mode 100644
index a56f08b1..00000000
--- a/web-app/packages/lib-vue2/src/assets/MM_logo_HORIZ_color.svg.license
+++ /dev/null
@@ -1,3 +0,0 @@
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
diff --git a/web-app/packages/lib-vue2/src/assets/huawei.svg b/web-app/packages/lib-vue2/src/assets/huawei.svg
deleted file mode 100644
index 58cb426b..00000000
--- a/web-app/packages/lib-vue2/src/assets/huawei.svg
+++ /dev/null
@@ -1,28 +0,0 @@
-<svg width="293" height="88" viewBox="0 0 293 88" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M271.481 0.695648H21.3592C20.5437 0.695648 19.7865 0.695648 18.971 0.695648C18.3303 0.695648 17.6313 0.695648 16.9905 0.695648C15.5343 0.753697 14.0781 0.811745 12.6801 1.10199C11.2239 1.33418 9.88414 1.79857 8.60266 2.4371C7.32118 3.07563 6.15619 3.94636 5.10771 4.99123C4.05922 6.0361 3.24372 7.19707 2.54473 8.47413C1.84573 9.80925 1.438 11.1444 1.205 12.5375C0.972003 13.9887 0.855498 15.3819 0.797249 16.8331C0.797249 17.4716 0.797263 18.1682 0.739014 18.8068C0.739014 19.5614 0.739014 20.3741 0.739014 21.1287V67.2191C0.739014 68.0318 0.739014 68.7864 0.739014 69.5411C0.739014 70.1796 0.738999 70.8762 0.797249 71.5147C0.855498 72.9659 0.913754 74.4171 1.205 75.8103C1.438 77.2615 1.90398 78.5966 2.54473 79.8737C3.18547 81.1507 4.05922 82.3117 5.10771 83.3566C6.15619 84.4015 7.32118 85.2141 8.60266 85.9107C9.94239 86.6073 11.2821 87.0136 12.6801 87.2458C14.1363 87.478 15.5925 87.5941 16.9905 87.6522C17.6313 87.6522 18.3303 87.6522 18.971 87.6522C19.7865 87.6522 20.5437 87.6522 21.3592 87.6522H271.481C272.239 87.6522 273.054 87.6522 273.811 87.6522C274.452 87.6522 275.151 87.6522 275.792 87.6522C277.248 87.5941 278.704 87.5361 280.102 87.2458C281.558 87.0136 282.898 86.5492 284.238 85.9107C285.519 85.2722 286.684 84.4015 287.733 83.3566C288.781 82.3698 289.597 81.1507 290.296 79.8737C290.937 78.5966 291.403 77.2034 291.636 75.8103C291.927 74.3591 291.985 72.9659 292.043 71.5147C292.043 70.8762 292.043 70.1796 292.043 69.5411C292.043 68.7864 292.043 67.9738 292.043 67.2191V21.1867C292.043 20.3741 292.043 19.6194 292.043 18.8648C292.043 18.2263 292.043 17.5297 292.043 16.8912C291.985 15.4399 291.927 13.9887 291.636 12.5956C291.403 11.1444 290.937 9.80925 290.296 8.53218C289.655 7.25512 288.781 6.09415 287.733 5.04928C286.743 4.00441 285.519 3.19173 284.238 2.49515C282.898 1.85662 281.558 1.39223 280.102 1.16004C278.704 0.927842 277.248 0.811745 275.792 0.753697C275.151 0.753697 274.452 0.753697 273.811 0.753697C273.054 0.695648 272.297 0.695648 271.481 0.695648Z" fill="#B6B6B6"/>
-<path d="M19.0295 85.9112C18.3888 85.9112 17.748 85.9112 17.1073 85.9112C15.8841 85.8531 14.4861 85.7951 13.0881 85.5629C11.7483 85.3307 10.5834 84.9244 9.53489 84.4019C8.42816 83.8214 7.37966 83.1249 6.50593 82.1961C5.63219 81.3254 4.87495 80.3385 4.29246 79.1776C3.70997 78.0746 3.36048 76.9137 3.12748 75.6366C2.83623 74.1854 2.778 72.7342 2.778 71.6313C2.778 71.1669 2.71973 69.6576 2.71973 69.6576V18.8653C2.71973 18.8653 2.71975 17.356 2.778 16.9497C2.778 15.8468 2.89448 14.3375 3.12748 12.9443C3.36048 11.6092 3.76822 10.4483 4.29246 9.34534C4.87495 8.24242 5.57394 7.19755 6.50593 6.32682C7.37966 5.4561 8.42816 4.70147 9.53489 4.12098C10.6416 3.5405 11.8066 3.19221 13.0881 2.96002C14.5443 2.72782 16.0006 2.61172 17.1073 2.61172H19.0295H273.87H275.85C276.957 2.61172 278.413 2.72782 279.87 2.96002C281.151 3.19221 282.316 3.59855 283.481 4.12098C284.588 4.70147 285.578 5.39805 286.51 6.32682C287.384 7.19755 288.141 8.18437 288.723 9.34534C289.306 10.4483 289.655 11.6092 289.888 12.8863C290.121 14.2214 290.238 15.6146 290.238 16.9497C290.238 17.5302 290.238 18.2267 290.238 18.8653C290.238 19.678 290.238 20.4326 290.238 21.1872V67.2776C290.238 68.0323 290.238 68.8449 290.238 69.5996C290.238 70.2962 290.238 70.9347 290.238 71.5732C290.18 72.8503 290.121 74.2435 289.888 75.5786C289.655 76.9137 289.306 78.0746 288.723 79.1776C288.141 80.2805 287.384 81.3254 286.51 82.138C285.636 83.0088 284.588 83.7634 283.481 84.3439C282.374 84.9244 281.209 85.2727 279.87 85.5048C278.472 85.737 277.074 85.7951 275.85 85.8531C275.21 85.8531 274.569 85.8531 273.928 85.8531H271.598L19.0295 85.9112Z" fill="black"/>
-<path d="M108.908 59.4998H98.6557L96.151 66.2915H91.6658L101.685 40.8082H105.937L116.189 66.2915H111.471L108.908 59.4998ZM99.9372 56.0169H107.568L104.83 48.7028C104.481 47.716 104.073 46.555 103.723 45.336C103.374 46.4389 103.024 47.5418 102.675 48.6448L99.9372 56.0169Z" fill="white"/>
-<path d="M117.994 51.9538C117.994 50.5606 117.936 48.9933 117.878 47.3099H121.955C122.13 48.1226 122.188 48.8772 122.247 49.6899C123.936 47.8323 125.858 46.9036 128.072 46.9036C129.353 46.9036 130.518 47.1938 131.625 47.8323C132.731 48.4709 133.605 49.4577 134.246 50.8509C134.887 52.244 135.236 53.9855 135.236 56.0752C135.236 58.2811 134.828 60.1967 134.071 61.764C133.314 63.3313 132.265 64.5503 130.867 65.3049C129.528 66.1176 127.955 66.5239 126.149 66.5239C124.868 66.5239 123.586 66.2918 122.305 65.8854V73.838L117.936 74.1863V51.9538H117.994ZM129.47 61.6479C130.343 60.4869 130.809 58.7455 130.809 56.4235C130.809 54.2757 130.46 52.7665 129.703 51.8377C128.945 50.9089 128.013 50.3865 126.79 50.3865C125.916 50.3865 125.159 50.5606 124.46 50.967C123.761 51.3733 123.062 51.8957 122.421 52.5923V62.7508C122.829 62.983 123.353 63.1571 123.936 63.2732C124.518 63.3893 125.101 63.4474 125.625 63.4474C127.256 63.4474 128.538 62.8669 129.47 61.6479Z" fill="white"/>
-<path d="M137.857 51.9538C137.857 50.5606 137.799 48.9933 137.741 47.3099H141.818C141.993 48.1226 142.051 48.8772 142.11 49.6899C143.799 47.8323 145.721 46.9036 147.935 46.9036C149.216 46.9036 150.381 47.1938 151.488 47.8323C152.594 48.4709 153.468 49.4577 154.109 50.8509C154.75 52.244 155.099 53.9855 155.099 56.0752C155.099 58.2811 154.691 60.1967 153.934 61.764C153.177 63.3313 152.129 64.5503 150.731 65.3049C149.391 66.1176 147.818 66.5239 146.012 66.5239C144.731 66.5239 143.449 66.2918 142.168 65.8854V73.838L137.799 74.1863V51.9538H137.857ZM149.333 61.6479C150.206 60.4869 150.672 58.7455 150.672 56.4235C150.672 54.2757 150.323 52.7665 149.566 51.8377C148.808 50.9089 147.876 50.3865 146.653 50.3865C145.779 50.3865 145.022 50.5606 144.323 50.967C143.624 51.3733 142.925 51.8957 142.284 52.5923V62.7508C142.692 62.983 143.216 63.1571 143.799 63.2732C144.381 63.3893 144.964 63.4474 145.488 63.4474C147.119 63.4474 148.459 62.8669 149.333 61.6479Z" fill="white"/>
-<path d="M163.079 65.0715C161.215 64.0266 159.759 62.5754 158.769 60.6018C157.779 58.6862 157.254 56.3642 157.254 53.7521C157.254 50.9077 157.837 48.4697 159.002 46.496C160.167 44.5224 161.739 43.0131 163.778 42.0263C165.759 41.0395 168.03 40.517 170.535 40.517C171.991 40.517 173.389 40.6912 174.729 40.9814C176.069 41.3297 177.292 41.736 178.457 42.3165L177.35 45.6833C175.02 44.5804 172.807 44.058 170.71 44.058C168.962 44.058 167.39 44.4643 166.05 45.2189C164.71 45.9736 163.662 47.0765 162.963 48.5277C162.205 49.9789 161.856 51.7784 161.856 53.8101C161.856 55.6096 162.147 57.235 162.73 58.6281C163.312 60.0213 164.186 61.1242 165.409 61.9949C166.632 62.8076 168.205 63.214 170.069 63.214C170.943 63.214 171.758 63.1559 172.632 62.9818C173.506 62.8076 174.263 62.6335 175.02 62.3432V57.1769H169.137V53.8101H179.273V64.5491C177.816 65.2456 176.302 65.7681 174.671 66.1164C173.04 66.4647 171.467 66.6388 169.894 66.6388C167.215 66.6388 165.001 66.1164 163.079 65.0715Z" fill="white"/>
-<path d="M194.592 66.2916C194.417 65.537 194.359 64.7243 194.301 63.7955C193.602 64.6082 192.786 65.2467 191.68 65.8272C190.631 66.4077 189.408 66.6399 188.01 66.6399C186.903 66.6399 185.913 66.4077 185.039 66.0014C184.166 65.595 183.408 64.9565 182.884 64.0858C182.36 63.215 182.069 62.1702 182.069 60.9511C182.069 59.0936 182.709 57.6424 184.049 56.5395C185.389 55.4365 187.602 54.9141 190.69 54.9141C191.854 54.9141 193.02 54.9722 194.126 55.1463V54.798C194.126 53.1146 193.777 51.9536 193.078 51.2571C192.379 50.5605 191.33 50.2122 189.991 50.2122C189.059 50.2122 188.068 50.3283 187.02 50.6185C185.971 50.9088 185.039 51.199 184.224 51.6054L183.525 48.4707C184.282 48.1225 185.331 47.7742 186.612 47.4839C187.894 47.1937 189.233 47.0195 190.631 47.0195C192.262 47.0195 193.66 47.2517 194.825 47.7742C195.99 48.2966 196.864 49.1093 197.505 50.3283C198.145 51.5473 198.495 53.1727 198.495 55.2044V62.7506C198.495 63.5633 198.553 64.7243 198.611 66.2916H194.592ZM192.029 62.7506C192.961 62.3443 193.66 61.7638 194.243 61.1253V57.5843C193.078 57.4682 192.087 57.4102 191.33 57.4102C189.525 57.4102 188.301 57.7004 187.602 58.2809C186.903 58.8614 186.554 59.616 186.554 60.6029C186.554 61.5316 186.787 62.2282 187.311 62.6926C187.835 63.157 188.476 63.3892 189.35 63.3892C190.224 63.4472 191.097 63.215 192.029 62.7506Z" fill="white"/>
-<path d="M201.931 61.7631V39.3564L206.242 39.0081V61.0085C206.242 61.8212 206.358 62.4017 206.65 62.7499C206.941 63.0982 207.349 63.2724 207.989 63.2724C208.281 63.2724 208.63 63.2143 209.154 63.0982L209.679 66.2329C209.271 66.407 208.747 66.5231 208.164 66.6392C207.582 66.7553 206.999 66.8133 206.475 66.8133C203.446 66.6392 201.931 65.0138 201.931 61.7631Z" fill="white"/>
-<path d="M212.766 61.7631V39.3564L217.077 39.0081V61.0085C217.077 61.8212 217.193 62.4017 217.484 62.7499C217.776 63.0982 218.183 63.2724 218.824 63.2724C219.115 63.2724 219.465 63.2143 219.989 63.0982L220.513 66.2329C220.106 66.407 219.581 66.5231 218.999 66.6392C218.416 66.7553 217.834 66.8133 217.31 66.8133C214.281 66.6392 212.766 65.0138 212.766 61.7631Z" fill="white"/>
-<path d="M238.337 57.3523H225.872C226.047 61.2996 227.969 63.3313 231.58 63.3313C232.454 63.3313 233.386 63.2152 234.318 62.983C235.25 62.7508 236.124 62.4605 236.998 62.1122L237.93 65.0727C235.774 66.1176 233.386 66.64 230.765 66.64C228.726 66.64 227.037 66.2337 225.639 65.479C224.241 64.7244 223.193 63.6215 222.494 62.1703C221.795 60.7191 221.445 59.0357 221.445 57.004C221.445 54.9142 221.795 53.1147 222.552 51.6055C223.309 50.0962 224.299 48.9353 225.639 48.1226C226.979 47.3099 228.493 46.9036 230.241 46.9036C232.046 46.9036 233.561 47.3099 234.726 48.1806C235.949 48.9933 236.823 50.1543 237.405 51.5474C237.988 52.9406 238.279 54.5079 238.279 56.1913V57.3523H238.337ZM234.085 54.624C234.027 53.1147 233.619 51.9538 232.92 51.1991C232.221 50.4445 231.347 50.0382 230.182 50.0382C229.076 50.0382 228.144 50.4445 227.445 51.1991C226.687 51.9538 226.221 53.1147 225.988 54.566H234.085V54.624Z" fill="white"/>
-<path d="M241.599 52.0697C241.599 51.0249 241.541 49.4576 241.483 47.3098H245.56C245.618 47.8322 245.677 48.4707 245.735 49.2254C245.793 49.98 245.851 50.5605 245.851 51.0249C246.376 50.2122 246.842 49.5156 247.366 48.9351C247.832 48.3546 248.414 47.8903 249.055 47.542C249.696 47.1937 250.453 47.0195 251.269 47.0195C251.968 47.0195 252.492 47.0776 253.016 47.2517L252.492 51.0249C252.084 50.9088 251.618 50.8507 251.094 50.8507C250.045 50.8507 249.172 51.0829 248.414 51.6053C247.657 52.1278 246.842 52.9985 245.968 54.1595V66.3496H241.658V52.0697H241.599Z" fill="white"/>
-<path d="M255.463 74.0694C254.822 73.9533 254.298 73.8372 253.89 73.6631L254.706 70.5285C254.997 70.5865 255.346 70.7026 255.812 70.7606C256.278 70.8187 256.686 70.8767 257.094 70.8767C259.016 70.8767 260.472 69.6577 261.404 67.1616L261.695 66.4651L254.706 47.3672H259.365L262.919 58.0481C263.501 59.8476 263.851 61.2988 264.025 62.2275C264.375 60.8344 264.724 59.4993 265.19 58.1061L268.744 47.3091H273.112L266.122 66.5231C265.482 68.3226 264.724 69.8319 263.967 70.9348C263.21 72.0377 262.278 72.8504 261.288 73.4309C260.239 73.9533 259.016 74.2435 257.501 74.2435C256.802 74.2435 256.103 74.1855 255.463 74.0694Z" fill="white"/>
-<path d="M91.6658 16.6012H99.4129L99.18 18.4587H93.9375V22.0577H98.8887V23.7992H93.9375V27.8045H99.4712L99.2964 29.6621H91.6658V16.6012Z" fill="white"/>
-<path d="M104.772 23.0446L100.694 16.6012H103.257L106.053 21.3031L108.966 16.6012H111.471L107.393 22.9285L111.762 29.7201H109.141L105.995 24.5538L102.791 29.7201H100.287L104.772 23.0446Z" fill="white"/>
-<path d="M113.451 16.6012H117.004C118.693 16.6012 119.975 16.9495 120.849 17.6461C121.722 18.3426 122.188 19.3295 122.188 20.6065C122.188 21.4773 122.014 22.2319 121.606 22.8704C121.198 23.509 120.674 24.0314 119.917 24.3797C119.218 24.728 118.402 24.9021 117.47 24.9021C116.946 24.9021 116.363 24.8441 115.723 24.728V29.7201H113.451V16.6012ZM119.159 22.4641C119.625 21.9997 119.858 21.4192 119.858 20.6065C119.858 19.7939 119.625 19.2134 119.101 18.8651C118.635 18.5168 117.878 18.3426 116.946 18.3426H115.723V22.9865C116.305 23.1026 116.713 23.1026 117.004 23.1026C117.994 23.1026 118.693 22.8704 119.159 22.4641Z" fill="white"/>
-<path d="M124.46 16.6012H126.732V27.8045H132.207L132.033 29.7201H124.518V16.6012H124.46Z" fill="white"/>
-<path d="M135.644 29.0821C134.653 28.5597 133.954 27.747 133.43 26.7602C132.906 25.7734 132.673 24.6124 132.673 23.2773C132.673 21.8841 132.964 20.6651 133.488 19.6202C134.013 18.5754 134.828 17.7627 135.818 17.2403C136.867 16.6598 138.032 16.3695 139.43 16.3695C140.77 16.3695 141.876 16.6598 142.867 17.1822C143.799 17.7046 144.556 18.5173 145.08 19.5042C145.604 20.491 145.837 21.6519 145.837 22.929C145.837 24.3222 145.546 25.5412 145.022 26.5861C144.498 27.6309 143.682 28.4436 142.692 28.966C141.702 29.5465 140.478 29.8368 139.139 29.8368C137.741 29.8948 136.576 29.6046 135.644 29.0821ZM141.527 27.4568C142.168 27.0504 142.634 26.47 142.983 25.7153C143.274 24.9607 143.449 24.09 143.449 23.1612C143.449 22.2324 143.333 21.3617 143.041 20.6651C142.75 19.9105 142.342 19.33 141.702 18.9237C141.061 18.4593 140.304 18.2851 139.313 18.2851C138.381 18.2851 137.624 18.5173 136.983 18.9237C136.343 19.3881 135.877 19.9685 135.527 20.7232C135.178 21.4778 135.061 22.2905 135.061 23.2192C135.061 24.148 135.236 25.0187 135.527 25.7734C135.818 26.528 136.284 27.1085 136.925 27.5729C137.566 28.0373 138.323 28.2114 139.255 28.2114C140.129 28.0953 140.886 27.9212 141.527 27.4568Z" fill="white"/>
-<path d="M148.342 16.6012H152.478C153.993 16.6012 155.099 16.8914 155.915 17.4719C156.73 18.0524 157.08 18.9231 157.08 20.0261C157.08 20.7226 156.963 21.3612 156.672 21.8836C156.381 22.406 156.031 22.8704 155.624 23.1607C155.216 23.509 154.808 23.7411 154.342 23.9153L158.42 29.7201H155.74L152.303 24.4958H150.614V29.7201H148.342V16.6012ZM151.896 22.8124C152.42 22.8124 152.944 22.6963 153.352 22.4641C153.76 22.2319 154.109 21.9416 154.342 21.5353C154.575 21.129 154.692 20.6646 154.692 20.2002C154.692 19.5617 154.459 19.0392 154.051 18.749C153.643 18.4587 153.002 18.2846 152.245 18.2846H150.614V22.7543H151.896V22.8124Z" fill="white"/>
-<path d="M160.167 16.6012H167.914L167.681 18.4587H162.439V22.0577H167.39V23.7992H162.439V27.8045H167.972L167.798 29.6621H160.167V16.6012Z" fill="white"/>
-<path d="M176.36 16.6012H178.632V29.7201H176.36V16.6012Z" fill="white"/>
-<path d="M184.689 18.459H180.612L180.787 16.5434H191.039L190.806 18.459H186.903V29.7204H184.631V18.459H184.689Z" fill="white"/>
-<path d="M200.941 29.0821C199.951 28.5597 199.252 27.747 198.728 26.7602C198.204 25.7734 197.971 24.6124 197.971 23.2773C197.971 21.8841 198.262 20.6651 198.786 19.6202C199.31 18.5754 200.126 17.7627 201.116 17.2403C202.165 16.6598 203.329 16.3695 204.727 16.3695C206.067 16.3695 207.174 16.6598 208.164 17.1822C209.096 17.7046 209.853 18.5173 210.378 19.5042C210.902 20.491 211.135 21.6519 211.135 22.929C211.135 24.3222 210.844 25.5412 210.319 26.5861C209.795 27.6309 208.98 28.4436 207.989 28.966C206.999 29.5465 205.776 29.8368 204.436 29.8368C203.038 29.8948 201.873 29.6046 200.941 29.0821ZM206.824 27.4568C207.465 27.0504 207.931 26.47 208.281 25.7153C208.572 24.9607 208.747 24.09 208.747 23.1612C208.747 22.2324 208.63 21.3617 208.339 20.6651C208.048 19.9105 207.64 19.33 206.999 18.9237C206.358 18.4593 205.601 18.2851 204.611 18.2851C203.679 18.2851 202.922 18.5173 202.281 18.9237C201.64 19.3881 201.174 19.9685 200.825 20.7232C200.475 21.4778 200.359 22.2905 200.359 23.2192C200.359 24.148 200.534 25.0187 200.825 25.7734C201.116 26.528 201.582 27.1085 202.223 27.5729C202.863 28.0373 203.621 28.2114 204.553 28.2114C205.368 28.0953 206.184 27.9212 206.824 27.4568Z" fill="white"/>
-<path d="M213.64 16.6012H216.261L222.785 26.7597C222.727 25.7728 222.727 24.9021 222.727 24.0894V16.6012H224.824V29.7201H222.319L215.678 19.3875C215.737 20.5485 215.795 21.5934 215.795 22.5221V29.7201H213.698V16.6012H213.64Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M59.6287 16.6586H35.4553C24.0384 16.6586 19.9027 20.8381 19.9027 32.1575V56.2476C19.9027 67.6251 24.0967 71.7465 35.4553 71.7465H59.6287C71.0455 71.7465 75.1812 67.5671 75.1812 56.2476V32.1575C75.2395 20.8381 71.0455 16.6586 59.6287 16.6586Z" fill="#C8102E"/>
-<path d="M30.8537 44.2326H32.3099V51.4306H30.8537V48.5282H27.5335V51.4306H26.0773V44.2326H27.5335V47.135H30.8537V44.2326ZM39.1251 48.354C39.1251 49.515 38.5426 50.1535 37.4941 50.1535C36.4456 50.1535 35.8631 49.515 35.8631 48.296V44.2326H34.4069V48.354C34.4069 50.3857 35.5136 51.5467 37.4941 51.5467C39.4746 51.5467 40.6396 50.3857 40.6396 48.296V44.2326H39.1833V48.354H39.1251ZM56.0756 49.1667L54.4446 44.2326H53.2214L51.5904 49.1667L50.0177 44.2326H48.445L50.9497 51.4306H52.1729L53.8039 46.6706L55.4349 51.4306H56.6581L59.1628 44.2326H57.6483L56.0756 49.1667ZM61.8423 48.354H64.5218V47.0189H61.8423V45.5677H65.745V44.2326H60.4443V51.4306H65.9197V50.0955H61.9005V48.354H61.8423ZM67.609 51.4306H69.0652V44.2326H67.609V51.4306ZM43.4938 49.9213L42.853 51.4306H41.3385L44.484 44.2326H45.7655L48.9109 51.4306H47.3965L46.7557 49.9213H43.4938ZM44.018 48.6443H46.2315L45.1247 46.0901L44.018 48.6443Z" fill="white"/>
-<path d="M47.571 35.0605C42.5034 35.0605 38.3677 30.939 38.3677 25.8888H39.6492C39.6492 30.2424 43.2023 33.7834 47.571 33.7834C51.9397 33.7834 55.4929 30.2424 55.4929 25.8888H56.7744C56.7744 30.939 52.6387 35.0605 47.571 35.0605Z" fill="white"/>
-</svg>
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg
deleted file mode 100644
index c10de98a..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg height="16" width="16" xmlns="http://www.w3.org/2000/svg"><g stroke="#888a85"><path d="m8 2.34c-2.87.015-5.51.594-5.5 1.69v7.95c-.025 2.2 11 2.31 11 0v-7.95c.006-1.16-2.64-1.71-5.5-1.69z" fill="#eee"/><path d="m2.5 7.91c-.025 2.2 11 2.31 11 0m-11-3.97c-.025 2.2 11 2.31 11 0" fill="none"/></g></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg.license
deleted file mode 100644
index 8b15d9c8..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconDbSchema.svg.license
+++ /dev/null
@@ -1 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg
deleted file mode 100644
index 5d27bac2..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M1.5 2.501V13.75s.019.75.75.75h11.5s.749 0 .749-.75L14.5 4.5H9.2l-2-2H1.5z" fill="#eee" stroke="#888a85"/></svg>
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg.license
deleted file mode 100644
index 0a5c5d75..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconFolder.svg.license
+++ /dev/null
@@ -1,2 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
-
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg
deleted file mode 100644
index 673f25f7..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg height="16" width="16" xmlns="http://www.w3.org/2000/svg"><path d="m6.333 2h4.334v4.333h-4.334z" fill="#aec7e2"/><path d="m2 2h4.333v4.333h-4.333zm4.333 4.333h4.334v4.334h-4.334zm4.334-4.333h4.333v4.333h-4.333z" fill="#2b3b4d"/><path d="m2 6.333h4.333v4.334h-4.333zm8.667 0h4.333v4.334h-4.333zm-4.334 4.334h4.334v4.333h-4.334z" fill="#aec7e2"/><path d="m2 10.667h4.333v4.333h-4.333z" fill="#2b3b4d"/></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg.license
deleted file mode 100644
index 0a5c5d75..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconRaster.svg.license
+++ /dev/null
@@ -1,2 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
-
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg
deleted file mode 100644
index 04721728..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg height="16" width="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="4.5" x2="9.5" y1="2.5" y2="14.5"><stop offset="0" stop-color="#f1f1f1"/><stop offset="1" stop-color="#d6d6d6"/></linearGradient><g fill-rule="evenodd" stroke="#888a85" stroke-linecap="round" stroke-linejoin="round" transform="translate(0 -16)"><rect fill="url(#a)" height="15" rx="1" transform="translate(0 16)" width="13" x="1.5" y=".5"/><g fill="#eeeeec"><path d="m1.5 4.5h13" transform="translate(0 16)"/><path d="m3.5 23.5h2"/><path d="m3.5 26.5h2"/><path d="m3.5 29.5h2"/><path d="m8.5 23.5h4"/><path d="m8.4378776 26.458275 4.0621224.041725"/><path d="m8.5 29.5h4"/><path d="m3.5710868 2.5057164 1.9289132-.0057164" transform="translate(0 16)"/><path d="m8.5 2.5h4" transform="translate(0 16)"/></g></g></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg.license
deleted file mode 100644
index 0a5c5d75..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconTableLayer.svg.license
+++ /dev/null
@@ -1,2 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
-
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg
deleted file mode 100644
index 4fa1fa5e..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#eeeeec" stroke="#888a85" d="M1.5 1.5h13v13h-13z"/><path d="M5 2v4c0 1.1.895 2 2 2s2-.9 2-2V2z" fill="#888a85"/><path d="M7 2v1h1V2zm0 1H6v1h1zm0 1v1h1V4zm0 1H6v1h1zm0 1v1c.552 0 1-.5 1-1z" fill="#555"/><path d="M6 2v1h1V2zm0 2v1h1V4zm0 2c0 .5.448 1 1 1V6z" fill="#ddd"/><path d="M7 3h1v1H7zm0 2h1v1H7z" fill="#cfcfcf"/><path d="M7 7c-1.105 0-2 .9-2 2v4c0 1.1.895 2 2 2s2-.9 2-2V9c0-1.1-.895-2-2-2zm0 1c.552 0 1 .4 1 1 0 .5-.448 1-1 1s-1-.5-1-1c0-.6.448-1 1-1zm0 3c.552 0 1 .4 1 1v1c0 .5-.448 1-1 1s-1-.5-1-1v-1c0-.6.448-1 1-1zM6 1h1v1H6z" fill="#555"/><path fill="#cfcfcf" d="M7 1h1v1H7z"/></svg>
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg.license
deleted file mode 100644
index 0a5c5d75..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/mIconZip.svg.license
+++ /dev/null
@@ -1,2 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
-
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg b/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg
deleted file mode 100644
index 315de6be..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg height="16" viewBox="0 0 66.666 66.667" width="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a"><stop offset="0" stop-color="#589632"/><stop offset="1" stop-color="#93b023"/></linearGradient><linearGradient id="b" gradientUnits="userSpaceOnUse" x1="45.722" x2="44.919" xlink:href="#a" y1="55.358" y2="2.524"/><linearGradient id="c" gradientUnits="userSpaceOnUse" x1="30.064" x2="29.267" xlink:href="#a" y1="57.105" y2="4.712"/><path d="m35.527 34.956h8.19l-6.931-6.853h-8.492v8.16l7.233 7.21z" fill="#ee7913"/><path d="m61.796 51.022-14.613-14.446h-8.23v8.504l14.003 13.957h8.84z" fill="url(#b)" transform="translate(0 1.806)"/><path d="m38.953 38.381h8.23l-3.466-3.425h-8.19v8.516l3.426 3.415z" fill="#f0e64a"/><path d="m37.335 48.978a17.173 17.173 0 0 1 -3.862.44c-9.52 0-17.616-7.828-17.616-17.977 0-10.15 8.007-17.805 17.616-17.805 9.608 0 17.259 7.655 17.259 17.805a19.351 19.351 0 0 1 -.586 4.744l8.811 8.809c2.272-3.98 3.543-8.608 3.543-13.621 0-15.643-12.484-27.356-29.206-27.356-16.645 0-29.128 11.636-29.128 27.356 0 15.798 12.484 27.664 29.128 27.664 4.298 0 8.314-.79 11.91-2.228z" fill="url(#c)" transform="translate(0 1.806)"/><path d="m28.294 28.103 33.502 32.74v-8.016l-14.613-14.444-3.466-3.426-6.931-6.853z" fill="#fff" fill-opacity=".172"/></svg>
\ No newline at end of file
diff --git a/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg.license b/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg.license
deleted file mode 100644
index 8b15d9c8..00000000
--- a/web-app/packages/lib-vue2/src/assets/qgis-icons/providerQgis.svg.license
+++ /dev/null
@@ -1 +0,0 @@
-SPDX-License-Identifier: GPL-2.0-or-later
diff --git a/web-app/packages/lib-vue2/src/common/components/ActionButton.vue b/web-app/packages/lib-vue2/src/common/components/ActionButton.vue
deleted file mode 100644
index e5646e1d..00000000
--- a/web-app/packages/lib-vue2/src/common/components/ActionButton.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-btn
-    v-bind="$attrs"
-    v-on="$listeners"
-    :class="`${colorClass} white--text font-weight-bold ${
-      // TODO: start to work in Vue 3 (remove this comment after upgrade to vue 3) - https://v3-migration.vuejs.org/breaking-changes/attrs-includes-class-style.html#attrs-includes-class-style
-      $attrs.class ? $attrs.class : ''
-    }`"
-  >
-    <span class="mr-2 d-inline-flex">
-      <slot name="icon" />
-    </span>
-    <span>
-      <slot />
-    </span>
-  </v-btn>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'ActionButton',
-  props: {
-    colorClass: { type: String, default: 'primary' }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/CustomPage.vue b/web-app/packages/lib-vue2/src/common/components/CustomPage.vue
deleted file mode 100644
index 57fdafc9..00000000
--- a/web-app/packages/lib-vue2/src/common/components/CustomPage.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div class="main-window">
-    <v-layout justify-center align-end shrink>
-      <v-img
-        contain
-        max-width="300"
-        position="center bottom"
-        :transition="false"
-      />
-    </v-layout>
-
-    <v-container class="py-1">
-      <div class="form-wrapper">
-        <!-- slot for e.g. v-card in view component -->
-        <slot />
-      </div>
-    </v-container>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'CustomPage'
-})
-</script>
-
-<style lang="scss" scoped>
-.main-window {
-  font-family: Inter, sans-serif;
-  position: fixed;
-  justify-content: center;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-
-  // TODO: linear-Gradient for Tomas
-  background-image: linear-gradient(#eeeeee, #e6e6e6);
-  display: flex;
-  flex-direction: column;
-  z-index: 100;
-  overflow: auto;
-
-  .bg {
-    position: absolute;
-    left: 0;
-    top: 0;
-    height: 100%;
-    width: 100%;
-    object-fit: cover;
-  }
-
-  .container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 0 0 auto;
-  }
-  .form-wrapper {
-    display: flex;
-    background: linear-gradient(90deg, #2d052d 50%, #00a884 50%);
-    box-shadow: 0 0.5rem 1rem 1px rgba(0, 0, 0, 0.45);
-    //TODO: Size of padding for "purple and green" [] for Tomas
-    border-radius: 5px;
-    padding: 20px;
-  }
-  @media (max-width: 480px) {
-    .form-wrapper {
-      //TODO: Size of padding for "purple and green" [] for Tomas - mobile
-      padding: 10px;
-    }
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/common/components/FullStorageWarning.vue b/web-app/packages/lib-vue2/src/common/components/FullStorageWarning.vue
deleted file mode 100644
index 7e4965f5..00000000
--- a/web-app/packages/lib-vue2/src/common/components/FullStorageWarning.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <FullStorageWarningTemplate :usage="usage"></FullStorageWarningTemplate>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import FullStorageWarningTemplate from './FullStorageWarningTemplate.vue'
-
-export default defineComponent({
-  name: 'FullStorageWarning',
-  components: { FullStorageWarningTemplate },
-  props: {
-    usage: Number,
-    username: String
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/FullStorageWarningTemplate.vue b/web-app/packages/lib-vue2/src/common/components/FullStorageWarningTemplate.vue
deleted file mode 100644
index 3d4ce3ae..00000000
--- a/web-app/packages/lib-vue2/src/common/components/FullStorageWarningTemplate.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card
-    class="bubble mt-3"
-    style="background-color: #fce8e6; color: rgba(0, 0, 0, 0.87)"
-    outlined
-  >
-    <span>
-      <b>Your storage is almost full ({{ usage }}%).</b> Soon you will not be
-      able to sync your projects.
-      <slot name="buttons"></slot>
-    </span>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'FullStorageWarningTemplate',
-  props: {
-    usage: Number
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/GlobalWarning.vue b/web-app/packages/lib-vue2/src/common/components/GlobalWarning.vue
deleted file mode 100644
index 056a4fc7..00000000
--- a/web-app/packages/lib-vue2/src/common/components/GlobalWarning.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<!--  this is merely a placeholder for some custom warning to be added into page view -->
-<template>
-  <global-warning-template />
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import GlobalWarningTemplate from '@/common/components/GlobalWarningTemplate.vue'
-
-export default defineComponent({
-  name: 'GlobalWarning',
-  components: { GlobalWarningTemplate }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/GlobalWarningTemplate.vue b/web-app/packages/lib-vue2/src/common/components/GlobalWarningTemplate.vue
deleted file mode 100644
index 53ea773b..00000000
--- a/web-app/packages/lib-vue2/src/common/components/GlobalWarningTemplate.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <slot name="warning"></slot>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'GlobalWarningTemplate'
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/MerginLogoLight.vue b/web-app/packages/lib-vue2/src/common/components/MerginLogoLight.vue
deleted file mode 100644
index d80fd7bf..00000000
--- a/web-app/packages/lib-vue2/src/common/components/MerginLogoLight.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-responsive class="mt-2">
-    <img
-      src="@/assets/MM_logo_HORIZ_color.svg"
-      alt="Mergin logo"
-      @click="$emit('click')"
-    />
-  </v-responsive>
-</template>
diff --git a/web-app/packages/lib-vue2/src/common/components/ProgressSpinner.vue b/web-app/packages/lib-vue2/src/common/components/ProgressSpinner.vue
deleted file mode 100644
index f308e37a..00000000
--- a/web-app/packages/lib-vue2/src/common/components/ProgressSpinner.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-progress-circular class="mx-2" :size="22" :width="3" indeterminate />
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'ProgressSpinner'
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/UploadProgress.vue b/web-app/packages/lib-vue2/src/common/components/UploadProgress.vue
deleted file mode 100644
index 9c97e1ac..00000000
--- a/web-app/packages/lib-vue2/src/common/components/UploadProgress.vue
+++ /dev/null
@@ -1,77 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-snackbar v-if="list.length" bottom right :timeout="-1" :value="visible">
-    <v-layout column>
-      <v-layout
-        class="py-1 row align-center justify-space-between"
-        v-for="(upload, project) in uploads"
-        :key="project"
-      >
-        <span>{{ project }}</span>
-        <v-progress-circular
-          :size="55"
-          :width="8"
-          :value="(upload.loaded / upload.total) * 100"
-          color="teal"
-        >
-          {{ Math.floor((upload.loaded / upload.total) * 100) }}%
-        </v-progress-circular>
-      </v-layout>
-    </v-layout>
-  </v-snackbar>
-</template>
-
-<script lang="ts">
-import debounce from 'lodash/debounce'
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'upload-progress',
-  data() {
-    return {
-      visible: false
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, ['uploads']),
-    list() {
-      return Object.values(this.uploads)
-    },
-    uploading() {
-      return this.list.some((u) => u.running)
-    }
-  },
-  watch: {
-    uploading: 'updateVisibility'
-  },
-  methods: {
-    updateVisibility: debounce(function (value) {
-      this.visible = value
-    }, 500)
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-::v-deep(*) {
-  .v-snack__content {
-    padding: 0.75em 1em;
-  }
-
-  .v-progress-circular__overlay {
-    transition-duration: 0.2s;
-  }
-}
-
-.row:not(:last-child) {
-  border-bottom: 1px solid #444;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/common/components/UsageStatus.vue b/web-app/packages/lib-vue2/src/common/components/UsageStatus.vue
deleted file mode 100644
index 35ad2121..00000000
--- a/web-app/packages/lib-vue2/src/common/components/UsageStatus.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<!--  this is merely a placeholder -->
-<template>
-  <UsageStatusTemplate></UsageStatusTemplate>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import UsageStatusTemplate from './UsageStatusTemplate.vue'
-
-export default defineComponent({
-  name: 'UsageStatus',
-  components: { UsageStatusTemplate }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/UsageStatusTemplate.vue b/web-app/packages/lib-vue2/src/common/components/UsageStatusTemplate.vue
deleted file mode 100644
index 7f9a214f..00000000
--- a/web-app/packages/lib-vue2/src/common/components/UsageStatusTemplate.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<!--  this is merely a placeholder -->
-<template>
-  <div>
-    <slot name="billing"></slot>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'UsageStatusTemplate'
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/WarningMessage.vue b/web-app/packages/lib-vue2/src/common/components/WarningMessage.vue
deleted file mode 100644
index 8f8c17ed..00000000
--- a/web-app/packages/lib-vue2/src/common/components/WarningMessage.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <warning-message-template v-if="text">
-    <template #message>
-      <span style="margin-left: 10px"> {{ text }}</span>
-    </template>
-  </warning-message-template>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import WarningMessageTemplate from './WarningMessageTemplate.vue'
-
-export default defineComponent({
-  name: 'WarningMessage',
-  components: { WarningMessageTemplate },
-  props: {
-    text: null
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/WarningMessageTemplate.vue b/web-app/packages/lib-vue2/src/common/components/WarningMessageTemplate.vue
deleted file mode 100644
index 26cdab17..00000000
--- a/web-app/packages/lib-vue2/src/common/components/WarningMessageTemplate.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card
-    class="bubble mt-3"
-    style="background-color: #ffc863; color: rgba(0, 0, 0, 0.87); padding: 10px"
-    outlined
-  >
-    <slot name="message"></slot>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'WarningMessageTemplate'
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/common/components/base/BaseItem.vue b/web-app/packages/lib-vue2/src/common/components/base/BaseItem.vue
deleted file mode 100644
index b2c47c66..00000000
--- a/web-app/packages/lib-vue2/src/common/components/base/BaseItem.vue
+++ /dev/null
@@ -1,101 +0,0 @@
-<!--
-Based on template:
-Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-Copyright 2019 Creative Tim (https://www.creative-tim.com)
-
-Modifications by:
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-list-item
-    :href="href"
-    :rel="href && href !== '#' ? 'noopener' : undefined"
-    :target="href && href !== '#' ? '_blank' : undefined"
-    :to="item.to"
-    active-class="baseItemActiveColor"
-  >
-    <v-list-item-icon
-      v-if="text"
-      class="v-list-item__icon--text"
-      v-text="computedText"
-      :class="`${color}--text`"
-    />
-
-    <v-list-item-icon
-      v-else-if="item.icon || item.tablerIcon"
-      class="mr-2"
-      :class="`${color}--text`"
-    >
-      <v-icon v-if="item.icon" :class="`${color}--text`" v-text="item.icon" />
-      <slot v-if="item.tablerIcon" name="icon"></slot>
-    </v-list-item-icon>
-
-    <v-list-item-content
-      v-if="item.title || item.subtitle"
-      :class="`${color}--text`"
-    >
-      <v-list-item-title v-text="item.title" />
-
-      <v-list-item-subtitle v-text="item.subtitle" />
-    </v-list-item-content>
-  </v-list-item>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-// import Themeable from 'vuetify/lib/mixins/themeable'
-
-export default defineComponent({
-  name: 'BaseItem',
-
-  // mixins: [Themeable],
-
-  props: {
-    color: {
-      type: String,
-      default: 'white'
-    },
-    item: {
-      type: Object,
-      default: () => ({
-        href: undefined,
-        icon: undefined,
-        tablerIcon: false,
-        subtitle: undefined,
-        title: undefined,
-        to: undefined
-      })
-    },
-    text: {
-      type: Boolean,
-      default: false
-    }
-  },
-
-  computed: {
-    computedText() {
-      if (!this.item || !this.item.title) return ''
-
-      let text = ''
-
-      this.item.title.split(' ').forEach((val) => {
-        text += val.substring(0, 1)
-      })
-
-      return text
-    },
-    href() {
-      return this.item.href || (this.item.to ? undefined : '#')
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.baseItemActiveColor {
-  background-color: #f3f4f8;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/common/components/base/index.ts b/web-app/packages/lib-vue2/src/common/components/base/index.ts
deleted file mode 100644
index 2e184c3a..00000000
--- a/web-app/packages/lib-vue2/src/common/components/base/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as BaseItem } from './BaseItem.vue'
diff --git a/web-app/packages/lib-vue2/src/common/components/index.ts b/web-app/packages/lib-vue2/src/common/components/index.ts
deleted file mode 100644
index 168cef14..00000000
--- a/web-app/packages/lib-vue2/src/common/components/index.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './base'
-
-export { default as ActionButton } from './ActionButton.vue'
-export { default as CustomPage } from './CustomPage.vue'
-export { default as FullStorageWarning } from './FullStorageWarning.vue'
-export { default as FullStorageWarningTemplate } from './FullStorageWarningTemplate.vue'
-export { default as GlobalWarning } from './GlobalWarning.vue'
-export { default as GlobalWarningTemplate } from './GlobalWarningTemplate.vue'
-export { default as MerginLogoLight } from './MerginLogoLight.vue'
-export { default as ProgressSpinner } from './ProgressSpinner.vue'
-export { default as UploadProgress } from './UploadProgress.vue'
-export { default as UsageStatus } from './UsageStatus.vue'
-export { default as UsageStatusTemplate } from './UsageStatusTemplate.vue'
-export { default as WarningMessage } from './WarningMessage.vue'
-export { default as WarningMessageTemplate } from './WarningMessageTemplate.vue'
diff --git a/web-app/packages/lib-vue2/src/common/date_utils.ts b/web-app/packages/lib-vue2/src/common/date_utils.ts
deleted file mode 100644
index 1747de94..00000000
--- a/web-app/packages/lib-vue2/src/common/date_utils.ts
+++ /dev/null
@@ -1,104 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import diffInDays from 'date-fns/differenceInDays'
-import diffInHours from 'date-fns/differenceInHours'
-import diffInMinutes from 'date-fns/differenceInMinutes'
-import diffInMonths from 'date-fns/differenceInMonths'
-import diffInWeeks from 'date-fns/differenceInWeeks'
-import diffInYears from 'date-fns/differenceInYears'
-import isDate from 'date-fns/isDate'
-import isValid from 'date-fns/isValid'
-
-const DurationKeys = {
-  years: ['year', 'years'],
-  months: ['month', 'months'],
-  weeks: ['week', 'weeks'],
-  days: ['day', 'days'],
-  hours: ['hour', 'hours'],
-  minutes: ['minute', 'minutes']
-}
-
-export function formatDateTime(isoString) {
-  return isoString ? new Date(isoString).toUTCString() : ''
-}
-
-export function formatDate(isoString) {
-  return isoString ? new Date(isoString).toDateString() : ''
-}
-
-function formatDuration(num, unit) {
-  return `${num} ${DurationKeys[unit][num === 1 ? 0 : 1]} ago`
-}
-
-function remainingFormatDuration(num, unit) {
-  return `${num} ${DurationKeys[unit][num === 1 ? 0 : 1]}`
-}
-
-function parseDate(date) {
-  return isDate(date) ? date : new Date(date)
-}
-
-export function formatTimeDiff(t1, t2 = new Date()) {
-  const t1Parsed = parseDate(t1)
-  const t2Parsed = parseDate(t2)
-  if (!isValid(t1Parsed) || !t1) {
-    return '-'
-  }
-  const days = diffInDays(t2Parsed, t1Parsed)
-  if (days > 365) {
-    return formatDuration(diffInYears(t2Parsed, t1Parsed), 'years')
-  }
-  if (days > 31) {
-    return formatDuration(diffInMonths(t2Parsed, t1Parsed), 'months')
-  }
-  if (days > 6) {
-    return formatDuration(diffInWeeks(t2Parsed, t1Parsed), 'weeks')
-  }
-  if (days < 1) {
-    const hours = diffInHours(t2Parsed, t1Parsed)
-    if (hours < 1) {
-      const minutes = diffInMinutes(t2Parsed, t1Parsed)
-      if (minutes < 0) {
-        return 'N/A'
-      }
-      return formatDuration(minutes, 'minutes')
-    }
-    return formatDuration(hours, 'hours')
-  }
-  return formatDuration(days, 'days')
-}
-
-export function formatRemainingTime(t2, t1 = new Date()) {
-  const t1Parsed = parseDate(t1)
-  const t2Parsed = parseDate(t2)
-  if (!isValid(t1Parsed)) {
-    return '-'
-  }
-  const days = diffInDays(t2Parsed, t1Parsed)
-  const hours = diffInHours(t2Parsed, t1Parsed)
-  switch (true) {
-    case days > 365:
-      return remainingFormatDuration(diffInYears(t2Parsed, t1Parsed), 'years')
-    case days > 31:
-      return remainingFormatDuration(diffInMonths(t2Parsed, t1Parsed), 'months')
-    case days > 6:
-      return remainingFormatDuration(diffInWeeks(t2Parsed, t1Parsed), 'weeks')
-    case days < 1:
-      if (days < 0) {
-        return 'expired'
-      }
-      if (hours < 1) {
-        const minutes = diffInMinutes(t2Parsed, t1Parsed)
-        if (minutes <= 0) {
-          return 'expired'
-        } else {
-          return remainingFormatDuration(minutes, 'minutes')
-        }
-      }
-      return remainingFormatDuration(hours, 'hours')
-    default:
-      return remainingFormatDuration(days, 'days')
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/common/error_utils.ts b/web-app/packages/lib-vue2/src/common/error_utils.ts
deleted file mode 100644
index 70817c28..00000000
--- a/web-app/packages/lib-vue2/src/common/error_utils.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import axios from 'axios'
-
-export function getErrorMessage(e: unknown, fallbackMessage?: string) {
-  let text: string
-  if (axios.isAxiosError(e)) {
-    text = e.response.data?.detail ?? fallbackMessage
-  } else if (fallbackMessage) {
-    text = fallbackMessage
-  } else if (e instanceof Error) {
-    text = e.message
-  }
-  return text
-}
diff --git a/web-app/packages/lib-vue2/src/common/errors.ts b/web-app/packages/lib-vue2/src/common/errors.ts
deleted file mode 100644
index 708d73a3..00000000
--- a/web-app/packages/lib-vue2/src/common/errors.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosResponse } from 'axios'
-
-export class CustomError extends Error {
-  response: AxiosResponse
-  constructor(message: string, response) {
-    super(message)
-    Object.setPrototypeOf(this, CustomError.prototype)
-    this.response = response
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/common/html_utils.ts b/web-app/packages/lib-vue2/src/common/html_utils.ts
deleted file mode 100644
index 5d3cad0a..00000000
--- a/web-app/packages/lib-vue2/src/common/html_utils.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export function waitCursor(on: boolean) {
-  document.body.style.cursor = on ? 'wait' : 'default'
-}
-
-export function downloadJsonList(jsonList, headers, filename, output = 'csv') {
-  /** download json as csv, but we need to put it in one level
-   :param jsonList: dict **/
-  if (!jsonList || !headers) {
-    return
-  }
-  headers = headers.filter((h) => h.value)
-  const headerTexts = Object.keys(headers).map(function (key) {
-    return headers[key].text
-  })
-  const headerValues = Object.keys(headers).map(function (key) {
-    return headers[key].value
-  })
-  if (output === 'csv') {
-    let content = headerTexts.join(';') + '\n'
-    jsonList.forEach(function (row) {
-      let currentContent = ''
-      headerValues.forEach(function (header) {
-        const headerSplit = header.split('.')
-        if (headerSplit.length > 1) {
-          currentContent +=
-            (row[headerSplit[0]][headerSplit[1]] !== null
-              ? row[headerSplit[0]][headerSplit[1]]
-              : '') + ';'
-        } else {
-          currentContent += (row[header] !== null ? row[header] : '') + ';'
-        }
-      })
-      content += currentContent + '\n'
-    })
-    const hiddenElement = document.createElement('a')
-    hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(content)
-    hiddenElement.target = '_blank'
-    hiddenElement.download = filename + '.csv'
-    hiddenElement.click()
-    document.removeChild(hiddenElement)
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/common/http.ts b/web-app/packages/lib-vue2/src/common/http.ts
deleted file mode 100644
index 29e61cc3..00000000
--- a/web-app/packages/lib-vue2/src/common/http.ts
+++ /dev/null
@@ -1,149 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import axios, { AxiosInstance, AxiosResponse } from 'axios'
-import axiosRetry, { isNetworkError, isRetryableError } from 'axios-retry'
-import https from 'https'
-
-import { CustomError } from '@/common/errors'
-
-export interface HttpService extends AxiosInstance {
-  absUrl?: (url: string) => string
-  appendParams?: (url: string, params: Record<string, any>) => string
-}
-
-const HTTP: HttpService = axios.create({
-  baseURL: '',
-  withCredentials: true,
-  httpsAgent: new https.Agent({
-    rejectUnauthorized: false
-  }),
-  headers: { 'X-Client': 'vue' },
-  maxContentLength: 4 * 1024 * 1024 * 1024
-})
-
-HTTP.absUrl = function (url) {
-  return HTTP.defaults.baseURL + url
-}
-
-HTTP.appendParams = function (url, params) {
-  const u = new URL(url)
-  for (const key in params) {
-    if (params[key] !== undefined) {
-      u.searchParams.append(key, params[key])
-    }
-  }
-  return u.href
-}
-
-axiosRetry(HTTP, {
-  retries: 0,
-  retryDelay: () => {
-    return 60 * 1000
-  }
-})
-
-export function initRequestInterceptors(
-  isMaintenance: () => boolean,
-  ignoredUrl: string[]
-) {
-  HTTP.interceptors.request.use(
-    (request) => {
-      if (
-        isMaintenance() &&
-        request.method !== 'get' &&
-        !ignoredUrl.some((url) => request.url.includes(url))
-      ) {
-        // mimic regular response object, server will not be called
-        const custError = new CustomError('reason', {
-          data: {
-            detail:
-              'The service is currently in read-only mode for maintenance. Upload and update functions are not available at this time. Please try again later.'
-          },
-          status: 503
-        })
-        return Promise.reject(custError)
-      }
-      return request
-    },
-    (error) => {
-      return Promise.reject(error)
-    }
-  )
-}
-
-export function initResponseInterceptors(authErrorCallback: () => void) {
-  HTTP.interceptors.response.use(
-    (response) => response,
-    (error) => {
-      if (error.response) {
-        // detail is returned from flask_wtf library
-        if (
-          error.response.status === 400 &&
-          error.response.data?.detail === 'The CSRF token has expired.'
-        ) {
-          return HTTP.get('/app/auth/refresh/csrf').then((resp) => {
-            HTTP.defaults.headers.common['X-CSRF-Token'] = resp.data.csrf
-            const config = error.config
-            return restartRequest(config)
-              .then((resp) => {
-                return resp
-              })
-              .catch((err) => {
-                return Promise.reject(err)
-              })
-          })
-        } else {
-          const { status } = error.response
-          if (status === 401) {
-            authErrorCallback()
-          }
-          return Promise.reject(error)
-        }
-      } else {
-        return Promise.reject(error)
-      }
-    }
-  )
-}
-
-export function getHttpService() {
-  return HTTP
-}
-
-export function initCsrfToken(response: AxiosResponse) {
-  const http = getHttpService()
-  http.defaults.headers.common['X-CSRF-Token'] =
-    response.headers['x-csrf-token']
-}
-
-export function postRetryCond(error) {
-  if (!error.config) {
-    return false
-  }
-  return isNetworkError(error) || isRetryableError(error)
-}
-
-export function getDefaultRetryOptions() {
-  return {
-    'axios-retry': {
-      retries: 5,
-      retryCondition: (error) => postRetryCond(error)
-    }
-  }
-}
-
-function restartRequest(request) {
-  request.headers = HTTP.defaults.headers.common
-  // create object from origin request body again
-  request.data = request.data ? JSON.parse(request.data) : request.data
-  return HTTP.request(request)
-}
-
-/**
- * Axios default status codes overwrite for 207
- */
-export function validateStatus(status: number): boolean {
-  return (status >= 200 && status < 207) || (status > 207 && status < 300)
-}
diff --git a/web-app/packages/lib-vue2/src/common/index.ts b/web-app/packages/lib-vue2/src/common/index.ts
deleted file mode 100644
index 14554045..00000000
--- a/web-app/packages/lib-vue2/src/common/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './errors'
-export * from './mixins'
-export * from './http'
-export * from './types'
-export * from './router_without_navigation_failure'
-export * from './http'
-export * as dateUtils from './date_utils'
-export * as errorUtils from './error_utils'
-export * as htmlUtils from './html_utils'
-export * as merginUtils from './mergin_utils'
-export * as moduleUtils from './module_utils'
-export * as numberUtils from './number_utils'
-export * as pathUtils from './path_utils'
-export * as permissionUtils from './permission_utils'
-export * as textUtils from './text_utils'
-export * as routeUtils from './route_utils'
diff --git a/web-app/packages/lib-vue2/src/common/mergin_utils.ts b/web-app/packages/lib-vue2/src/common/mergin_utils.ts
deleted file mode 100644
index 0c485e06..00000000
--- a/web-app/packages/lib-vue2/src/common/mergin_utils.ts
+++ /dev/null
@@ -1,146 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import CryptoJS from 'crypto-js/core'
-import 'crypto-js/sha1'
-import difference from 'lodash/difference'
-
-export const CHUNK_SIZE = 10 * 1024 * 1024
-
-function arrayBufferToWordArray(ab) {
-  const i8a = new Uint8Array(ab)
-  const a = []
-  for (let i = 0; i < i8a.length; i += 4) {
-    a.push((i8a[i] << 24) | (i8a[i + 1] << 16) | (i8a[i + 2] << 8) | i8a[i + 3])
-  }
-  return CryptoJS.lib.WordArray.create(a, i8a.length)
-}
-
-export async function getFiles(rootEntry, configData) {
-  const files = []
-
-  async function traverseFileTree(item, configData, path = null) {
-    if (
-      item.isFile &&
-      configData &&
-      !configData.blacklist_files.includes(item.name)
-    ) {
-      let file
-      if (item.constructor === File) {
-        file = item
-      } else {
-        file = await new Promise((resolve) => item.file(resolve))
-      }
-      const fileInfo = {
-        path: (path || '') + file.name, // save full path
-        size: file.size,
-        mtime: new Date(file.lastModified),
-        file,
-        chunks: calculateChunks(file.size)
-      }
-      files.push(fileInfo)
-    } else if (item.isDirectory) {
-      const dirReader = item.createReader()
-      let entries
-      do {
-        entries = await new Promise((resolve) => dirReader.readEntries(resolve))
-        for (const entry of entries) {
-          if (configData && configData.blacklist_dirs.includes(item.name)) {
-            continue
-          }
-          await traverseFileTree(
-            entry,
-            configData,
-            path === null ? '' : path + item.name + '/'
-          )
-        }
-      } while (entries.length)
-    }
-  }
-
-  await traverseFileTree(rootEntry, configData)
-  return files
-}
-
-export function checksum(file) {
-  return new Promise((resolve) => {
-    const fileSize = file.size
-    const chunkSize = 256 * 1024
-    let offset = 0
-    const hash = CryptoJS.algo.SHA1.create()
-
-    const readEventHandler = (e) => {
-      // offset += e.target.result.length
-      offset += e.target.result.byteLength
-
-      // hash.update(e.target.result)
-      hash.update(arrayBufferToWordArray(e.target.result))
-      if (offset >= fileSize) {
-        const h = hash.finalize()
-        resolve(CryptoJS.enc.Hex.stringify(h))
-      } else {
-        chunkReaderBlock(offset, chunkSize, file)
-      }
-    }
-
-    const chunkReaderBlock = (_offset, length, _file) => {
-      const r = new FileReader()
-      const blob = _file.slice(_offset, length + _offset)
-      r.onload = readEventHandler
-      r.readAsArrayBuffer(blob)
-      // r.readAsText(blob)
-    }
-    chunkReaderBlock(offset, chunkSize, file)
-  })
-}
-
-export function filesDiff(oldFiles, newFiles) {
-  const oFilesPaths = Object.keys(oldFiles).filter((path) => !ignoreFile(path))
-  const nFilesPaths = Object.keys(newFiles).filter((path) => !ignoreFile(path))
-
-  const updated = Object.keys(oldFiles).filter((path) => {
-    const f2 = newFiles[path]
-    return f2 && f2.checksum !== oldFiles[path].checksum
-  })
-  const added = difference(nFilesPaths, oFilesPaths)
-  const removed = difference(oFilesPaths, nFilesPaths)
-
-  const diff = {
-    added,
-    removed,
-    updated
-  }
-  const changes = Object.values(diff).reduce(
-    (sum, list) => sum + list.length,
-    0
-  )
-  // return Object.values(diff).reduce((sum, list) => sum + list.length, 0) ? diff : null
-  return { ...diff, changes }
-}
-
-function splitFilePath(filePath) {
-  const filename = filePath.replace(/^.*\//, '')
-  const extension =
-    filename.lastIndexOf('.') > 0 ? filename.split('.').pop() : ''
-  return { filename, extension }
-}
-
-function ignoreFile(filePath) {
-  const ignoreExt = ['-shm', '-wal', '~', 'pyc', 'swap']
-  const { extension } = splitFilePath(filePath)
-  return new RegExp(`(${ignoreExt.join('|')})$`, 'g').test(extension)
-}
-
-export function isVersionedFile(filePath) {
-  const { extension } = splitFilePath(filePath)
-  return ['gpkg', 'sqlite'].includes(extension)
-}
-
-export function calculateChunks(fileSize) {
-  const chunks = []
-  for (let i = 0; i < Math.ceil(fileSize / CHUNK_SIZE); i++) {
-    chunks.push(Math.random().toString(36).substring(2))
-  }
-  return chunks
-}
diff --git a/web-app/packages/lib-vue2/src/common/mixins/FormMixin.ts b/web-app/packages/lib-vue2/src/common/mixins/FormMixin.ts
deleted file mode 100644
index 418ed2e8..00000000
--- a/web-app/packages/lib-vue2/src/common/mixins/FormMixin.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export default {
-  data() {
-    return {
-      errors: {},
-      errorMsg: null
-    }
-  },
-  methods: {
-    clearErrors() {
-      this.errors = {}
-      this.errorMsg = null
-    },
-    handleError(err, generalMsg = 'Error') {
-      if (typeof err.response.data === 'object') {
-        // two types of error responses
-        if (typeof err.response.data.status === 'number') {
-          this.errorMsg = err.response.data.detail
-        } else {
-          this.errors = err.response.data
-        }
-      } else {
-        this.errorMsg = err.response.data || generalMsg
-      }
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/common/mixins/index.ts b/web-app/packages/lib-vue2/src/common/mixins/index.ts
deleted file mode 100644
index 4b077cc6..00000000
--- a/web-app/packages/lib-vue2/src/common/mixins/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as FormMixin } from './FormMixin'
diff --git a/web-app/packages/lib-vue2/src/common/module_utils.ts b/web-app/packages/lib-vue2/src/common/module_utils.ts
deleted file mode 100644
index 2ecd580f..00000000
--- a/web-app/packages/lib-vue2/src/common/module_utils.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { RouteRecord } from 'vue-router'
-
-import { Module, ModuleService, RouteOverrides } from '@/common/types'
-
-export const initializeAppModule = (
-  module: Module,
-  services?: ModuleService,
-  routeOverrides?: RouteOverrides
-) => {
-  module.init(services, routeOverrides)
-}
-
-function elevateToRouteRecord(
-  route: Partial<RouteRecord>
-): route is RouteRecord {
-  return true
-}
-
-export function applyRouteOverride(
-  route: Partial<RouteRecord>,
-  routeOverrides?: RouteOverrides
-): Partial<RouteRecord> {
-  let overridenRoute = route
-  const routeName: string = route.name as unknown as string
-  if (overridenRoute.children) {
-    overridenRoute.children = route.children.map((child) => {
-      const overridenChild = applyRouteOverride(child, routeOverrides)
-      let result = child
-      // ALWAYS true - this is just hack to cast Partial<RouteRecord> to RouteRecord to get rid of TS error
-      if (elevateToRouteRecord(overridenChild)) {
-        result = overridenChild
-      }
-      return result
-    })
-  } else if (routeOverrides && routeOverrides[routeName]) {
-    overridenRoute = { ...overridenRoute, ...routeOverrides[routeName] }
-  }
-
-  if (routeOverrides && routeOverrides[routeName]) {
-    overridenRoute = { ...overridenRoute, ...routeOverrides[routeName] }
-  }
-  return overridenRoute
-}
diff --git a/web-app/packages/lib-vue2/src/common/number_utils.ts b/web-app/packages/lib-vue2/src/common/number_utils.ts
deleted file mode 100644
index fe254ad8..00000000
--- a/web-app/packages/lib-vue2/src/common/number_utils.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export type SizeUnit = 'GB' | 'MB' | 'kB' | 'B'
-
-const SizeUnits: Record<SizeUnit, (value: number) => string> = {
-  GB: (value) => (value / 1073741824).toFixed(2),
-  MB: (value) => (value / 1048576).toFixed(2),
-  kB: (value) => (value / 1024).toFixed(0),
-  B: (value) => `${Math.round(value)}`
-}
-
-export function formatFileSize(
-  value,
-  unit?: SizeUnit,
-  digits = 2,
-  minUnit: SizeUnit = 'B'
-) {
-  if (!value) {
-    return `${value} MB`
-  }
-  if (!unit) {
-    if (value >= 1073741824 || minUnit === 'GB') {
-      unit = 'GB'
-    } else if (value >= 1048576 || minUnit === 'MB') {
-      unit = 'MB'
-    } else if (value >= 1024 || minUnit === 'kB') {
-      unit = 'kB'
-    } else {
-      unit = 'B'
-    }
-  }
-  let unitsValue = parseFloat(SizeUnits[unit](value))
-  unitsValue = unitsValue === 0 ? Math.pow(10, -digits) : unitsValue
-  return `${unitsValue.toFixed(digits)} ${unit}`
-}
-
-export function formatToCurrency(value: number, currency: string): string {
-  return value.toLocaleString('en-UK', {
-    style: 'currency',
-    currency,
-    currencySign: 'accounting'
-  })
-}
diff --git a/web-app/packages/lib-vue2/src/common/path_utils.ts b/web-app/packages/lib-vue2/src/common/path_utils.ts
deleted file mode 100644
index df8404e5..00000000
--- a/web-app/packages/lib-vue2/src/common/path_utils.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import Path from 'path'
-
-export function dirname(path: string) {
-  const dir = Path.dirname(path).replace(/\/$/, '')
-  return dir === '.' ? '' : dir
-}
diff --git a/web-app/packages/lib-vue2/src/common/permission_utils.ts b/web-app/packages/lib-vue2/src/common/permission_utils.ts
deleted file mode 100644
index 6b02d141..00000000
--- a/web-app/packages/lib-vue2/src/common/permission_utils.ts
+++ /dev/null
@@ -1,150 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export enum UserRole {
-  guest,
-  reader,
-  writer,
-  admin,
-  owner
-}
-
-export enum ProjectRole {
-  none,
-  reader,
-  writer,
-  owner
-}
-
-export type UserRoleName = 'guest' | 'reader' | 'writer' | 'admin' | 'owner'
-
-export type ProjectRoleName =
-  | Extract<UserRoleName, 'reader' | 'writer' | 'owner'>
-  | 'none'
-
-export const USER_ROLE_NAME_BY_ROLE: Record<UserRole, UserRoleName> = {
-  [UserRole.guest]: 'guest',
-  [UserRole.reader]: 'reader',
-  [UserRole.writer]: 'writer',
-  [UserRole.admin]: 'admin',
-  [UserRole.owner]: 'owner'
-}
-
-export const USER_ROLE_LABEL_BY_NAME: Record<UserRoleName, string> = {
-  guest: 'Guest',
-  reader: 'Reader',
-  writer: 'Writer',
-  admin: 'Admin',
-  owner: 'Owner'
-}
-
-export const USER_ROLE_BY_NAME: Record<UserRoleName, UserRole> = {
-  guest: UserRole.guest,
-  reader: UserRole.reader,
-  writer: UserRole.writer,
-  admin: UserRole.admin,
-  owner: UserRole.owner
-}
-
-export const PROJECT_ROLE_NAME_BY_ROLE: Record<ProjectRole, ProjectRoleName> = {
-  [ProjectRole.none]: 'none',
-  [ProjectRole.reader]: 'reader',
-  [ProjectRole.writer]: 'writer',
-  [ProjectRole.owner]: 'owner'
-}
-
-export const PROJECT_ROLE_LABEL_BY_NAME: Record<ProjectRoleName, string> = {
-  none: 'None',
-  reader: 'Reader',
-  writer: 'Writer',
-  owner: 'Owner'
-}
-
-export const PROJECT_ROLE_BY_NAME: Record<ProjectRoleName, ProjectRole> = {
-  none: ProjectRole.none,
-  reader: ProjectRole.reader,
-  writer: ProjectRole.writer,
-  owner: ProjectRole.owner
-}
-
-export interface UserRoleValueForSelect {
-  label: string
-  value: UserRoleName
-}
-
-export enum ProjectPermission {
-  read,
-  write,
-  owner
-}
-
-export type ProjectPermissionName = 'owner' | 'write' | 'read'
-
-export const PROJECT_PERMISSION_NAME_BY_PERMISSION: Record<
-  ProjectPermission,
-  ProjectPermissionName
-> = {
-  [ProjectPermission.read]: 'read',
-  [ProjectPermission.write]: 'write',
-  [ProjectPermission.owner]: 'owner'
-}
-
-export const PROJECT_PERMISSION_LABEL_BY_NAME: Record<
-  ProjectPermissionName,
-  string
-> = {
-  read: 'Read',
-  write: 'Write',
-  owner: 'Owner'
-}
-
-export const PROJECT_PERMISSION_BY_NAME: Record<
-  ProjectPermissionName,
-  ProjectPermission
-> = {
-  read: ProjectPermission.read,
-  write: ProjectPermission.write,
-  owner: ProjectPermission.owner
-}
-
-export interface ProjectPermissionValueForSelect {
-  label: string
-  value: ProjectPermissionName
-}
-
-export function isAtLeastRole(roleName: UserRoleName, role: UserRole): boolean {
-  return USER_ROLE_BY_NAME[roleName] >= role
-}
-
-export function isAtLeastProjectRole(
-  roleName: ProjectRoleName,
-  role: ProjectRole
-): boolean {
-  return PROJECT_ROLE_BY_NAME[roleName] >= role
-}
-
-export function isAtLeastProjectPermission(
-  permissionName: ProjectPermissionName,
-  permission: ProjectPermission
-): boolean {
-  return PROJECT_PERMISSION_BY_NAME[permissionName] >= permission
-}
-
-export function getUserRoleValuesForSelect(
-  roles: UserRoleName[]
-): UserRoleValueForSelect[] {
-  return roles.map((role) => ({
-    value: role,
-    label: USER_ROLE_LABEL_BY_NAME[role]
-  }))
-}
-
-export function getProjectPermissionValuesForSelect(
-  permissions: ProjectPermissionName[]
-): ProjectPermissionValueForSelect[] {
-  return permissions.map((permission) => ({
-    value: permission,
-    label: PROJECT_PERMISSION_LABEL_BY_NAME[permission]
-  }))
-}
diff --git a/web-app/packages/lib-vue2/src/common/route_utils.ts b/web-app/packages/lib-vue2/src/common/route_utils.ts
deleted file mode 100644
index 4889853a..00000000
--- a/web-app/packages/lib-vue2/src/common/route_utils.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import isEqual from 'lodash/isEqual'
-import pick from 'lodash/pick'
-import { Route, NavigationGuardNext } from 'vue-router'
-
-import { useUserStore } from '@/modules/user/store'
-
-export type IsAuthenticatedGuardOptions = {
-  notAuthenticatedRedirectPath?: string
-}
-
-export function isTheSameRoute(from: Route, to: Route) {
-  const properties = ['name', 'path', 'hash', 'params', 'query']
-  return isEqual(pick(from, properties), pick(to, properties))
-}
-
-export function getTagsFromQuery(route: Route) {
-  const tags = route.query.tags
-  return tags ? (typeof tags === 'string' ? tags.split(',') : tags) : []
-}
-
-/** Handles redirect to /login when user is not authenticated. */
-export function isAuthenticatedGuard(
-  to: Route,
-  from: Route,
-  next: NavigationGuardNext,
-  userStore,
-  options?: IsAuthenticatedGuardOptions
-) {
-  if (to.meta.public || userStore.isLoggedIn) {
-    if (isTheSameRoute(from, to)) {
-      return false
-    } else {
-      next()
-    }
-  } else {
-    next({
-      path: options?.notAuthenticatedRedirectPath ?? 'login',
-      // TODO: V3_UPGRADE - check this https://router.vuejs.org/guide/migration/#redirect-records-cannot-use-special-paths
-      query: { redirect: to.fullPath }
-    })
-  }
-}
-
-/** Handles redirect to /login when user is not superUser. */
-export function isSuperUser(
-  to: Route,
-  from: Route,
-  next: NavigationGuardNext,
-  userStore
-) {
-  if (userStore.isSuperUser) {
-    next()
-  } else {
-    next('/login')
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/common/router_without_navigation_failure.ts b/web-app/packages/lib-vue2/src/common/router_without_navigation_failure.ts
deleted file mode 100644
index 24610c32..00000000
--- a/web-app/packages/lib-vue2/src/common/router_without_navigation_failure.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import Router from 'vue-router'
-
-// fixed problem with vue router - catch Detecting Navigation Failures
-
-const originalPush = Router.prototype.push
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-ignore
-Router.prototype.push = function push(location, onResolve, onReject) {
-  if (onResolve || onReject)
-    return originalPush.call(this, location, onResolve, onReject)
-  return originalPush.call(this, location).catch((err) => {
-    if (Router.isNavigationFailure(err)) {
-      // resolve err
-      return err
-    }
-    // rethrow error
-    return Promise.reject(err)
-  })
-}
-
-export { Router }
diff --git a/web-app/packages/lib-vue2/src/common/text_utils.ts b/web-app/packages/lib-vue2/src/common/text_utils.ts
deleted file mode 100644
index ea7bdeda..00000000
--- a/web-app/packages/lib-vue2/src/common/text_utils.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export function formatToTitle(string: string) {
-  string = string.replace(/_/g, ' ')
-  return string.charAt(0).toUpperCase() + string.slice(1)
-}
-
-export function removeAccents(text: string) {
-  return text.normalize('NFD').replace(/[\u0300-\u036f]/g, '')
-}
-
-export function isValidEmail(email: string) {
-  const emailPattern =
-    /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
-  return emailPattern.test(email)
-}
-
-export const EMAIL_LIST_SEPARATORS = /[;, ]/
-export const EMAIL_LIST_DEFAULT_SEPARATOR = ';'
diff --git a/web-app/packages/lib-vue2/src/common/types.ts b/web-app/packages/lib-vue2/src/common/types.ts
deleted file mode 100644
index 2cf1efdb..00000000
--- a/web-app/packages/lib-vue2/src/common/types.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import VueRouter, { RouteRecord } from 'vue-router'
-
-import { HttpService } from '@/common/http'
-
-export type RouteName = string
-export type RouteOverrides = Record<
-  RouteName,
-  // do not allow to override children
-  Partial<Omit<RouteRecord, 'children'>>
->
-
-export interface ModuleService {
-  httpService?: HttpService
-  routerService?: VueRouter
-  [key: string]: any
-}
-
-export interface BaseModule {
-  name: string
-  _addRoutes?: (router, routeOverrides?: RouteOverrides) => void
-  init: (services: ModuleService, routeOverrides?: RouteOverrides) => void
-}
-
-export interface Module extends BaseModule, ModuleService {}
-
-export interface PaginatedGridOptions {
-  sortBy: string[]
-  sortDesc: boolean[]
-  itemsPerPage: number
-  page: number
-}
-
-/* eslint-disable camelcase */
-/**
- * Request parameters for paginated endpoints
- * TODO: remove legacy order_by and descending in components
- */
-export interface PaginatedRequestParams {
-  order_by?: string
-  order_params?: string
-  descending?: boolean
-  per_page: number
-  page: number
-}
-
-/** Stable current request params for paginating endpoints */
-export type PaginatedRequestParamsApi = Omit<
-  PaginatedRequestParams,
-  'order_by' | 'descending'
->
-
-export interface PaginatedResponseDefaults {
-  count: number
-}
-/* eslint-enable camelcase */
-
-export interface PaginatedResponse<T> extends PaginatedResponseDefaults {
-  items: readonly T[]
-}
-
-export interface ApiRequestSuccessInfo<T = any> {
-  success: boolean
-  message?: string
-  data?: T
-}
diff --git a/web-app/packages/lib-vue2/src/env.d.ts b/web-app/packages/lib-vue2/src/env.d.ts
deleted file mode 100644
index 89cc8af8..00000000
--- a/web-app/packages/lib-vue2/src/env.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-/// <reference types="vite/client" />
-
-interface ImportMetaEnv {
-  readonly VITE_VUE_APP_JOIN_COMMUNITY_LINK: string
-}
-
-interface ImportMeta {
-  readonly env: ImportMetaEnv
-}
diff --git a/web-app/packages/lib-vue2/src/main.ts b/web-app/packages/lib-vue2/src/main.ts
deleted file mode 100644
index 2c60d992..00000000
--- a/web-app/packages/lib-vue2/src/main.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from '@/common'
-export * from '@/modules'
diff --git a/web-app/packages/lib-vue2/src/modules/app/index.ts b/web-app/packages/lib-vue2/src/modules/app/index.ts
deleted file mode 100644
index 4fec72e2..00000000
--- a/web-app/packages/lib-vue2/src/modules/app/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './module'
-export * from './store'
diff --git a/web-app/packages/lib-vue2/src/modules/app/module.ts b/web-app/packages/lib-vue2/src/modules/app/module.ts
deleted file mode 100644
index a83924a0..00000000
--- a/web-app/packages/lib-vue2/src/modules/app/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const AppModule: Module = {
-  name: 'instanceModule',
-  init: (_services) => {
-    // none initialization required
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/app/store.ts b/web-app/packages/lib-vue2/src/modules/app/store.ts
deleted file mode 100644
index 8686d6e5..00000000
--- a/web-app/packages/lib-vue2/src/modules/app/store.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-
-export interface AppState {
-  serverError: string
-}
-
-export const useAppStore = defineStore('appModule', {
-  state: (): AppState => ({
-    serverError: null // TODO: global - check if used
-  }),
-
-  actions: {
-    setServerError(msg) {
-      this.serverError = msg
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardAccessRequestsRow.vue b/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardAccessRequestsRow.vue
deleted file mode 100644
index c117d66c..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardAccessRequestsRow.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-row v-if="currentNamespace && accessRequests && accessRequestsCount > 0">
-    <v-card class="bubble mt-3">
-      <h3>Project access requests</h3>
-      <v-card-text>
-        <slot name="table" :namespace="currentNamespace"></slot>
-      </v-card-text>
-    </v-card>
-  </v-row>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'DashboardAccessRequestsRow',
-  computed: {
-    ...mapState(useProjectStore, [
-      'accessRequests',
-      'accessRequestsCount',
-      'currentNamespace'
-    ])
-  },
-  watch: {
-    currentNamespace: {
-      immediate: true,
-      async handler(value) {
-        if (value) {
-          await this.initNamespaceAccessRequests({
-            namespace: value
-          })
-        }
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['initNamespaceAccessRequests'])
-  }
-})
-</script>
-
-<style scoped lang="scss">
-@use '@/sass/dashboard';
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardFullStorageWarningRow.vue b/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardFullStorageWarningRow.vue
deleted file mode 100644
index 2146dcb2..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardFullStorageWarningRow.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-row v-if="usage > 90">
-    <slot :usage="usage" :username="loggedUser.username" />
-  </v-row>
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'DashboardFullStorageWarningRow',
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-
-    usage() {
-      return Math.floor(
-        (this.loggedUser?.disk_usage / this.loggedUser?.storage) * 100
-      )
-    }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardProjectsRow.vue b/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardProjectsRow.vue
deleted file mode 100644
index 5cdd8f65..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardProjectsRow.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-row>
-    <v-col class="pa-0">
-      <v-card class="bubble mt-3" :outlined="true" color="white">
-        <h3>Recent active projects</h3>
-        <v-card-text style="padding-left: 0">
-          <slot name="projects"></slot>
-        </v-card-text>
-      </v-card>
-    </v-col>
-  </v-row>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'DashboardProjectsRow'
-})
-</script>
-
-<style scoped lang="scss">
-@use '@/sass/dashboard';
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardUsageInfoRow.vue b/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardUsageInfoRow.vue
deleted file mode 100644
index c3fa8c9b..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/components/DashboardUsageInfoRow.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <usage-status />
-    <dashboard-full-storage-warning-row v-slot="{ usage, username }">
-      <full-storage-warning :usage="usage" :username="username" />
-    </dashboard-full-storage-warning-row>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import FullStorageWarning from '@/common/components/FullStorageWarning.vue'
-import UsageStatus from '@/common/components/UsageStatus.vue'
-import DashboardFullStorageWarningRow from '@/modules/dashboard/components/DashboardFullStorageWarningRow.vue'
-
-export default defineComponent({
-  name: 'DashboardUsageInfoRow',
-  components: {
-    DashboardFullStorageWarningRow,
-    FullStorageWarning,
-    UsageStatus
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/components/index.ts b/web-app/packages/lib-vue2/src/modules/dashboard/components/index.ts
deleted file mode 100644
index 1b385bfb..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/components/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as DashboardAccessRequestsRow } from './DashboardAccessRequestsRow.vue'
-export { default as DashboardFullStorageWarningRow } from './DashboardFullStorageWarningRow.vue'
-export { default as DashboardProjectsRow } from './DashboardProjectsRow.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/index.ts b/web-app/packages/lib-vue2/src/modules/dashboard/index.ts
deleted file mode 100644
index 988b25fa..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './module'
-export * from './views'
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/module.ts b/web-app/packages/lib-vue2/src/modules/dashboard/module.ts
deleted file mode 100644
index c7ce50aa..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const DashboardModule: Module = {
-  name: 'dashboardModule',
-  init: (_services) => {
-    // nothing to do
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/views/DashboardViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/dashboard/views/DashboardViewTemplate.vue
deleted file mode 100644
index 6d333358..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/views/DashboardViewTemplate.vue
+++ /dev/null
@@ -1,196 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <page-view
-    :style="`padding-left: ${
-      drawer ? 280 : 20
-    }px; overflow-y: auto; padding-right:20px; margin-right: 0px;`"
-  >
-    <v-layout class="column fill-height main-content">
-      <v-container>
-        <slot name="usageInfo" />
-        <v-row v-if="projectsCount === 0 && canCreateProject">
-          <v-card outlined class="bubble mt-3">
-            <h3>Welcome {{ loggedUser.username }}, are you ready to start?</h3>
-            <p>
-              First create new project, add people to it or explore public
-              project for more inspiration
-            </p>
-            <v-btn color="orange" @click="newProjectDialog"
-              ><span style="color: white">New project</span>
-            </v-btn>
-          </v-card>
-        </v-row>
-        <v-row>
-          <v-col class="pa-0">
-            <v-card class="bubble mt-3" outlined>
-              <h3>Download Mergin Maps Input app</h3>
-              <p>
-                Capture geo-info easily through your mobile/tablet with the
-                Mergin Maps Input app. Designed to be compatible with all mobile
-                devices - even those with small screens.
-              </p>
-              <v-row>
-                <v-col cols="7" md="3" sm="3">
-                  <div class="store-button">
-                    <a
-                      href="https://play.google.com/store/apps/details?id=uk.co.lutraconsulting&utm_source=mergin-website&utm_medium=banner&utm_campaign=input"
-                      target="_blank"
-                    >
-                      <img
-                        alt="Get it on Google Play"
-                        src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png"
-                        height="70px"
-                      />
-                    </a>
-                  </div>
-                </v-col>
-                <v-col cols="7" md="3" sm="3">
-                  <div class="store-button app-store-button">
-                    <a
-                      href="https://apps.apple.com/us/app/input/id1478603559?ls=1&utm_source=mergin-website&utm_medium=banner&utm_campaign=input"
-                      target="_blank"
-                    >
-                      <img
-                        alt="Get it on Apple store"
-                        src="@/assets/App_Store.svg"
-                        height="48px"
-                      />
-                    </a>
-                  </div>
-                </v-col>
-                <v-col cols="7" md="3" sm="3">
-                  <div class="store-button huawei-store-button">
-                    <a
-                      href="https://appgallery.huawei.com/app/C104422773"
-                      target="_blank"
-                    >
-                      <img
-                        alt="Explore it on AppGallery"
-                        src="@/assets/huawei.svg"
-                        height="48px"
-                      />
-                    </a>
-                  </div>
-                </v-col>
-              </v-row>
-            </v-card>
-          </v-col>
-        </v-row>
-        <slot name="content"></slot>
-      </v-container>
-    </v-layout>
-  </page-view>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules'
-import PageView from '@/modules/layout/components/PageView.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import ProjectForm from '@/modules/project/components/ProjectForm.vue'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'DashboardViewTemplate',
-  components: {
-    PageView
-  },
-  props: {
-    canCreateProject: {
-      type: Boolean,
-      default: false
-    }
-  },
-  computed: {
-    ...mapState(useLayoutStore, ['drawer']),
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useProjectStore, ['projectsCount'])
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['show']),
-
-    newProjectDialog() {
-      const dialog = { maxWidth: 500, persistent: true }
-      this.show({
-        component: ProjectForm,
-        params: {
-          dialog
-        }
-      })
-    }
-  }
-})
-</script>
-
-<style scoped lang="scss">
-@use '@/sass/dashboard';
-
-.v-navigation-drawer {
-  -webkit-overflow-scrolling: touch;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  left: 0;
-  max-width: 100%;
-  overflow: hidden;
-  pointer-events: auto;
-  top: 0;
-  -webkit-transition-duration: 0.2s;
-  transition-duration: 0.2s;
-  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  will-change: transform;
-  -webkit-transition-property: width, -webkit-transform;
-  transition-property: width, -webkit-transform;
-  transition-property: transform, width;
-  transition-property: transform, width, -webkit-transform;
-}
-
-.store-button {
-  text-align: center;
-}
-
-.app-store-button {
-  padding-top: 11px;
-}
-
-.huawei-store-button {
-  padding-top: 10px;
-}
-
-@media only screen and (max-width: 599px) {
-  .store-button {
-    text-align: left;
-  }
-
-  .app-store-button {
-    padding-left: 12px;
-    padding-top: 0;
-  }
-  .huawei-store-button {
-    padding-left: 12px;
-    padding-top: 0;
-  }
-}
-
-@media only screen and (min-width: 600px) and (max-width: 960px) {
-  .app-store-button {
-    margin-left: 25%;
-  }
-  .huawei-store-button {
-    margin-left: 35%;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/dashboard/views/index.ts b/web-app/packages/lib-vue2/src/modules/dashboard/views/index.ts
deleted file mode 100644
index 4895a11d..00000000
--- a/web-app/packages/lib-vue2/src/modules/dashboard/views/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as DashboardViewTemplate } from './DashboardViewTemplate.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/components/ConfirmDialog.vue b/web-app/packages/lib-vue2/src/modules/dialog/components/ConfirmDialog.vue
deleted file mode 100644
index fc0880c4..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/components/ConfirmDialog.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card>
-    <v-card-title class="text-h5">{{ headline }}</v-card-title>
-    <v-card-text v-html="text" />
-    <v-card-actions>
-      <v-text-field
-        v-if="confirmField"
-        autofocus
-        :label="confirmField.label"
-        v-model="confirmValue"
-        style="margin-left: 15px"
-      />
-      <v-spacer />
-      <v-btn text @click="close">
-        {{ cancelText }}
-      </v-btn>
-      <v-btn :disabled="!isConfirmed" color="primary" @click="confirm">
-        {{ confirmText }}
-      </v-btn>
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules/dialog/store'
-
-export default defineComponent({
-  name: 'confirm-dialog',
-  props: {
-    text: String,
-    confirmField: Object,
-    confirmText: {
-      type: String,
-      default: 'Ok'
-    },
-    cancelText: {
-      type: String,
-      default: 'Cancel'
-    },
-    headline: {
-      type: String,
-      default: 'Confirm'
-    }
-  },
-  data() {
-    return {
-      confirmValue: ''
-    }
-  },
-  computed: {
-    isConfirmed() {
-      return this.confirmField
-        ? this.confirmField.expected === this.confirmValue
-        : true
-    }
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['close']),
-
-    confirm() {
-      this.close()
-      this.$emit('confirm')
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/components/DialogWindows.vue b/web-app/packages/lib-vue2/src/modules/dialog/components/DialogWindows.vue
deleted file mode 100644
index 862a6e51..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/components/DialogWindows.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-dialog :value="isDialogOpen" v-bind="dialogProps" @input="close">
-    <component
-      v-if="params"
-      :is="component"
-      v-bind="params.props"
-      v-on="dialogListeners"
-    />
-  </v-dialog>
-</template>
-
-<script lang="ts">
-import { mapState, mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules/dialog/store'
-
-export default defineComponent({
-  computed: {
-    ...mapState(useDialogStore, [
-      'isDialogOpen',
-      'params',
-      'component',
-      'dialogProps'
-    ]),
-
-    dialogListeners() {
-      return this.params?.listeners ?? {}
-    }
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['close'])
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/components/index.ts b/web-app/packages/lib-vue2/src/modules/dialog/components/index.ts
deleted file mode 100644
index 0cb0af89..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/components/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as DialogWindows } from './DialogWindows.vue'
-export { default as ConfirmDialog } from './ConfirmDialog.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/index.ts b/web-app/packages/lib-vue2/src/modules/dialog/index.ts
deleted file mode 100644
index 3e416868..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './store'
-export * from './module'
-export * from './types'
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/module.ts b/web-app/packages/lib-vue2/src/modules/dialog/module.ts
deleted file mode 100644
index 656a5964..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const DialogModule: Module = {
-  name: 'dialogModule',
-  init: (_services) => {
-    // none initialization required
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/store.ts b/web-app/packages/lib-vue2/src/modules/dialog/store.ts
deleted file mode 100644
index 43f61c46..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/store.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-import { markRaw } from 'vue'
-
-import { DialogParams, DialogPayload } from './types'
-
-export interface DialogState {
-  isDialogOpen: boolean
-  params: DialogParams
-  // VUE3_UPGRADE add import { Component } from 'vue' as type
-  component: any
-}
-
-export const useDialogStore = defineStore('dialogModule', {
-  state: (): DialogState => ({
-    isDialogOpen: false,
-    params: null,
-    component: null
-  }),
-
-  getters: {
-    dialogProps(state) {
-      return state.params ? state.params.dialog : {}
-    }
-  },
-
-  actions: {
-    openDialog(payload: DialogPayload) {
-      this.isDialogOpen = true
-      this.params = { ...payload.params }
-      this.component = markRaw(payload.component)
-    },
-    closeDialog() {
-      this.isDialogOpen = false
-      this.component = null
-    },
-    changeParams(payload: { params: DialogParams }) {
-      this.params = payload.params
-    },
-    show(payload: DialogPayload) {
-      this.openDialog({
-        params: { ...payload.params },
-        component: payload.component
-      })
-    },
-    close() {
-      this.closeDialog()
-      if (this.params?.dialog && !this.params.dialog.keepAlive) {
-        setTimeout(() => {
-          this.changeParams({ params: null })
-        }, 300)
-      }
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/dialog/types.ts b/web-app/packages/lib-vue2/src/modules/dialog/types.ts
deleted file mode 100644
index 8eea0fa4..00000000
--- a/web-app/packages/lib-vue2/src/modules/dialog/types.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-// import Vue, { Component } from 'vue'
-
-export interface DialogParams {
-  dialog: Record<string, unknown>
-  // TODO: clear unknown based on 'on-listener' in template
-  listeners?: unknown | Record<string, (...args: unknown[]) => void>
-  props?: Record<string, unknown>
-}
-
-export interface DialogPayload {
-  params: DialogParams
-  component: any
-}
diff --git a/web-app/packages/lib-vue2/src/modules/form/MerginComponentUuidMixin.ts b/web-app/packages/lib-vue2/src/modules/form/MerginComponentUuidMixin.ts
deleted file mode 100644
index 756dc455..00000000
--- a/web-app/packages/lib-vue2/src/modules/form/MerginComponentUuidMixin.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import uniqueId from 'lodash/uniqueId'
-
-/**
- * Adds globally unique id to each instance of project component.
- */
-export default {
-  data() {
-    return {
-      merginComponentUuid: uniqueId()
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/form/index.ts b/web-app/packages/lib-vue2/src/modules/form/index.ts
deleted file mode 100644
index a90cc24f..00000000
--- a/web-app/packages/lib-vue2/src/modules/form/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './module'
-export * from './store'
-export { default as MerginComponentUuidMixin } from './MerginComponentUuidMixin'
diff --git a/web-app/packages/lib-vue2/src/modules/form/module.ts b/web-app/packages/lib-vue2/src/modules/form/module.ts
deleted file mode 100644
index 844bf07a..00000000
--- a/web-app/packages/lib-vue2/src/modules/form/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const FormModule: Module = {
-  name: 'formModule',
-  init: (_services) => {
-    // none initialization required
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/form/store.ts b/web-app/packages/lib-vue2/src/modules/form/store.ts
deleted file mode 100644
index 428459b6..00000000
--- a/web-app/packages/lib-vue2/src/modules/form/store.ts
+++ /dev/null
@@ -1,78 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-import Vue from 'vue'
-
-import {
-  ClearErrorsPayload,
-  FormErrors,
-  HandleErrorPayload,
-  MerginComponentUuid,
-  MerginComponentUuidPayload,
-  SetFormErrorPayload
-} from '@/modules/form/types'
-import { useNotificationStore } from '@/modules/notification/store'
-
-export interface FormState {
-  errors: Record<MerginComponentUuid, FormErrors>
-}
-
-export const useFormStore = defineStore('formModule', {
-  state: (): FormState => ({
-    errors: {}
-  }),
-
-  getters: {
-    getErrorByComponentId: (state) => (payload: MerginComponentUuid) => {
-      return state.errors[payload]
-    }
-  },
-
-  actions: {
-    setFormErrors(payload: SetFormErrorPayload) {
-      Vue.set(this.errors, payload.componentId, payload.errors)
-    },
-    resetFormErrors(payload: MerginComponentUuidPayload) {
-      Vue.delete(this.errors, payload.componentId)
-    },
-    clearErrors(payload: ClearErrorsPayload) {
-      const notificationStore = useNotificationStore()
-      this.resetFormErrors(payload)
-      if (!payload.keepNotification) {
-        // reset error message in notification component
-        notificationStore.closeNotification()
-      }
-    },
-    async handleError(payload: HandleErrorPayload) {
-      let errorMessage
-      const notificationStore = useNotificationStore()
-      if (typeof payload.error?.response?.data === 'object') {
-        // two types of error responses
-        // TODO: Get data from HTTP status code, handle formError not standard error with detail
-        if (
-          typeof payload.error.response.data.status === 'number' ||
-          payload.error.response.data.detail
-        ) {
-          errorMessage = payload.error.response.data.detail
-        } else {
-          this.setFormErrors({
-            componentId: payload.componentId,
-            errors: payload.error.response.data
-          })
-        }
-      } else {
-        errorMessage =
-          payload?.error?.response?.data ??
-          payload.generalMessage ??
-          payload?.error ??
-          'Error'
-      }
-      if (errorMessage) {
-        // show error message in notification component
-        await notificationStore.error({ text: errorMessage })
-      }
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/form/types.ts b/web-app/packages/lib-vue2/src/modules/form/types.ts
deleted file mode 100644
index ba7fc545..00000000
--- a/web-app/packages/lib-vue2/src/modules/form/types.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosError } from 'axios'
-
-export type MerginComponentUuid = string
-export type FormInputError = string
-export type FormErrors = Record<string, FormInputError[]>
-export type FormErrorMessage = string | undefined
-export type FormErrorsData =
-  | FormErrorMessage
-  | FormErrors
-  | { status: number; detail: FormErrorMessage }
-
-export interface MerginComponentUuidPayload {
-  componentId: MerginComponentUuid
-}
-export interface SetFormErrorPayload extends MerginComponentUuidPayload {
-  errors: FormErrors
-}
-
-export interface ClearErrorsPayload extends MerginComponentUuidPayload {
-  keepNotification?: boolean
-}
-
-export interface HandleErrorPayload extends MerginComponentUuidPayload {
-  error: AxiosError<FormErrorsData>
-  generalMessage: FormErrorMessage
-}
diff --git a/web-app/packages/lib-vue2/src/modules/index.ts b/web-app/packages/lib-vue2/src/modules/index.ts
deleted file mode 100644
index 67c0624e..00000000
--- a/web-app/packages/lib-vue2/src/modules/index.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './app'
-export * from './form'
-export * from './project'
-export * from './user'
-export * from './notification'
-export * from './dialog'
-export * from './dashboard'
-export * from './layout'
-export * from './instance'
-export * from './types'
diff --git a/web-app/packages/lib-vue2/src/modules/instance/index.ts b/web-app/packages/lib-vue2/src/modules/instance/index.ts
deleted file mode 100644
index d5bed772..00000000
--- a/web-app/packages/lib-vue2/src/modules/instance/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './module'
-export * from './store'
-export * from './instanceApi'
-export * from './types'
diff --git a/web-app/packages/lib-vue2/src/modules/instance/instanceApi.ts b/web-app/packages/lib-vue2/src/modules/instance/instanceApi.ts
deleted file mode 100644
index ac4e811a..00000000
--- a/web-app/packages/lib-vue2/src/modules/instance/instanceApi.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosResponse } from 'axios'
-
-import { InstanceModule } from '@/modules/instance/module'
-import {
-  ConfigResponse,
-  InitResponse,
-  PingResponse
-} from '@/modules/instance/types'
-
-export const InstanceApi = {
-  getInit: (): Promise<AxiosResponse<InitResponse>> => {
-    return InstanceModule.httpService.get('/app/init')
-  },
-  getPing: (): Promise<AxiosResponse<PingResponse>> => {
-    return InstanceModule.httpService.get('/ping')
-  },
-  getConfig: (): Promise<AxiosResponse<ConfigResponse>> => {
-    return InstanceModule.httpService.get('/config')
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/instance/module.ts b/web-app/packages/lib-vue2/src/modules/instance/module.ts
deleted file mode 100644
index 408ed406..00000000
--- a/web-app/packages/lib-vue2/src/modules/instance/module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const InstanceModule: Module = {
-  name: 'instanceModule',
-  httpService: undefined,
-  init: (services) => {
-    if (services.httpService) {
-      InstanceModule.httpService = services.httpService
-    } else {
-      console.error(`Module ${InstanceModule.name} - missing httpService`)
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/instance/store.ts b/web-app/packages/lib-vue2/src/modules/instance/store.ts
deleted file mode 100644
index bda7b1c0..00000000
--- a/web-app/packages/lib-vue2/src/modules/instance/store.ts
+++ /dev/null
@@ -1,83 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-
-import { InstanceApi } from '@/modules/instance/instanceApi'
-import {
-  ConfigResponse,
-  InitResponse,
-  PingResponse
-} from '@/modules/instance/types'
-import { useNotificationStore } from '@/modules/notification/store'
-import { useUserStore } from '@/modules/user/store'
-
-export interface InstanceState {
-  initData: InitResponse
-  initialized: boolean
-  pingData?: PingResponse
-  configData?: ConfigResponse
-}
-
-export const useInstanceStore = defineStore('instanceModule', {
-  state: (): InstanceState => ({
-    initData: undefined,
-    initialized: false,
-    pingData: undefined,
-    configData: undefined
-  }),
-
-  actions: {
-    setConfigData(payload: ConfigResponse) {
-      this.configData = payload
-    },
-    setInitData(payload: InitResponse) {
-      this.initData = payload
-    },
-    setPingData(payload: PingResponse) {
-      this.pingData = payload
-    },
-    setInitialized() {
-      this.initialized = true
-    },
-    async initApp() {
-      const notificationStore = useNotificationStore()
-      try {
-        const response = await InstanceApi.getInit()
-        this.setInitData(response.data)
-        const userStore = useUserStore()
-        if (response.data?.authenticated) {
-          // fetch user profile if user is logged in
-          await userStore.fetchUserProfile()
-        }
-        this.setInitialized()
-        return response
-      } catch {
-        notificationStore.error({ text: 'Failed to init application.' })
-      }
-    },
-
-    async fetchPing() {
-      const notificationStore = useNotificationStore()
-      try {
-        const response = await InstanceApi.getPing()
-        this.setPingData(response.data)
-        return response
-      } catch {
-        await notificationStore.error({ text: 'Failed to fetch ping data.' })
-      }
-    },
-
-    async fetchConfig() {
-      const notificationStore = useNotificationStore()
-      try {
-        const response = await InstanceApi.getConfig()
-        this.setConfigData(response.data)
-        return response
-      } catch {
-        await notificationStore.error({ text: 'Failed to fetch config data.' })
-      }
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/instance/types.ts b/web-app/packages/lib-vue2/src/modules/instance/types.ts
deleted file mode 100644
index 898b967a..00000000
--- a/web-app/packages/lib-vue2/src/modules/instance/types.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-/* eslint-disable camelcase */
-export interface InitResponse {
-  authenticated: boolean
-  superuser?: boolean
-}
-
-export interface PingResponse {
-  maintenance: boolean
-  status: string
-}
-
-export interface BaseConfigResponse {
-  blacklist_dirs: string[]
-  blacklist_files: string[]
-  docs_url: string
-  serverType: string
-  version: string
-  major?: number
-  minor?: number
-  fix?: number
-}
-
-export type ConfigResponse = BaseConfigResponse &
-  Record<string, string | number | boolean | undefined | null>
-/* eslint-enable camelcase */
diff --git a/web-app/packages/lib-vue2/src/modules/layout/components/AppHeaderTemplate.vue b/web-app/packages/lib-vue2/src/modules/layout/components/AppHeaderTemplate.vue
deleted file mode 100644
index 6085e68e..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/components/AppHeaderTemplate.vue
+++ /dev/null
@@ -1,271 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-layout
-    class="row shrink align-end justify-center header"
-    v-bind:class="{ primary: isPrimary }"
-  >
-    <v-layout class="content">
-      <router-link class="logo" :to="{ name: 'home' }">
-        <img src="@/assets/MM_logo_HORIZ_NEG_color.svg" alt="Mergin logo" />
-      </router-link>
-
-      <slot name="menu">
-        <v-btn
-          class="mr-3 toggle-toolbar small-screen"
-          elevation="1"
-          fab
-          small
-          @click="setDrawer({ drawer: !drawer })"
-        >
-          <v-icon v-if="drawer" class="primary--text">
-            fa-angle-double-left
-          </v-icon>
-          <v-icon v-else class="primary--text"> fa-angle-double-right</v-icon>
-        </v-btn>
-        <v-spacer />
-      </slot>
-      <v-menu
-        v-if="loggedUser && loggedUser.email"
-        :min-width="150"
-        bottom
-        left
-        offset-y
-        origin="top right"
-        transition="scale-transition"
-        id="user-menu"
-      >
-        <template v-slot:activator="{ on }">
-          <v-btn
-            v-on="on"
-            text
-            dark
-            :ripple="false"
-            class="icon-btn"
-            data-cy="app-header-btn"
-          >
-            <div class="mr-2" style="position: relative; align-self: flex-end">
-              <v-icon size="35">account_circle</v-icon>
-              <slot name="invitationsIcon"></slot>
-            </div>
-            <div class="accountWrapper">
-              <div class="accountNameWrapper">
-                <span class="accountName font-weight-bold">
-                  {{ getUserFullName }}
-                </span>
-                <v-icon small>keyboard_arrow_down</v-icon>
-              </div>
-              <div v-if="renderNamespace" class="namespace font-weight-bold">
-                {{ currentNamespace || 'no workspace' }}
-              </div>
-            </div>
-          </v-btn>
-        </template>
-
-        <v-list dense>
-          <v-list-item class="pb-1">
-            <div class="user-name">
-              <strong> {{ getUserFullName }} </strong>
-              <span class="caption"> {{ this.loggedUser.email }} </span>
-            </div>
-          </v-list-item>
-          <v-divider class="mx-4 my-1"></v-divider>
-          <v-list-item
-            :to="{
-              name: 'user_profile',
-              params: { name: loggedUser.username }
-            }"
-            data-cy="app-header-profile"
-            class="menuItemProfile"
-          >
-            Your Profile
-          </v-list-item>
-          <v-list-item @click="logout" data-cy="app-header-logout">
-            <span class="menuItem"> Sign Out </span>
-          </v-list-item>
-          <slot name="menuItems"></slot>
-        </v-list>
-      </v-menu>
-    </v-layout>
-  </v-layout>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useLayoutStore } from '@/modules/layout/store'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'app-header-template',
-  props: {
-    isPrimary: {
-      type: Boolean,
-      default: true
-    },
-    renderNamespace: {
-      type: Boolean,
-      default: true
-    }
-  },
-  computed: {
-    ...mapState(useLayoutStore, ['drawer']),
-    ...mapState(useUserStore, ['loggedUser', 'getUserFullName']),
-    ...mapState(useProjectStore, ['currentNamespace']),
-    profileUrl() {
-      return {
-        name: 'user',
-        params: { username: this.loggedUser?.username }
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useLayoutStore, ['setDrawer']),
-    ...mapActions(useUserStore, { logoutUser: 'logout' }),
-
-    async logout() {
-      try {
-        await this.logoutUser()
-        if (this.$route.path === '/') {
-          location.reload()
-        } else {
-          location.href = '/'
-        }
-      } catch (e) {
-        console.error(e)
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.header {
-  padding: 0 0.5em;
-  position: relative;
-  min-height: 63px;
-  flex-shrink: 0;
-  z-index: 7;
-
-  .content {
-    height: 63px;
-    align-items: center;
-  }
-
-  .v-btn:hover:before {
-    background-color: #fff;
-  }
-
-  .v-btn:before {
-    background-color: transparent;
-  }
-
-  .v-btn {
-    letter-spacing: normal;
-  }
-
-  .accountWrapper {
-    display: flex;
-    flex-direction: column;
-  }
-
-  .accountNameWrapper {
-    display: flex;
-    flex-direction: row;
-  }
-
-  .accountName {
-    flex: 1;
-    text-align: left;
-    align-self: center;
-    font-size: 12px;
-  }
-
-  .namespace {
-    font-size: 12px;
-    margin-right: 5px;
-    text-align: left;
-  }
-
-  a {
-    color: #fff;
-    min-width: 2em;
-    margin: 0.35em 0.25em;
-    padding: 0.35em 0.75em;
-    text-decoration: none;
-    font-weight: 500;
-    /*font-size: 110%;*/
-    font-size: 15.4px;
-
-    &.active {
-      color: orange;
-    }
-
-    &.logo {
-      padding: 0;
-      margin: 0 1em;
-      height: inherit;
-      position: relative;
-
-      img {
-        height: inherit;
-        width: auto;
-        padding: 0.25em 0;
-      }
-    }
-  }
-}
-
-.user-name {
-  display: flex;
-  flex-direction: column;
-}
-
-@media (min-width: 960px) {
-  .small-screen {
-    display: none;
-  }
-}
-
-.v-btn {
-  text-transform: none;
-}
-
-.menu-sub-title {
-  font-weight: 700 !important;
-}
-
-.menu-sub-content {
-  padding-left: 16px;
-  cursor: pointer;
-  width: 100%;
-}
-
-.menuItemProfile {
-  padding-top: 5px;
-}
-
-.menuItem {
-  padding-top: 5px;
-  padding-bottom: 5px;
-}
-
-.menu-sub-content:hover,
-.pointer:hover {
-  opacity: 0.5;
-}
-
-.pointer {
-  cursor: pointer;
-}
-
-.icon-btn:before {
-  display: none;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/components/PageView.vue b/web-app/packages/lib-vue2/src/modules/layout/components/PageView.vue
deleted file mode 100644
index f08dd115..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/components/PageView.vue
+++ /dev/null
@@ -1,83 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-layout row justify-center align-start fill-height my-1>
-    <slot name="left">
-      <v-spacer class="hidden-md-and-down" />
-    </slot>
-    <slot />
-    <slot name="right">
-      <v-spacer class="hidden-md-and-down" />
-    </slot>
-    <a
-      class="btn slack-link"
-      v-if="slackLink"
-      :href="slackLink"
-      target="_blank"
-    >
-      <message-icon class="primary--text"></message-icon>
-    </a>
-    <p class="version hidden-md-and-down">Version: {{ version }}</p>
-  </v-layout>
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { MessageIcon } from 'vue-tabler-icons'
-
-import { useInstanceStore } from '@/modules/instance/store'
-
-export default defineComponent({
-  components: { MessageIcon },
-  computed: {
-    ...mapState(useInstanceStore, ['configData']),
-    version() {
-      return `${this.configData?.server_type?.toUpperCase()} ${
-        this.configData?.version
-      }`
-    },
-    slackLink() {
-      return import.meta.env.VITE_VUE_APP_JOIN_COMMUNITY_LINK
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.version {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  margin: 0.25em 0.5em;
-  opacity: 0.75;
-  font-size: 12px;
-}
-
-::v-deep(.main-content) {
-  width: 800px;
-  margin: 0 1em;
-  @media (max-width: 1264px) {
-    width: 100%;
-  }
-}
-
-.slack-link {
-  position: fixed;
-  bottom: 25px;
-  right: 20px;
-  width: 60px;
-  height: 60px;
-  background: #eaebef;
-  border-radius: 50%;
-  text-decoration: none;
-  text-align: center;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/components/SideBarItem.vue b/web-app/packages/lib-vue2/src/modules/layout/components/SideBarItem.vue
deleted file mode 100644
index fbf95ca3..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/components/SideBarItem.vue
+++ /dev/null
@@ -1,70 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import BaseItem from '@/common/components/base/BaseItem.vue'
-
-export default defineComponent({
-  props: {
-    item: Object,
-    idx: Number
-  },
-  components: { BaseItem }
-})
-</script>
-
-<template>
-  <div>
-    <base-item
-      :id="`item-${idx}`"
-      :key="`item-${idx}`"
-      :item="item"
-      color="primary"
-      class="ma-0"
-      data-cy="side-bar-main-items"
-    >
-      <template #icon>
-        <slot name="icon"></slot>
-      </template>
-    </base-item>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.primary.v-list-item--active.v-list-item {
-  background-color: #b0b1b5 !important;
-}
-
-.theme--dark.v-list-item:not(.v-list-item--active):not(.v-list-item--disabled) {
-  color: #2d4470 !important;
-}
-
-.v-list-item--link:hover {
-  background: rgba(0, 0, 0, 0.04) !important;
-}
-
-.theme--dark.v-card.v-list-item.v-list-item--link {
-  min-height: 20px !important;
-  padding: 5px 0 5px 0 !important;
-}
-
-::v-deep(.v-list-item) {
-  font-size: 14px;
-  color: #444;
-  min-height: 32px;
-
-  .v-list-item__content {
-    padding: 0;
-  }
-}
-
-a {
-  text-decoration: none;
-  margin-top: 5px;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/components/SideBarTemplate.vue b/web-app/packages/lib-vue2/src/modules/layout/components/SideBarTemplate.vue
deleted file mode 100644
index f1c41865..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/components/SideBarTemplate.vue
+++ /dev/null
@@ -1,119 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-navigation-drawer
-    class="user-side-bar d-flex align-start flex-column mb-6"
-    id="core-navigation-drawer-user"
-    v-model="drawer"
-    :expand-on-hover="expandOnHover"
-    :right="$vuetify.rtl"
-    mobile-breakpoint="960"
-    :dark="barColor !== 'rgba(228, 226, 226, 1), rgba(255, 255, 255, 0.7)'"
-    app
-    width="200"
-    v-bind="$attrs"
-    v-if="loggedUser"
-    data-cy="side-bar"
-  >
-    <div style="height: 100%">
-      <v-card
-        class="d-flex flex-column"
-        flat
-        tile
-        style="height: 100%; width: 200px"
-        :outlined="true"
-      >
-        <v-card class="pa-2" tile :outlined="true" style="margin-top: 40px">
-          <slot name="items"></slot>
-          <v-divider style="width: 90%; margin: 5px 0 5px 0" />
-          <v-list nav flat>
-            <side-bar-item
-              id="item-userProfile"
-              key="item-userProfile"
-              :item="profileItem"
-            >
-              <template #icon>
-                <component :is="profileItem.tablerIcon"></component>
-              </template>
-            </side-bar-item>
-          </v-list>
-        </v-card>
-        <slot name="footer"></slot>
-      </v-card>
-    </div>
-  </v-navigation-drawer>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { UserIcon } from 'vue-tabler-icons'
-
-import SideBarItem from '@/modules/layout/components/SideBarItem.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'SideBarTemplate',
-  components: {
-    SideBarItem,
-    UserIcon
-  },
-  props: {
-    expandOnHover: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data: function () {
-    return {
-      profileItem: {
-        title: 'User profile',
-        to: '/profile',
-        tablerIcon: 'user-icon'
-      }
-    }
-  },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useLayoutStore, {
-      barColor: 'barColor',
-      drawerState: 'drawer'
-    }),
-    drawer: {
-      get() {
-        return this.drawerState
-      },
-      set(val) {
-        this.setDrawer({ drawer: val })
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useLayoutStore, ['setDrawer'])
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.theme--dark.v-navigation-drawer {
-  background-color: #eaebef !important;
-}
-
-.theme--dark.v-navigation-drawer .v-divider {
-  border-color: #f3f4f8;
-}
-
-.theme--dark.v-card {
-  background-color: #eaebef !important;
-}
-
-.v-application .white--text {
-  color: #2d4470 !important;
-  caret-color: #2d4470 !important;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/components/index.ts b/web-app/packages/lib-vue2/src/modules/layout/components/index.ts
deleted file mode 100644
index 2c66aaee..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/components/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as AppHeaderTemplate } from './AppHeaderTemplate.vue'
-export { default as PageView } from './PageView.vue'
-export { default as SideBarItem } from './SideBarItem.vue'
-export { default as SideBarTemplate } from './SideBarTemplate.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/layout/index.ts b/web-app/packages/lib-vue2/src/modules/layout/index.ts
deleted file mode 100644
index 7041efb7..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './store'
-export * from './module'
-export * from './views'
diff --git a/web-app/packages/lib-vue2/src/modules/layout/module.ts b/web-app/packages/lib-vue2/src/modules/layout/module.ts
deleted file mode 100644
index f5bd6b7e..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const LayoutModule: Module = {
-  name: 'layoutModule',
-  init: (_services) => {
-    // none initialization required
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/layout/store.ts b/web-app/packages/lib-vue2/src/modules/layout/store.ts
deleted file mode 100644
index 9ca81a5f..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/store.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-
-export interface LayoutState {
-  barColor: string
-  barImage: string
-  drawer: boolean
-}
-
-export const useLayoutStore = defineStore('layoutModule', {
-  state: (): LayoutState => ({
-    barColor: 'rgba(176, 177, 181 1), rgba(176, 177, 181 1)', // TODO: global - check if necessary and useful, MV-2022-06-30: I would probably get rid of this if possible
-    barImage:
-      'https://demos.creative-tim.com/material-dashboard/assets/img/sidebar-1.jpg', // TODO: global - check if necessary and useful, MV-2022-06-30: I would probably get rid of this if possible
-    drawer: null
-  }),
-
-  actions: {
-    setBarImage(payload) {
-      this.barImage = payload.barImage
-    },
-    setDrawer(payload) {
-      this.drawer = payload.drawer
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/layout/views/NotFoundView.vue b/web-app/packages/lib-vue2/src/modules/layout/views/NotFoundView.vue
deleted file mode 100644
index eec4c93f..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/views/NotFoundView.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <custom-page>
-    <v-card style="min-width: 300px" class="text-center">
-      <v-card-title class="justify-center primary--text font-weight-bold ml-3">
-        <h3>Page not found</h3>
-      </v-card-title>
-      <v-card-text>
-        <p>This page does not exist, check your url for mistakes, please.</p>
-      </v-card-text>
-      <v-card-actions class="justify-center">
-        <v-btn
-          v-if="displayBackButton"
-          data-cy="login-form-btn-back-dashboard"
-          color="primary"
-          :to="{ name: 'dashboard' }"
-          >Back to Dashboard
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </custom-page>
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import CustomPage from '@/common/components/CustomPage.vue'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'NotFoundView',
-  components: { CustomPage },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    displayBackButton() {
-      return this.loggedUser
-    }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/views/RootView.vue b/web-app/packages/lib-vue2/src/modules/layout/views/RootView.vue
deleted file mode 100644
index 86bdac15..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/views/RootView.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <page-view
-    v-if="loggedUser.username === name"
-    :style="`padding-left: ${
-      drawer ? 260 : 20
-    }px; overflow-y: auto; padding-right:20px; margin-right: 0px;`"
-  >
-    <router-view />
-  </page-view>
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import PageView from '@/modules/layout/components/PageView.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'RootView',
-  components: {
-    PageView
-  },
-  computed: {
-    ...mapState(useLayoutStore, ['drawer']),
-    ...mapState(useUserStore, ['loggedUser']),
-    name() {
-      return this.$route.params.name
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/layout/views/index.ts b/web-app/packages/lib-vue2/src/modules/layout/views/index.ts
deleted file mode 100644
index a7af5199..00000000
--- a/web-app/packages/lib-vue2/src/modules/layout/views/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as NotFoundView } from './NotFoundView.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/notification/components/Notifications.vue b/web-app/packages/lib-vue2/src/modules/notification/components/Notifications.vue
deleted file mode 100644
index 1eb328d9..00000000
--- a/web-app/packages/lib-vue2/src/modules/notification/components/Notifications.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-snackbar
-    :value="isOpen"
-    v-bind="params"
-    @input="closeNotification"
-    :timeout="timeout"
-    style="overflow-y: auto"
-  >
-    <template v-if="params">
-      <span v-text="text" />
-      <v-btn
-        v-if="params.action"
-        text
-        color="yellow"
-        @click="params.action.handler"
-      >
-        {{ params.action.text }}
-      </v-btn>
-      <v-btn v-else text :color="buttonColor" @click="closeNotification">
-        Close</v-btn
-      >
-    </template>
-  </v-snackbar>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useNotificationStore } from '@/modules/notification/store'
-
-export default defineComponent({
-  computed: {
-    ...mapState(useNotificationStore, ['isOpen', 'params', 'text']),
-
-    buttonColor() {
-      return this.params?.buttonColor ?? 'yellow'
-    },
-    timeout() {
-      return this.params?.timeout ?? 3000
-    }
-  },
-  methods: {
-    ...mapActions(useNotificationStore, ['closeNotification'])
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/notification/components/index.ts b/web-app/packages/lib-vue2/src/modules/notification/components/index.ts
deleted file mode 100644
index f44c5373..00000000
--- a/web-app/packages/lib-vue2/src/modules/notification/components/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as Notifications } from './Notifications.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/notification/index.ts b/web-app/packages/lib-vue2/src/modules/notification/index.ts
deleted file mode 100644
index 9bd4cebc..00000000
--- a/web-app/packages/lib-vue2/src/modules/notification/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './store'
-export * from './module'
diff --git a/web-app/packages/lib-vue2/src/modules/notification/module.ts b/web-app/packages/lib-vue2/src/modules/notification/module.ts
deleted file mode 100644
index 0122cfb4..00000000
--- a/web-app/packages/lib-vue2/src/modules/notification/module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Module } from '@/common/types'
-
-export const NotificationModule: Module = {
-  name: 'notificationModule',
-  init: (_services) => {
-    // none initialization required
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/notification/store.ts b/web-app/packages/lib-vue2/src/modules/notification/store.ts
deleted file mode 100644
index 6d9124d8..00000000
--- a/web-app/packages/lib-vue2/src/modules/notification/store.ts
+++ /dev/null
@@ -1,89 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { defineStore } from 'pinia'
-
-const SNACK_BAR_ERROR_DEFAULT_PARAMS = {
-  color: 'red darken-4'
-}
-const SNACK_BAR_WARN_DEFAULT_PARAMS = {
-  color: 'orange',
-  buttonColor: 'black'
-}
-
-export interface NotificationState {
-  isOpen: boolean
-  text: string
-  params: {
-    action?: {
-      text: string
-      handler: () => void
-    }
-    timeout?: number
-  }
-}
-
-export const useNotificationStore = defineStore('notificationModule', {
-  state: (): NotificationState => ({
-    isOpen: false,
-    text: '',
-    params: null
-  }),
-
-  actions: {
-    openNotification(payload) {
-      this.isOpen = true
-      this.text = payload.text
-      this.params = payload.params
-    },
-    closeNotification() {
-      this.isOpen = false
-      this.text = ''
-      this.params = null
-    },
-    show(payload) {
-      if (this.isOpen) {
-        if (this.text === payload.text) {
-          // ignore same notifications
-          return
-        }
-        // previous notification is open, close it first
-        this.closeNotification()
-        // show new notification after some time
-        setTimeout(() => {
-          this.show({ text: payload.text, params: payload.params })
-        }, 300)
-      } else {
-        this.openNotification({
-          text: payload.text,
-          params: payload.params?.timeout
-            ? { ...payload.params, timeout: payload.params.timeout }
-            : { ...payload.params }
-        })
-      }
-    },
-    warn(payload) {
-      this.show({
-        ...payload,
-        params: { ...payload.params, ...SNACK_BAR_WARN_DEFAULT_PARAMS }
-      })
-    },
-    error(payload) {
-      this.show({
-        ...payload,
-        params: { ...payload.params, ...SNACK_BAR_ERROR_DEFAULT_PARAMS }
-      })
-    },
-    displayResult(payload) {
-      if (payload?.result?.success) {
-        this.show({ text: payload?.result?.message })
-      } else {
-        this.error({
-          text: payload?.result?.message,
-          params: { timeout: 5000 }
-        })
-      }
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/AccountAutocomplete.vue b/web-app/packages/lib-vue2/src/modules/project/components/AccountAutocomplete.vue
deleted file mode 100644
index 0ee254fc..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/AccountAutocomplete.vue
+++ /dev/null
@@ -1,265 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-autocomplete
-    ref="autocomplete"
-    placeholder="Find user"
-    v-model="users"
-    :loading="isLoading"
-    :items="items"
-    :search-input.sync="query"
-    cache-items
-    multiple
-    clearable
-    hide-selected
-    :filter="filterSelected"
-    item-text="email"
-    item-value="email"
-    :no-data-text="
-      !query || query.length <= 2
-        ? 'Type more letters'
-        : allowInvite
-        ? 'No matches found - Try using their emails instead'
-        : 'No matches found'
-    "
-    :hide-no-data="!query"
-    hide-details
-    return-object
-    data-cy="account-autocomplete-input"
-    @input="$emit('update', users)"
-  >
-    <template v-slot:selection="data">
-      <user-search-chip
-        :item="data.item"
-        v-bind="data.attrs"
-        :input-value="data.selected"
-        close
-        @click="data.select"
-        @click:close="removeItem(data.item)"
-      />
-    </template>
-    <template v-slot:item="{ item }">
-      <v-list-item-avatar size="18" left>
-        <send-icon
-          v-if="allowInvite && item.isInvite"
-          size="18"
-          class="primary--text"
-        />
-        <user-icon v-else size="18" class="primary--text" />
-      </v-list-item-avatar>
-      <v-list-item-content
-        style="padding-bottom: 6px; padding-top: 6px"
-        data-cy="account-autocomplete-list"
-      >
-        <v-list-item-title
-          v-if="allowInvite && item.isInvite"
-          v-html="`Invite \&quot;${item.email}\&quot; to your workspace`"
-        ></v-list-item-title>
-        <v-list-item-title
-          v-else-if="!allowInvite || !item.isInvite"
-          v-html="
-            `${emphasizeMatch(item.username, query)}${
-              getUserProfileName(item)
-                ? ` &bull; ${getUserProfileName(item)}`
-                : ''
-            }`
-          "
-        ></v-list-item-title>
-        <v-list-item-subtitle
-          v-if="!allowInvite || !item.isInvite"
-          v-html="emphasizeMatch(item.email, query)"
-        ></v-list-item-subtitle>
-      </v-list-item-content>
-    </template>
-    <template v-slot:append-item>
-      <div class="text-right text-caption grey--text text--darken-1">
-        <span class="pr-1" v-if="items && items.some((item) => !item.isInvite)"
-          >Not the right person? Try typing their email address instead!</span
-        >
-      </div>
-    </template>
-  </v-autocomplete>
-</template>
-
-<script lang="ts">
-import debounce from 'lodash/debounce'
-import isEmpty from 'lodash/isEmpty'
-import { mapState, mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-import { SendIcon, UserIcon } from 'vue-tabler-icons'
-
-import { isValidEmail } from '@/common/text_utils'
-import { useProjectStore } from '@/modules/project/store'
-import UserSearchChip from '@/modules/user/components/UserSearchChip.vue'
-import { EMPTY_INVITE_ITEM } from '@/modules/user/constants'
-import { UserSearchParams } from '@/modules/user/types'
-import { useUserStore } from '@/main'
-
-export default defineComponent({
-  name: 'AccountAutocomplete',
-  components: { UserSearchChip, SendIcon, UserIcon },
-  props: {
-    inputUsers: Array,
-    filterUsers: { type: Array, default: () => [] },
-    allowInvite: Boolean
-  },
-  data() {
-    return {
-      searchResults: [],
-      isLoading: false,
-      query: '',
-      users: []
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, ['currentNamespace']),
-    items() {
-      return this.searchResults.map((item) => {
-        return { ...item }
-      })
-    }
-  },
-  created() {
-    this.users = this.inputUsers ?? []
-    this.refreshCachedItems(this.users)
-  },
-  watch: {
-    query: 'search',
-    inputUsers: {
-      deep: true,
-      handler(val) {
-        this.users = val
-        this.refreshCachedItems(val)
-        if (!val || val.length === 0) {
-          this.searchResults = []
-          this.query = ''
-        }
-      }
-    },
-    users: {
-      deep: true,
-      handler(val) {
-        this.$emit('update', val)
-        if (!isEmpty(val)) {
-          this.query = ''
-        }
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useUserStore, ['getAuthUserSearch']),
-    search: debounce(function () {
-      // clear non-relevant cached items
-      this.refreshCachedItems(this.users)
-
-      if (!this.query || this.query.length < 3) {
-        this.searchResults = []
-        return
-      }
-
-      // Items have already been requested
-      if (this.isLoading) {
-        return
-      }
-
-      this.isLoading = true
-      const params: UserSearchParams = {
-        namespace: this.currentNamespace,
-        like: this.query
-      }
-      this.getAuthUserSearch(params)
-        .then((resp) => {
-          if (resp.data?.length > 0) {
-            // return data from api in search results and remove items included in filterUsers
-            this.searchResults = resp.data.filter(
-              (item) => !this.filterUsers.find((user) => user === item.username)
-            )
-          } else if (this.allowInvite && isValidEmail(this.query)) {
-            // return invite item in search results
-            this.searchResults = [{ ...EMPTY_INVITE_ITEM, email: this.query }]
-          } else {
-            // return empty search results
-            this.searchResults = []
-          }
-        })
-        .finally(() => {
-          this.isLoading = false
-        })
-    }, 300),
-
-    filterSelected(item, queryText) {
-      return (
-        (item.username &&
-          item.username
-            .toLocaleLowerCase()
-            .indexOf(queryText.toLocaleLowerCase()) > -1) ||
-        (item.email &&
-          item.email
-            .toLocaleLowerCase()
-            .indexOf(queryText.toLocaleLowerCase()) > -1)
-      )
-    },
-    removeItem(item) {
-      const index = this.users.findIndex((user) => item.email === user.email)
-      if (index >= 0) {
-        this.users.splice(index, 1)
-      }
-    },
-    getUserProfileName(user) {
-      const firstName = user?.profile?.first_name ?? ''
-      const lastName = user?.profile?.last_name ?? ''
-      return firstName || lastName ? `(${firstName} ${lastName})` : ''
-    },
-    emphasizeMatch(text, reg) {
-      return text
-        ? text.replace(new RegExp(reg, 'i'), function (str) {
-            return '<b>' + str + '</b>'
-          })
-        : ''
-    },
-    refreshCachedItems(users) {
-      if (this.$refs?.autocomplete) {
-        // remove invalid values from cache
-        this.$refs.autocomplete.cachedItems =
-          this.$refs.autocomplete.cachedItems.filter(
-            (cachedItem) =>
-              users.findIndex(
-                (user) =>
-                  (this.allowInvite &&
-                    user.isInvite &&
-                    user.email === cachedItem.email) ||
-                  (!user.isInvite && user.id === cachedItem.id)
-              ) !== -1
-          )
-        // add missing values to cache
-        users?.forEach((user) => {
-          const idx = this.$refs.autocomplete.cachedItems.findIndex(
-            (cachedItem) =>
-              (this.allowInvite &&
-                user.isInvite &&
-                user.email === cachedItem.email) ||
-              (!user.isInvite && user.id === cachedItem.id)
-          )
-          if (idx === -1) {
-            this.$refs.autocomplete.cachedItems.push(user)
-          }
-        })
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.v-text-field .v-input__append-inner .v-input__icon--append {
-  // hide append icon
-  display: none;
-}
-.v-list {
-  padding: 0;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/CloneDialog.vue b/web-app/packages/lib-vue2/src/modules/project/components/CloneDialog.vue
deleted file mode 100644
index 4ee593dd..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/CloneDialog.vue
+++ /dev/null
@@ -1,52 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <clone-dialog-template v-bind="$props" @on-clone-project="onCloneProject" />
-</template>
-
-<script lang="ts">
-import { mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import CloneDialogTemplate from './CloneDialogTemplate.vue'
-
-import { useProjectStore } from '@/modules/project/store'
-import { CloneProjectParams } from '@/modules/project/types'
-
-export default defineComponent({
-  name: 'clone-dialog',
-  props: {
-    project: String,
-    namespace: String
-  },
-  components: { CloneDialogTemplate },
-  methods: {
-    ...mapActions(useProjectStore, ['cloneProject']),
-
-    async onCloneProject(
-      project: string,
-      namespace: string,
-      data: CloneProjectParams,
-      cbSuccess: () => void
-    ) {
-      try {
-        await this.cloneProject({
-          namespace,
-          project,
-          data,
-          cbSuccess: async () => {
-            cbSuccess()
-            this.$emit('success', data)
-          }
-        })
-      } catch (err) {
-        this.$emit('error', err, data)
-      }
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/CloneDialogTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/components/CloneDialogTemplate.vue
deleted file mode 100644
index c40351e5..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/CloneDialogTemplate.vue
+++ /dev/null
@@ -1,96 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card v-on:keyup.enter="onCloneProject" data-cy="clone-dialog-card">
-    <v-card-title>
-      <span class="text-h5">Clone Project</span>
-    </v-card-title>
-    <v-card-text>
-      <v-text-field
-        autofocus
-        label="new project"
-        v-model="newProjectName"
-        data-cy="clone-dialog-project-name"
-      />
-      <slot name="dynamic-items"></slot>
-    </v-card-text>
-    <v-card-actions>
-      <v-spacer />
-      <v-btn @click="close" data-cy="clone-dialog-close-btn"> Close </v-btn>
-      <v-btn
-        id="clone-project-btn"
-        class="primary"
-        :disabled="!newProjectName || !currentWorkspace"
-        @click="onCloneProject"
-        data-cy="clone-dialog-clone-btn"
-      >
-        Clone
-      </v-btn>
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules/dialog/store'
-import { useFormStore } from '@/modules/form/store'
-import { useProjectStore } from '@/modules/project/store'
-import { CloneProjectParams } from '@/modules/project/types'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'clone-dialog-template',
-  props: {
-    namespace: String,
-    project: String
-  },
-  data() {
-    return {
-      newProjectName: ''
-    }
-  },
-  computed: {
-    ...mapState(useUserStore, ['currentWorkspace'])
-  },
-  created() {
-    this.newProjectName = this.project
-  },
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['close']),
-    ...mapActions(useFormStore, ['clearErrors', 'handleError']),
-    ...mapActions(useProjectStore, ['cloneProject']),
-
-    successCloneCallback() {
-      this.close()
-    },
-
-    onCloneProject() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      const data: CloneProjectParams = {
-        project: this.newProjectName,
-        namespace: this.namespace,
-        merginComponentUuid: this.merginComponentUuid
-      }
-      this.$emit(
-        'on-clone-project',
-        this.project,
-        this.namespace,
-        data,
-        this.successCloneCallback
-      )
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/DropArea.vue b/web-app/packages/lib-vue2/src/modules/project/components/DropArea.vue
deleted file mode 100644
index e6fda660..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/DropArea.vue
+++ /dev/null
@@ -1,260 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div
-    class="drop-area"
-    :class="{ active: dragOver }"
-    @dragover.prevent="onDragOver"
-    @dragleave.capture="setOver(false)"
-    @drop.prevent="onDrop"
-  >
-    <div
-      v-show="dragOver"
-      class="drop-highlight lighten-3"
-      :class="canDropFiles ? 'primary' : 'red'"
-    />
-    <div
-      class="file-input"
-      :class="canDropFiles ? '' : 'disabled'"
-      @click="selectFiles()"
-    >
-      <input
-        ref="selectFilesInput"
-        @change="onFileSelected"
-        type="file"
-        name="files"
-        multiple
-      />
-    </div>
-    <slot />
-  </div>
-</template>
-
-<script lang="ts">
-import debounce from 'lodash/debounce'
-import keyBy from 'lodash/keyBy'
-import pickBy from 'lodash/pickBy'
-import Path from 'path'
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { getFiles, checksum } from '@/common/mergin_utils'
-import { useInstanceStore } from '@/modules/instance/store'
-import { useNotificationStore } from '@/modules/notification/store'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  props: ['location'],
-  data() {
-    return {
-      dragOver: false
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, ['project', 'uploads']),
-    ...mapState(useInstanceStore, ['configData']),
-    upload() {
-      return this.project && this.uploads[this.project.name]
-    },
-    canDragOver() {
-      return this.project && this.$route.name === 'project-tree'
-    },
-    canDropFiles() {
-      const isUploadRunning = this.upload && this.upload.running
-      return (
-        this.canDragOver && !isUploadRunning && this.project.permissions.upload
-      )
-    }
-  },
-  methods: {
-    ...mapActions(useNotificationStore, ['error']),
-    ...mapActions(useProjectStore, [
-      'initUpload',
-      'uploadFiles',
-      'finishFileAnalysis',
-      'analysingFiles'
-    ]),
-
-    setOver: debounce(function (isOver) {
-      this.dragOver = isOver
-    }, 30),
-    onDragOver() {
-      if (!this.dragOver && this.canDragOver) {
-        this.setOver(true)
-      }
-    },
-    onDrop(evt) {
-      this.setOver(false)
-      if (!this.dragOver || !this.canDropFiles) {
-        return
-      }
-      if (this.upload && this.upload.running) {
-        return this.error({
-          text: 'You cannot update files during upload'
-        })
-      }
-      // prepare all entries because they will be not accessible after this callback ends (after 'await')
-      const entries = Array.from(evt.dataTransfer.items).map(
-        (i: DataTransferItem) => i.webkitGetAsEntry()
-      )
-      if (entries.some((e) => e === null)) {
-        return this.error({
-          text: 'Drop only files or folders'
-        })
-      }
-      this.createUpload(entries)
-    },
-    selectFiles() {
-      if (this.canDropFiles) {
-        this.$refs.selectFilesInput.click()
-      }
-    },
-    onFileSelected(evt) {
-      // prepare all entries because they will be not accessible after this callback ends (after 'await')
-      const entries = Array.from(evt.target.files).map((i: any) => {
-        i.isFile = true
-        return i
-      })
-      this.partialDrop(this.location, entries)
-      this.createUpload(entries)
-    },
-
-    async createUpload(entries) {
-      let partial = true
-      if (entries.length === 1) {
-        const item = entries[0]
-        if (item && item.isDirectory && item.name === this.project.name) {
-          // whole project folder was dropped
-          partial = false
-        }
-      }
-
-      if (this.upload) {
-        partial = true
-      } else {
-        // initialize new upload data
-        this.initUpload({ files: partial ? this.project.files : null })
-      }
-
-      if (partial) {
-        this.partialDrop(this.location, entries)
-      } else {
-        // TODO: check if upload already exists?
-        const files = await getFiles(entries[0], this.configData)
-        this.analysingFiles({ files: files.map((f) => f.path) })
-        await this.analyzeFiles(files)
-        this.uploadFiles({ files })
-      }
-    },
-
-    async analyzeFiles(files) {
-      // or compute checksums sequentially?
-      // for (let file of files) {
-      //   const hash = await checksum(file.file)
-      //   file.checksum = hash
-      //   this.finishFileAnalysis({ path: file.path })
-      // }
-      // return files
-
-      return Promise.all(
-        files.map(async (file) => {
-          file.checksum = await checksum(file.file)
-          this.finishFileAnalysis({ path: file.path })
-        })
-      )
-    },
-    async partialDrop(location, entries) {
-      let uploadFiles
-      if (this.upload) {
-        uploadFiles = this.upload.files
-      } else {
-        uploadFiles = { ...this.project.files }
-      }
-
-      const items = []
-      for (const entry of entries) {
-        items.push({
-          name: entry.name,
-          isDirectory: entry.isDirectory,
-          files: await getFiles(entry, this.configData)
-        })
-      }
-
-      const allFiles = items.reduce((list, item) => list.concat(item.files), [])
-      this.analysingFiles({ files: allFiles.map((f) => f.path) })
-      await this.analyzeFiles(allFiles)
-
-      items.forEach((entry) => {
-        if (entry.isDirectory) {
-          const directory = Path.join(location, entry.name)
-          const pathPrefix = directory + '/'
-          uploadFiles = {
-            // filter all files in directory
-            ...pickBy(uploadFiles, (file) => !file.path.startsWith(pathPrefix)),
-            // new directory files
-            ...keyBy(
-              entry.files.map((f) => ({
-                ...f,
-                path: Path.join(directory, f.path)
-              })),
-              'path'
-            )
-          }
-        } else {
-          const file = entry.files[0]
-          file.path = Path.join(location, file.path)
-          uploadFiles = {
-            ...uploadFiles,
-            [file.path]: file
-          }
-        }
-      })
-      this.uploadFiles({ files: uploadFiles })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.drop-area {
-  position: relative;
-
-  .drop-highlight {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border-radius: 2px;
-    z-index: 0;
-    border: 2px solid currentColor;
-  }
-
-  .file-input {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    opacity: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 1;
-    cursor: pointer;
-
-    input[type='file'] {
-      opacity: 0;
-      max-width: 0;
-      width: 0;
-    }
-  }
-
-  .file-input.disabled {
-    cursor: not-allowed;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/FileChangesetSummaryTable.vue b/web-app/packages/lib-vue2/src/modules/project/components/FileChangesetSummaryTable.vue
deleted file mode 100644
index 8e44fe67..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/FileChangesetSummaryTable.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-data-table
-      :headers="headers"
-      :items="displayedChangeset"
-      footer-props.items-per-page-options='[10, 25, {"text": "c$vuetify.dataIterator.rowsPerPageAll","value": -1}]'
-      :hide-default-footer="displayedChangeset.length <= 10"
-    >
-      <!-- headers -->
-      <template v-slot:header.insert="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Added</span>
-        </v-tooltip>
-      </template>
-      <template v-slot:header.delete="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Deleted</span>
-        </v-tooltip>
-      </template>
-      <template v-slot:header.update="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Modified</span>
-        </v-tooltip>
-      </template>
-    </v-data-table>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'file-changeset-summary-table',
-  props: {
-    changesets: Array
-  },
-  data() {
-    return {
-      headers: [
-        { text: 'Table', value: 'table' },
-        {
-          text: 'Inserts',
-          icon: 'add_circle',
-          color: 'green',
-          value: 'insert'
-        },
-        { text: 'Updates', icon: 'edit', color: 'orange', value: 'update' },
-        { text: 'Deletes', icon: 'delete', color: 'red', value: 'delete' }
-      ]
-    }
-  },
-  computed: {
-    displayedChangeset() {
-      // Displayed changesets data into table data
-      return this.changesets.filter((p) => p.table !== 'gpkg_contents')
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/FileIcon.vue b/web-app/packages/lib-vue2/src/modules/project/components/FileIcon.vue
deleted file mode 100644
index 63ce726a..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/FileIcon.vue
+++ /dev/null
@@ -1,103 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <template v-if="icon">
-      <span>
-        <img :src="icon" />
-      </span>
-    </template>
-    <template v-else>
-      <v-icon>{{ mdi }}</v-icon>
-    </template>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import mIconDbSchema from '@/assets/qgis-icons/mIconDbSchema.svg'
-import mIconFolder from '@/assets/qgis-icons/mIconFolder.svg'
-import mIconRaster from '@/assets/qgis-icons/mIconRaster.svg'
-import mIconTableLayer from '@/assets/qgis-icons/mIconTableLayer.svg'
-import mIconZip from '@/assets/qgis-icons/mIconZip.svg'
-import providerQgis from '@/assets/qgis-icons/providerQgis.svg'
-
-const mdiByExtensionDict = {
-  jpg: 'image',
-  jpeg: 'image',
-  png: 'image'
-}
-
-const iconByExtensionDict = {
-  folder: mIconFolder,
-  gpkg: mIconDbSchema,
-  qgs: providerQgis,
-  qgz: providerQgis,
-  rar: mIconZip,
-  sql: mIconDbSchema,
-  tif: mIconRaster,
-  tiff: mIconRaster,
-  xls: mIconTableLayer,
-  xlsx: mIconTableLayer
-}
-
-export default defineComponent({
-  props: {
-    file: Object
-  },
-  computed: {
-    icon: function () {
-      const file = this.file
-      const splittedName = file.name.split('.')
-      let ext = splittedName[splittedName.length - 1].toLowerCase()
-      if (file.type === 'folder') {
-        if (file.name !== '..') {
-          ext = 'folder'
-        } else {
-          return null
-        }
-      }
-      return iconByExtensionDict[ext] ? iconByExtensionDict[ext] : null
-    },
-    mdi: function () {
-      const file = this.file
-      let mdi
-      if (file.type === 'folder') {
-        if (file.name !== '..') {
-          mdi = 'folder'
-        }
-      } else {
-        const splittedName = file.name.split('.')
-        const ext = splittedName[splittedName.length - 1].toLowerCase()
-        mdi = mdiByExtensionDict[ext] ? mdiByExtensionDict[ext] : 'description'
-      }
-      return mdi
-    }
-  }
-})
-</script>
-<style lang="scss" scoped>
-div {
-  display: inline-block;
-}
-
-span {
-  position: relative;
-  display: inline-block;
-  margin-right: 5px;
-  height: 18px;
-  width: 23px;
-}
-
-img {
-  height: 100%;
-  position: absolute;
-  top: 3px;
-  left: 2px;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/FileMenu.vue b/web-app/packages/lib-vue2/src/modules/project/components/FileMenu.vue
deleted file mode 100644
index a3bc7dd4..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/FileMenu.vue
+++ /dev/null
@@ -1,52 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-menu
-    v-model="showMenu"
-    :position-x="x"
-    :position-y="y"
-    absolute
-    offset-y
-    :min-width="150"
-  >
-    <v-list>
-      <v-list-item @click="deleteFile">
-        <v-list-item-title>Delete</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </v-menu>
-</template>
-
-<script lang="ts">
-import { mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  data() {
-    return {
-      showMenu: false,
-      x: 0,
-      y: 0,
-      file: null
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['deleteFiles']),
-    open(evt, file) {
-      this.showMenu = true
-      this.x = evt.clientX
-      this.y = evt.clientY
-      this.file = file
-    },
-    deleteFile() {
-      this.deleteFiles({ files: [this.file.path] })
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/FolderDiff.vue b/web-app/packages/lib-vue2/src/modules/project/components/FolderDiff.vue
deleted file mode 100644
index 0456967e..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/FolderDiff.vue
+++ /dev/null
@@ -1,54 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <span class="diff">
-    <span v-if="added" class="added">{{ added }}</span>
-    <span v-if="removed" class="removed">{{ removed }}</span>
-    <span v-if="updated" class="updated">{{ updated }}</span>
-    <span v-if="added + removed + updated > 0"> / {{ count }}</span>
-  </span>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'FolderDiff',
-  props: {
-    added: Number,
-    removed: Number,
-    updated: Number,
-    count: Number
-  }
-})
-</script>
-<style lang="scss" scoped>
-.added {
-  color: green;
-}
-
-.removed {
-  color: red;
-}
-
-.updated {
-  color: orange;
-}
-
-.diff {
-  // color: #777;
-}
-
-.diff > span {
-  &:not(:first-child):not(:last-child) {
-    &:before {
-      content: ' + ';
-      color: #777;
-    }
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/PermissionInfo.vue b/web-app/packages/lib-vue2/src/modules/project/components/PermissionInfo.vue
deleted file mode 100644
index 919364d9..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/PermissionInfo.vue
+++ /dev/null
@@ -1,57 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <a :href="docsLinkManagePermissions" target="_blank" class="info-link">
-    <v-icon class="info-icon">info_outline</v-icon>
-    <span class="text-caption font-weight-bold info-text ml-2"
-      >Click here to learn more about roles and permissions</span
-    >
-  </a>
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useInstanceStore } from '@/modules/instance/store'
-
-export default defineComponent({
-  computed: {
-    ...mapState(useInstanceStore, ['configData']),
-
-    docsLinkManagePermissions(): string {
-      return `${this.configData?.docs_url ?? ''}/manage/permissions`
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.info-link {
-  text-decoration: none;
-  margin-left: 0;
-  margin-right: 0;
-  padding-left: 0;
-  padding-right: 0;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-
-  &:hover {
-    opacity: 0.7;
-  }
-}
-
-.info-icon {
-  color: #121212;
-}
-
-.info-text {
-  color: #121212;
-  text-decoration: underline;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTable.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTable.vue
deleted file mode 100644
index e17d9f22..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTable.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <project-access-request-table-template
-    :namespace="namespace"
-    @accept-access-request-error="onAcceptAccessRequestError"
-  />
-</template>
-
-<script lang="ts">
-import { AxiosError } from 'axios'
-import { mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import ProjectAccessRequestTableTemplate from './ProjectAccessRequestTableTemplate.vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { useNotificationStore } from '@/modules/notification/store'
-
-export default defineComponent({
-  name: 'ProjectAccessRequestTable',
-  components: { ProjectAccessRequestTableTemplate },
-  props: {
-    namespace: {
-      type: String,
-      default: null
-    }
-  },
-  methods: {
-    ...mapActions(useNotificationStore, ['error']),
-
-    // TODO: Add more handlers from template, add more emits from template
-    async onAcceptAccessRequestError(err: AxiosError) {
-      this.error({
-        text: getErrorMessage(err, 'Failed to accept access request')
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTableTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTableTemplate.vue
deleted file mode 100644
index 7b77d5ff..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequestTableTemplate.vue
+++ /dev/null
@@ -1,251 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-data-table
-      :loading="loading"
-      :items="accessRequests"
-      :server-items-length="accessRequestsCount"
-      :headers="headers"
-      ref="table"
-      no-data-text="No access requests"
-      color="primary"
-      :footer-props="{ 'items-per-page-options': [10, 25, 50] }"
-      :hide-default-footer="accessRequestsCount <= 10"
-      :options="options"
-      v-on:update:options="onUpdateOptions"
-    >
-      <template #item.expire="{ value }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <span v-on="on">{{ value | remainingtime }}</span>
-          </template>
-          <span>{{ value | datetime }}</span>
-        </v-tooltip>
-      </template>
-      <template #item.permission="{ item }">
-        <v-select
-          :items="['read', 'write', 'owner']"
-          v-model="permissions[item.id]"
-          return-object
-          :disabled="!showAccept"
-        >
-        </v-select>
-      </template>
-      <template #item.buttons="{ item }">
-        <div class="justify-center">
-          <div style="text-align: end">
-            <v-tooltip bottom v-if="showAccept">
-              <template v-slot:activator="{ on }">
-                <span v-on="on">
-                  <v-chip
-                    :disabled="expired(item.expire)"
-                    @click="acceptRequest(item)"
-                    elevation="0"
-                    color="green"
-                    class="white--text"
-                    :value="permissions[item.id]"
-                  >
-                    accept
-                  </v-chip>
-                </span>
-              </template>
-              <span>Accept request</span>
-            </v-tooltip>
-            <v-tooltip bottom>
-              <template v-slot:activator="{ on }">
-                <span v-on="on">
-                  <v-chip
-                    @click="cancelRequest(item)"
-                    elevation="0"
-                    color="red"
-                    class="white--text"
-                  >
-                    cancel
-                  </v-chip>
-                </span>
-              </template>
-              <span>Cancel request</span>
-            </v-tooltip>
-          </div>
-        </div>
-      </template>
-    </v-data-table>
-    <button
-      ref="hidden-btn"
-      id="accept-request-access-btn"
-      style="visibility: hidden"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useNotificationStore } from '@/modules/notification/store'
-import { useProjectStore } from '@/modules/project/store'
-import {
-  GetProjectAccessRequestsPayload,
-  TableDataHeader
-} from '@/modules/project/types'
-
-export default defineComponent({
-  name: 'ProjectAccessRequestTableTemplate',
-  props: {
-    namespace: {
-      type: String,
-      default: null
-    }
-  },
-  data() {
-    return {
-      loading: false,
-      options: {
-        // Default is order_params=expire ASC
-        sortBy: ['expire'],
-        sortDesc: [false],
-        itemsPerPage: 10,
-        page: 1
-      },
-      permissions: {}
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, ['accessRequests', 'accessRequestsCount']),
-    showAccept() {
-      return this.namespace != null
-    },
-    headers() {
-      let headers: TableDataHeader[] = [
-        { text: 'Project name', value: 'project_name', sortable: true },
-        { text: 'Expires in', value: 'expire', sortable: true }
-      ]
-      if (this.namespace) {
-        headers = [
-          { text: 'Requester', value: 'requested_by', sortable: true },
-          ...headers,
-          {
-            text: 'Permissions',
-            value: 'permission',
-            width: 120,
-            sortable: false
-          }
-        ]
-      }
-      return [
-        ...headers,
-        { text: '', value: 'buttons', width: 190, sortable: false }
-      ]
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, [
-      'cancelProjectAccessRequest',
-      'acceptProjectAccessRequest',
-      'getProjectAccessRequests'
-    ]),
-    ...mapActions(useNotificationStore, ['error']),
-
-    onUpdateOptions(options) {
-      this.options = options
-      this.fetchItems()
-    },
-    /** Update pagination in case of last accepting / canceling feature */
-    async updatePaginationOrFetch() {
-      if (this.accessRequests.length === 1 && this.options.page > 1) {
-        this.options.page -= 1
-        return
-      }
-      await this.fetchItems()
-    },
-    async acceptRequest(request) {
-      try {
-        const el = this.$refs['hidden-btn']
-        el.value = this.permissions[request.id]
-        el.dispatchEvent(new Event('click', {}))
-
-        const data = {
-          permissions: this.permissions[request.id]
-        }
-        await this.acceptProjectAccessRequest({
-          data,
-          itemId: request.id,
-          namespace: this.namespace
-        })
-        await this.updatePaginationOrFetch()
-      } catch (err) {
-        this.$emit('accept-access-request-error', err)
-      }
-    },
-    expired(expire) {
-      return Date.parse(expire) < Date.now()
-    },
-    async cancelRequest(request) {
-      await this.cancelProjectAccessRequest({
-        itemId: request.id,
-        namespace: this.namespace
-      })
-      await this.updatePaginationOrFetch()
-    },
-    async fetchItems() {
-      this.loading = true
-      try {
-        const payload: GetProjectAccessRequestsPayload = {
-          namespace: this.namespace,
-          params: {
-            page: this.options.page,
-            per_page: this.options.itemsPerPage,
-            order_params:
-              this.options.sortBy[0] &&
-              `${this.options.sortBy[0]} ${
-                this.options.sortDesc[0] ? 'DESC' : 'ASC'
-              }`
-          }
-        }
-        await this.getProjectAccessRequests(payload)
-        this.accessRequests.forEach((request) => {
-          this.permissions[request.id] = 'read'
-        })
-      } finally {
-        this.loading = false
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.v-data-table {
-  td {
-    text-align: left;
-
-    &.flags {
-      .v-icon {
-        margin: 0 1px;
-        cursor: default;
-      }
-    }
-  }
-
-  a {
-    text-decoration: none;
-  }
-
-  .v-chip {
-    margin: 0;
-    margin-right: 0.5em;
-    height: 1.6em;
-
-    ::v-deep .v-chip__content {
-      cursor: pointer;
-      padding: 0 0.5em;
-      font-size: 85%;
-    }
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequests.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequests.vue
deleted file mode 100644
index 161a2c03..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectAccessRequests.vue
+++ /dev/null
@@ -1,361 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-layout class="no-shrink column">
-    <label class="mt-4 grey--text text--darken-1">Access requests:</label>
-    <v-data-table
-      :loading="loading"
-      :headers="tableHeaders"
-      :items="accessRequests"
-      :server-items-length="accessRequestsCount"
-      no-data-text="No access requests"
-      :footer-props="{ 'items-per-page-options': [10, 25, 50] }"
-      :hide-default-footer="accessRequestsCount <= 10"
-      :options="options"
-      v-on:update:options="onUpdateOptions"
-    >
-      <template #header.user="{ header }">
-        <v-tooltip v-if="header.tooltip" top>
-          <template v-slot:activator="{ on }">
-            <span v-on="on">
-              {{ header.text }}
-            </span>
-          </template>
-          <span>
-            {{ header.tooltip }}
-          </span>
-        </v-tooltip>
-        <span v-else>
-          {{ header.text }}
-        </span>
-      </template>
-      <template #header.expire="{ header }">
-        <v-tooltip v-if="header.tooltip" top>
-          <template v-slot:activator="{ on }">
-            <span v-on="on">
-              {{ header.text }}
-            </span>
-          </template>
-          <span>
-            {{ header.tooltip }}
-          </span>
-        </v-tooltip>
-        <span v-else>
-          {{ header.text }}
-        </span>
-      </template>
-      <template #item.user="{ value }">
-        <v-tooltip
-          top
-          v-if="
-            value.profile &&
-            (value.profile.first_name || value.profile.last_name)
-          "
-        >
-          <template v-slot:activator="{ on }">
-            <b v-on="on">
-              {{ value.username }}
-            </b>
-          </template>
-          <span>
-            <span v-if="value.profile && value.profile.first_name">{{
-              value.profile.first_name
-            }}</span>
-            <span v-if="value.profile && value.profile.last_name">
-              {{ value.profile.last_name }}</span
-            >
-          </span>
-        </v-tooltip>
-        <b v-else>
-          {{ value.username }}
-        </b>
-      </template>
-      <template #item.expire="{ value }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <span v-on="on">{{ value | remainingtime }}</span>
-          </template>
-          <span>{{ value | datetime }}</span>
-        </v-tooltip>
-      </template>
-      <template #item.permissions="{ item }">
-        <v-select
-          :items="['read', 'write', 'owner']"
-          v-model="permissions[item.id]"
-          return-object
-        >
-        </v-select>
-      </template>
-      <template #item.confirm="{ item }">
-        <div class="justify-center px-0">
-          <v-tooltip bottom>
-            <template v-slot:activator="{ on }">
-              <span v-on="on">
-                <v-chip
-                  :disabled="!canAcceptAccessRequest(item.user.id, item.expire)"
-                  @click="acceptRequest(item)"
-                  elevation="0"
-                  color="green"
-                  class="white--text"
-                >
-                  accept
-                </v-chip>
-              </span>
-            </template>
-            <span>Accept request</span>
-          </v-tooltip>
-        </div>
-      </template>
-      <template #item.cancel="{ item }">
-        <div class="justify-center">
-          <v-tooltip bottom>
-            <template v-slot:activator="{ on }">
-              <span v-on="on">
-                <v-chip
-                  :disabled="!canCancelAccessRequest(item.user.id)"
-                  @click="cancelRequest(item)"
-                  elevation="0"
-                  color="red"
-                  class="white--text"
-                >
-                  cancel
-                </v-chip>
-              </span>
-            </template>
-            <span>Cancel access request</span>
-          </v-tooltip>
-        </div>
-      </template>
-    </v-data-table>
-    <button
-      ref="hidden-btn"
-      id="accept-request-access-btn"
-      style="visibility: hidden"
-    />
-  </v-layout>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { isAtLeastProjectRole, ProjectRole } from '@/common/permission_utils'
-import { GetProjectAccessRequestsPayload } from '@/modules'
-import { useNotificationStore } from '@/modules/notification/store'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  data() {
-    return {
-      loading: false,
-      options: {
-        // Default is order_params=expire ASC
-        sortBy: ['expire'],
-        sortDesc: [false],
-        itemsPerPage: 10,
-        page: 1
-      },
-      permissions: {},
-      tableHeaders: [
-        {
-          text: 'User',
-          value: 'user',
-          align: 'left',
-          sortable: false,
-          tooltip: 'Request from user'
-        },
-        {
-          text: 'Expire',
-          value: 'expire',
-          align: 'left',
-          sortable: false,
-          tooltip: 'Project access request expiration date'
-        },
-        {
-          text: 'Permissions',
-          value: 'permissions',
-          align: 'right',
-          sortable: false,
-          width: 60
-        },
-        {
-          text: ' ',
-          value: 'confirm',
-          align: 'right',
-          sortable: false,
-          width: 60
-        },
-        {
-          text: '',
-          value: 'cancel',
-          align: 'right',
-          sortable: false,
-          width: 60
-        }
-      ],
-      originalValue: null
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, [
-      'project',
-      'accessRequests',
-      'accessRequestsCount'
-    ]),
-    ...mapState(useUserStore, ['loggedUser'])
-  },
-  methods: {
-    ...mapActions(useProjectStore, [
-      'cancelProjectAccessRequest',
-      'acceptProjectAccessRequest',
-      'getProjectAccessRequests'
-    ]),
-    ...mapActions(useNotificationStore, ['error']),
-
-    onUpdateOptions(options) {
-      this.options = options
-      this.fetchItems()
-    },
-    /** Update pagination in case of last accepting / canceling feature */
-    async updatePaginationOrFetch() {
-      if (this.accessRequests.length === 1 && this.options.page > 1) {
-        this.options.page -= 1
-        return
-      }
-      await this.fetchItems()
-    },
-    canAcceptAccessRequest(userId: number, expire: string) {
-      return (
-        !this.expired(expire) &&
-        this.project.creator !== userId &&
-        isAtLeastProjectRole(this.project.role, ProjectRole.owner)
-      )
-    },
-    canCancelAccessRequest(userId: number) {
-      return (
-        this.project.creator !== userId &&
-        isAtLeastProjectRole(this.project.role, ProjectRole.owner)
-      )
-    },
-    async acceptRequest(request) {
-      try {
-        const el = this.$refs['hidden-btn']
-        el.value = this.permissions[request.id]
-        el.dispatchEvent(new Event('click', {}))
-        const data = {
-          permissions: this.permissions[request.id]
-        }
-        await this.acceptProjectAccessRequest({
-          data,
-          itemId: request.id,
-          namespace: this.project.namespace
-        })
-        await this.updatePaginationOrFetch()
-      } catch (err) {
-        this.error({
-          text: getErrorMessage(err, 'Failed to accept access request')
-        })
-      }
-    },
-    expired(expire) {
-      return Date.parse(expire) < Date.now()
-    },
-    async cancelRequest(request) {
-      await this.cancelProjectAccessRequest({
-        itemId: request.id,
-        namespace: this.project.namespace
-      })
-      await this.updatePaginationOrFetch()
-    },
-    async fetchItems() {
-      this.loading = true
-      try {
-        const payload: GetProjectAccessRequestsPayload = {
-          namespace: this.project.namespace,
-          params: {
-            page: this.options.page,
-            per_page: this.options.itemsPerPage,
-            order_params:
-              this.options.sortBy[0] &&
-              `${this.options.sortBy[0]} ${
-                this.options.sortDesc[0] ? 'DESC' : 'ASC'
-              }`,
-            project_name: this.project.name
-          }
-        }
-        await this.getProjectAccessRequests(payload)
-        this.accessRequests.forEach((request) => {
-          this.permissions[request.id] = 'read'
-        })
-      } finally {
-        this.loading = false
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.no-shrink {
-  flex: 0 0 auto;
-}
-
-label {
-  font-weight: 500;
-}
-
-::v-deep(*) {
-  .v-data-table__overflow {
-    margin: 0.5em 0;
-    border: 1px solid #ddd;
-    border-radius: 3px;
-    padding: 0.5em;
-    background-color: #f9f9f9;
-
-    .v-datatable {
-      background-color: transparent;
-    }
-  }
-}
-
-.v-list-item-content {
-  b {
-    margin-right: 10px;
-  }
-
-  span {
-    margin-right: 3px;
-    font-size: 12px;
-  }
-}
-
-.private-public-btn {
-  font-size: 12px;
-  padding-left: 20px;
-  padding-right: 20px;
-
-  span {
-    font-weight: 700;
-  }
-}
-
-.private-public-text {
-  font-size: 14px;
-}
-
-.public-private-zone {
-  margin-top: 20px;
-  margin-bottom: 20px;
-
-  button {
-    margin-right: 20px;
-    margin-top: 1px;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectForm.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectForm.vue
deleted file mode 100644
index 59b13ef3..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectForm.vue
+++ /dev/null
@@ -1,88 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card v-on:keyup.enter="createProject">
-    <v-card-title>
-      <span class="text-h5">New project</span>
-    </v-card-title>
-    <v-card-text>
-      <p class="text-xs-center red--text" v-text="error" />
-      <v-text-field
-        autofocus
-        label="name"
-        v-model="name"
-        data-cy="project-form-name"
-      />
-    </v-card-text>
-    <v-card-actions>
-      <v-spacer />
-      <v-btn @click="close" class="black--text"> Close</v-btn>
-      <v-btn
-        id="create-project-btn"
-        class="primary"
-        :disabled="!name"
-        @click="createProject"
-        data-cy="project-form-create-btn"
-      >
-        Create
-      </v-btn>
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules/dialog/store'
-import { useFormStore } from '@/modules/form/store'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'new-project',
-  data() {
-    return {
-      name: '',
-      error: null
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, ['currentNamespace'])
-  },
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['close']),
-    ...mapActions(useFormStore, ['clearErrors']),
-    ...mapActions(useProjectStore, { createProjectAction: 'createProject' }),
-
-    async createProject() {
-      // TODO: add types
-      const dialogData = { componentId: this.merginComponentUuid }
-      await this.clearErrors(dialogData)
-      try {
-        const data = {
-          name: this.name.trim(),
-          public: false
-        } as any
-        await this.createProjectAction({
-          data,
-          namespace: this.currentNamespace
-        })
-        await this.close()
-        this.$emit('success')
-      } catch (err) {
-        this.$emit('error', err, dialogData)
-      }
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectPermissionsTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectPermissionsTemplate.vue
deleted file mode 100644
index 07a1294e..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectPermissionsTemplate.vue
+++ /dev/null
@@ -1,395 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-layout class="no-shrink column">
-    <label class="mt-4 grey--text text--darken-1">Manage Access:</label>
-    <slot name="banner" />
-    <v-data-table
-      :headers="header"
-      :items="displayedValues"
-      no-data-text="No users"
-      :hide-default-footer="displayedValues.length <= 10"
-    >
-      <template #header.permissions="{ header }">
-        <v-tooltip v-if="header.tooltip" top>
-          <template v-slot:activator="{ on }">
-            <span v-on="on">
-              {{ header.text }}
-            </span>
-          </template>
-          <span>
-            {{ header.tooltip }}
-          </span>
-        </v-tooltip>
-        <span v-else>
-          {{ header.text }}
-        </span>
-      </template>
-
-      <template #item.user="{ value }">
-        <v-tooltip
-          top
-          v-if="value.profile.first_name || value.profile.last_name"
-        >
-          <template v-slot:activator="{ on }">
-            <b v-on="on">
-              {{ value.username }}
-            </b>
-          </template>
-          <span>
-            <span v-if="value.profile.first_name">{{
-              value.profile.first_name
-            }}</span>
-            <span v-if="value.profile.last_name">
-              {{ value.profile.last_name }}</span
-            >
-          </span>
-        </v-tooltip>
-        <b v-else>
-          {{ value.username }}
-        </b>
-      </template>
-
-      <template #item.permissions="{ item }">
-        <v-select
-          :value="actualPermissions(item)"
-          :items="permissionStates"
-          @input="(e) => valueChanged(item, e)"
-          :disabled="!isProjectOwner"
-          hide-details
-          label="reader"
-          single-line
-          class="input-selection"
-          style="width: 120px"
-        >
-        </v-select>
-      </template>
-
-      <template #item.remove="{ item }">
-        <div class="justify-center px-0">
-          <v-btn
-            :disabled="!canRemoveUser(item.user.id)"
-            @click="removeUser(item.user)"
-            icon
-          >
-            <v-icon color="red darken-3">delete</v-icon>
-          </v-btn>
-        </div>
-      </template>
-    </v-data-table>
-    <button
-      ref="hidden-input"
-      id="change-permissions-input"
-      style="visibility: hidden"
-    />
-  </v-layout>
-</template>
-
-<script lang="ts">
-import chunk from 'lodash/chunk'
-import difference from 'lodash/difference'
-import isEqual from 'lodash/isEqual'
-import pick from 'lodash/pick'
-import sortBy from 'lodash/sortBy'
-import toLower from 'lodash/toLower'
-import union from 'lodash/union'
-import { mapState, mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { isAtLeastProjectRole, ProjectRole } from '@/common/permission_utils'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-import { UserSearchParams } from '@/modules/user/types'
-
-export default defineComponent({
-  props: {
-    value: Object
-  },
-  data() {
-    return {
-      // search data
-      isLoading: false,
-      users: [],
-      header: [
-        {
-          text: 'User',
-          value: 'user',
-          align: 'left',
-          sortable: false
-        },
-        {
-          text: 'Permissions',
-          value: 'permissions',
-          width: 60,
-          align: 'left',
-          sortable: false,
-          tooltip: 'Has permission to change project settings'
-        },
-        {
-          text: 'Remove',
-          value: 'remove',
-          align: 'right',
-          sortable: false,
-          width: 60
-        }
-      ],
-      originalValue: null,
-      clonedValue: null
-    }
-  },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useProjectStore, [
-      'currentNamespace',
-      'project',
-      'isProjectOwner'
-    ]),
-
-    permissionStates() {
-      return ['owner', 'writer', 'reader']
-    },
-    displayedValues() {
-      const { ownersnames, readersnames, writersnames } = this.value
-      const users = this.users.map((user) => ({
-        username: user.username,
-        user,
-        owner: ownersnames?.includes(user.username),
-        read: readersnames?.includes(user.username),
-        write: writersnames?.includes(user.username)
-      }))
-      return sortBy(users, [
-        (u) => {
-          return toLower(u.username)
-        }
-      ])
-    }
-  },
-  created() {
-    this.originalValue = JSON.parse(JSON.stringify(this.value))
-    // this is just temporary solution for ESLint: Unexpected mutation of &quot;value&quot; prop. (vue/no-mutating-props)
-    this.clonedValue = JSON.parse(JSON.stringify(this.value))
-  },
-  watch: {
-    value: {
-      deep: true,
-      handler(value) {
-        // update local clonedValue if value is changed in parent
-        if (value) {
-          this.clonedValue = JSON.parse(JSON.stringify(this.value))
-          this.emit()
-        }
-      }
-    },
-    users: {
-      immediate: true,
-      deep: true,
-      handler(_access) {
-        const { ownersnames, readersnames, writersnames } = this.value
-        const names = union(ownersnames, readersnames, writersnames)
-        // server returns only 5 entries from db for single call
-        const chunks = chunk(names, 5)
-        Promise.all(
-          chunks.map(async (item) => {
-            const params: UserSearchParams = {
-              namespace: this.currentNamespace,
-              names: item.join(',')
-            }
-            await this.getAuthUserSearch(params).then((resp) => {
-              resp.data
-                .filter(
-                  (i) => !this.users.map((u) => u.username).includes(i.username)
-                )
-                .forEach((i) => this.users.push(i))
-            })
-          })
-        )
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useUserStore, ['getAuthUserSearch']),
-    canRemoveUser(userId: number) {
-      // project owner can remove project, but project creator cannot be removed
-      return (
-        this.project.creator !== userId &&
-        isAtLeastProjectRole(this.project.role, ProjectRole.owner)
-      )
-    },
-    valueChanged(user, permission) {
-      const el = this.$refs['hidden-input']
-      el.value = permission
-      el.dispatchEvent(new Event('click', {}))
-
-      if (permission === 'owner') {
-        this.setOwnerPermission(user)
-      } else if (permission === 'writer') {
-        this.setWritePermission(user)
-      } else if (permission === 'reader') {
-        this.setReadPermission(user)
-      }
-    },
-    actualPermissions(item) {
-      if (this.project.access.owners.includes(item.user.id)) {
-        return 'owner'
-      } else if (this.project.access.writers.includes(item.user.id)) {
-        return 'writer'
-      } else if (this.project.access.readers.includes(item.user.id)) {
-        return 'reader'
-      }
-      return ''
-    },
-    removeUser(user) {
-      // remove user.username from owners, writers and readers
-      const permissionNames = ['ownersnames', 'writersnames', 'readersnames']
-      permissionNames.forEach((key) => {
-        this.clonedValue[key] = difference(this.clonedValue[key], [
-          user.username
-        ])
-      })
-      // emit change of value
-      this.emit(this.clonedValue)
-
-      this.users.splice(this.users.indexOf(user), 1)
-    },
-    setWritePermission(user) {
-      this.clonedValue.ownersnames = difference(this.clonedValue.ownersnames, [
-        user.username
-      ])
-      this.clonedValue.writersnames = union(this.clonedValue.writersnames, [
-        user.username
-      ])
-      this.clonedValue.readersnames = union(this.clonedValue.readersnames, [
-        user.username
-      ])
-      // emit change of value
-      this.emit(this.clonedValue)
-    },
-    setOwnerPermission(user) {
-      this.clonedValue.ownersnames = union(this.clonedValue.ownersnames, [
-        user.username
-      ])
-      this.clonedValue.writersnames = union(this.clonedValue.writersnames, [
-        user.username
-      ])
-      this.clonedValue.readersnames = union(this.clonedValue.readersnames, [
-        user.username
-      ])
-      // emit change of value
-      this.emit(this.clonedValue)
-    },
-    setReadPermission(user) {
-      this.clonedValue.ownersnames = difference(this.clonedValue.ownersnames, [
-        user.username
-      ])
-      this.clonedValue.writersnames = difference(
-        this.clonedValue.writersnames,
-        [user.username]
-      )
-      this.clonedValue.readersnames = union(this.clonedValue.readersnames, [
-        user.username
-      ])
-      // emit change of value
-      this.emit(this.clonedValue)
-    },
-    emit(newValues = undefined) {
-      const modifiedValues = pick(newValues, [
-        'ownersnames',
-        'writersnames',
-        'readersnames'
-      ])
-      const current = {
-        ...pick(this.value, [
-          'ownersnames',
-          'writersnames',
-          'readersnames',
-          'public'
-        ]),
-        ...modifiedValues
-      }
-      const original = pick(this.originalValue, [
-        'ownersnames',
-        'writersnames',
-        'readersnames',
-        'public'
-      ])
-      // check if there is actual change (e.g. after refresh from previous server response)
-      if (isEqual(original, current)) {
-        return
-      }
-      this.$emit('save-project', newValues)
-      this.originalValue = JSON.parse(
-        JSON.stringify({ ...this.value, ...modifiedValues })
-      )
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.no-shrink {
-  flex: 0 0 auto;
-}
-
-label {
-  font-weight: 500;
-}
-
-::v-deep(*) {
-  .v-data-table__overflow {
-    margin: 0.5em 0;
-    border: 1px solid #ddd;
-    border-radius: 3px;
-    padding: 0.5em;
-    background-color: #f9f9f9;
-
-    .v-datatable {
-      background-color: transparent;
-    }
-  }
-}
-
-.v-list {
-  ::v-deep(.v-list-item) {
-    min-height: unset;
-  }
-}
-
-.v-list-item-content {
-  b {
-    margin-right: 10px;
-  }
-
-  span {
-    margin-right: 3px;
-    font-size: 12px;
-  }
-}
-
-.private-public-btn {
-  font-size: 12px;
-  padding-left: 20px;
-  padding-right: 20px;
-
-  span {
-    font-weight: 700;
-  }
-}
-
-.private-public-text {
-  font-size: 14px;
-}
-
-.public-private-zone {
-  margin-top: 20px;
-  margin-bottom: 20px;
-
-  button {
-    margin-right: 20px;
-    margin-top: 1px;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButton.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButton.vue
deleted file mode 100644
index 1be79e56..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButton.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <project-share-button-template v-if="canShareProject" />
-</template>
-
-<script lang="ts">
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import ProjectShareButtonTemplate from './ProjectShareButtonTemplate.vue'
-
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  components: { ProjectShareButtonTemplate },
-  computed: {
-    ...mapState(useUserStore, ['currentWorkspace']),
-    ...mapState(useProjectStore, ['project', 'isProjectOwner']),
-
-    canShareProject() {
-      return (
-        this.project?.workspace_id === this.currentWorkspace?.id &&
-        this.isProjectOwner
-      )
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButtonTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButtonTemplate.vue
deleted file mode 100644
index 9c5e7f33..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareButtonTemplate.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <action-button :disabled="false" @click="onShareProject" v-if="loggedUser">
-    <template #icon>
-      <plus-icon />
-    </template>
-    Share
-  </action-button>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { PlusIcon } from 'vue-tabler-icons'
-
-import ActionButton from '@/common/components/ActionButton.vue'
-import { useDialogStore } from '@/modules/dialog/store'
-import ProjectShareDialog from '@/modules/project/components/ProjectShareDialog.vue'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  props: {
-    allowInvite: Boolean
-  },
-  components: { ActionButton, PlusIcon },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser'])
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['show']),
-
-    onShareProject() {
-      const dialogProps = { allowInvite: this.allowInvite }
-      const listeners = {
-        ...(this.$attrs['on-invite']
-          ? { 'on-invite': this.$attrs['on-invite'] }
-          : {})
-      }
-      const dialog = {
-        maxWidth: 600,
-        persistent: true
-      }
-      this.show({
-        component: ProjectShareDialog,
-        params: {
-          props: dialogProps,
-          listeners,
-          dialog
-        }
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareDialog.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareDialog.vue
deleted file mode 100644
index da03902f..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectShareDialog.vue
+++ /dev/null
@@ -1,217 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card>
-    <v-card-title>
-      <span class="text-h5 primary--text font-weight-bold"
-        >Share project {{ project.name }}</span
-      >
-    </v-card-title>
-    <v-card-text>
-      <v-layout mt-2 column>
-        <h4 class="primary--text">
-          {{
-            readonly
-              ? `Project ${project.name} will be shared with following people`
-              : 'Share with'
-          }}
-        </h4>
-        <v-layout v-if="readonly" mx-0 mb-2 row align-center>
-          <v-chip-group active-class="primary--text" column>
-            <user-search-chip
-              v-for="user in addedUsers.slice(0, 5)"
-              :item="user"
-              :key="user.id"
-            />
-          </v-chip-group>
-          <h4 class="primary--text" v-if="addedUsers && addedUsers.length > 5">
-            and {{ addedUsers.length - 5 }} more ...
-          </h4>
-        </v-layout>
-        <v-layout v-else mb-10 column>
-          <account-autocomplete
-            :inputUsers="addedUsers"
-            :filterUsers="projectUsers"
-            @update="onAutocompleteUpdate"
-            :allowInvite="allowInvite"
-          />
-          <span class="mt-2" v-if="invitedEmails.length > 0"
-            >You will add new people to your workspace in the next step</span
-          >
-        </v-layout>
-      </v-layout>
-    </v-card-text>
-    <v-card-actions class="flex-row flex flex-wrap">
-      <permission-info />
-      <v-spacer />
-      <div class="flex-row">
-        <v-btn @click="closeDialog" outlined>{{
-          readonly ? 'Back' : 'Cancel'
-        }}</v-btn>
-        <v-btn
-          id="share-project-btn"
-          class="primary"
-          :disabled="
-            isPending ||
-            !addedUsers ||
-            addedUsers.length === 0 ||
-            !isProjectOwner
-          "
-          @click="onShare"
-        >
-          {{ invitedEmails.length === 0 || readonly ? 'Share' : 'Next' }}
-        </v-btn>
-      </div>
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script lang="ts">
-import isEqual from 'lodash/isEqual'
-import omit from 'lodash/omit'
-import { mapActions, mapState } from 'pinia'
-import { PropType, defineComponent } from 'vue'
-
-import AccountAutocomplete from './AccountAutocomplete.vue'
-import PermissionInfo from './PermissionInfo.vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { useDialogStore } from '@/modules/dialog/store'
-import { useNotificationStore } from '@/modules/notification/store'
-import { useProjectStore } from '@/modules/project/store'
-import UserSearchChip from '@/modules/user/components/UserSearchChip.vue'
-import { UserSearch, UserSearchInvite } from '@/modules/user/types'
-
-interface Data {
-  addedUsers: Array<UserSearchInvite | UserSearch>
-  isPending: boolean
-}
-
-export default defineComponent({
-  name: 'ProjectShareDialog',
-  components: { PermissionInfo, UserSearchChip, AccountAutocomplete },
-  props: {
-    allowInvite: Boolean,
-    inputUsers: Array as PropType<Data['addedUsers']>,
-    readonly: Boolean,
-    name: String
-  },
-  data(): Data {
-    return {
-      addedUsers: [],
-      isPending: false
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, [
-      'currentNamespace',
-      'project',
-      'isProjectOwner'
-    ]),
-
-    projectAccess() {
-      return this.project?.access
-    },
-    projectUsers() {
-      return [
-        ...this.projectAccess.readersnames,
-        ...this.projectAccess.writersnames,
-        ...this.projectAccess.ownersnames
-      ]
-    },
-    invitedEmails(): UserSearchInvite[] {
-      return this.addedUsers
-        ? this.addedUsers.filter((addedUserItem) => addedUserItem.isInvite)
-        : []
-    }
-  },
-
-  created() {
-    this.addedUsers = this.inputUsers ?? []
-  },
-
-  methods: {
-    ...mapActions(useDialogStore, ['close']),
-    ...mapActions(useProjectStore, ['saveProjectSettings']),
-    ...mapActions(useNotificationStore, ['error']),
-
-    onAutocompleteUpdate(event) {
-      this.addedUsers = event
-    },
-
-    getNewProjectAccess: function () {
-      const addedUsers = this.addedUsers
-        .filter((addedUserItem) => !addedUserItem.isInvite)
-        .map((addedUserItem) => omit(addedUserItem, ['isInvite']))
-      const addedUserNames = addedUsers.map((addedUser) => addedUser.username)
-      return {
-        access: {
-          ...this.projectAccess,
-          readersnames: this.projectAccess.readersnames.concat(addedUserNames)
-        }
-      }
-    },
-
-    hasAccessChanged(newAccess, oldAccess) {
-      return !isEqual(oldAccess.readersnames, newAccess.readersnames)
-    },
-
-    async onShare() {
-      if (this.addedUsers && this.addedUsers.length > 0) {
-        if (this.allowInvite && this.invitedEmails.length > 0) {
-          if (this.readonly) {
-            const newProjectAccess = this.getNewProjectAccess()
-            this.$emit(
-              'on-share',
-              newProjectAccess,
-              this.hasAccessChanged(newProjectAccess.access, this.projectAccess)
-            )
-          } else {
-            this.$emit(
-              'on-invite',
-              this.invitedEmails.map((item) => item.email),
-              this.addedUsers
-            )
-          }
-          this.isPending = true
-        } else {
-          const newProjectAccess = this.getNewProjectAccess()
-          if (
-            this.hasAccessChanged(newProjectAccess.access, this.projectAccess)
-          ) {
-            try {
-              // save only if access has changed
-              await this.saveProjectSettings({
-                namespace: this.currentNamespace,
-                newSettings: newProjectAccess,
-                projectName: this.project.name
-              })
-              this.close()
-            } catch (err) {
-              this.error({
-                text: getErrorMessage(err, 'Failed to save project settings')
-              })
-            }
-          }
-          this.addedUsers = []
-        }
-      }
-    },
-    closeDialog() {
-      if (this.readonly) {
-        this.$emit(
-          'cancel',
-          this.invitedEmails.map((item) => item.email),
-          this.addedUsers
-        )
-      } else {
-        this.close()
-      }
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTable.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTable.vue
deleted file mode 100644
index 0cc43915..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTable.vue
+++ /dev/null
@@ -1,412 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-data-iterator
-      :options="options"
-      :items="projects"
-      :server-items-length="numberOfItems"
-      v-on:update:options="paginating"
-      item-key="updated"
-      :loading="loading"
-      :hide-default-footer="true"
-      style="background-color: #ffffff"
-      flat
-      no-data-text="No projects found"
-    >
-      <template v-slot:header>
-        <v-toolbar color="" class="mb-1" flat v-if="showHeader">
-          <v-text-field
-            v-model="searchFilterByProjectName"
-            clearable
-            flat
-            hide-details
-            prepend-inner-icon="mdi-magnify"
-            label="Search projects"
-            @input="filterData"
-            style="margin-right: 8px"
-            data-cy="project-table-search-bar"
-          >
-          </v-text-field>
-          <template v-if="$vuetify.breakpoint.smAndUp">
-            <v-select
-              v-model="options.sortBy[0]"
-              @change="paginating(options)"
-              flat
-              hide-details
-              :items="selectKeys"
-              prepend-inner-icon="sort_by_alpha"
-              data-cy="project-table-sort-type"
-            ></v-select>
-            <v-spacer></v-spacer>
-            <v-btn-toggle
-              v-model="options.sortDesc[0]"
-              @change="paginating(options)"
-              mandatory
-            >
-              <v-btn
-                large
-                depressed
-                color="#ffffff"
-                :value="false"
-                data-cy="project-table-sort-btn-up"
-              >
-                <v-icon>mdi-arrow-up</v-icon>
-              </v-btn>
-              <v-btn
-                large
-                depressed
-                color="#ffffff"
-                :value="true"
-                data-cy="project-table-sort-btn-down"
-              >
-                <v-icon>mdi-arrow-down</v-icon>
-              </v-btn>
-            </v-btn-toggle>
-          </template>
-        </v-toolbar>
-      </template>
-      <template v-slot:item="{ item }">
-        <v-card
-          :outlined="false"
-          class="mx-auto"
-          data-cy="project-table-card"
-          flat
-        >
-          <v-list-item three-line>
-            <v-list-item-content>
-              <v-list-item-title class="text-h5 mb-1">
-                <router-link
-                  :to="{
-                    name: 'project',
-                    params: {
-                      namespace: item.namespace,
-                      projectName: item.name
-                    }
-                  }"
-                  ><b>
-                    <span v-if="showNamespace">{{ item.namespace }} /</span>
-                    {{ item.name }}</b
-                  ></router-link
-                >
-                <v-chip
-                  elevation="0"
-                  v-if="item.access.public && !onlyPublic"
-                  style="margin-left: 8px"
-                  outlined
-                  color="primary"
-                >
-                  Public
-                </v-chip>
-              </v-list-item-title>
-              <v-list-item-subtitle
-                >{{ item.description }}
-              </v-list-item-subtitle>
-              <div style="font-size: smaller">
-                <v-tooltip bottom>
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-collaborators"
-                      ><v-icon class="icon" size="20">share</v-icon
-                      >{{ item.access.readers.length }}</span
-                    >
-                  </template>
-                  <span>collaborators</span>
-                </v-tooltip>
-                <v-tooltip bottom v-if="item.version">
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-history"
-                    >
-                      <router-link
-                        :to="{
-                          name: 'project-versions',
-                          params: {
-                            namespace: item.namespace,
-                            projectName: item.name
-                          }
-                        }"
-                      >
-                        <span style="font-size: smaller"
-                          ><v-icon class="icon" size="20">history</v-icon
-                          >{{ item.version.substr(1) }}</span
-                        >
-                      </router-link>
-                    </span>
-                  </template>
-                  <span>versions</span>
-                </v-tooltip>
-                <v-tooltip bottom>
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-project-size"
-                      ><v-icon class="icon" size="20">folder</v-icon
-                      >{{ item.disk_usage | filesize('MB', 1) }}</span
-                    >
-                  </template>
-                  <span>project size</span>
-                </v-tooltip>
-                <v-tooltip bottom>
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-updated"
-                      >Updated {{ item.updated | timediff }}</span
-                    >
-                  </template>
-                  <span>{{ item.updated | datetime }}</span>
-                </v-tooltip>
-                <v-tooltip bottom>
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-if="!item.tags.includes('valid_qgis')"
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-missing-project"
-                      ><v-icon color="#fb8c0087" size="20"
-                        >warning</v-icon
-                      ></span
-                    >
-                  </template>
-                  <span>Missing QGIS project file</span>
-                </v-tooltip>
-                <v-tooltip bottom>
-                  <template v-slot:activator="{ on }">
-                    <span
-                      v-if="item.has_conflict"
-                      v-on="on"
-                      style="margin-right: 20px"
-                      data-cy="project-form-conflict-file"
-                      ><v-icon color="#fb8c0087" size="20">error</v-icon></span
-                    >
-                  </template>
-                  <span>There is conflict file in project</span>
-                </v-tooltip>
-              </div>
-            </v-list-item-content>
-          </v-list-item>
-          <v-divider style="color: black" />
-        </v-card>
-      </template>
-      <template v-slot:footer="{ options }">
-        <div class="text-center">
-          <v-pagination
-            v-if="showFooter && numberOfItems > options.itemsPerPage"
-            v-model="options.page"
-            :length="Math.ceil(numberOfItems / options.itemsPerPage)"
-            :total-visible="7"
-            circle
-            color="primary"
-            @input="fetchPage"
-          ></v-pagination>
-        </div>
-      </template>
-    </v-data-iterator>
-  </div>
-</template>
-
-<script lang="ts">
-import debounce from 'lodash/debounce'
-import { defineComponent, PropType } from 'vue'
-
-import { PaginatedGridOptions } from '@/common'
-import { formatToTitle } from '@/common/text_utils'
-import { ProjectListItem } from '@/modules/project/types'
-
-export default defineComponent({
-  name: 'projects-table',
-  props: {
-    showNamespace: {
-      type: Boolean,
-      default: false
-    },
-    namespace: String,
-    onlyPublic: {
-      type: Boolean,
-      default: true
-    },
-    sortable: {
-      type: Boolean,
-      default: true
-    },
-    showHeader: {
-      type: Boolean,
-      default: true
-    },
-    showFooter: {
-      type: Boolean,
-      default: true
-    },
-    initialOptions: {
-      type: Object as PropType<PaginatedGridOptions>,
-      default: () => ({
-        sortBy: ['updated'],
-        sortDesc: [true],
-        itemsPerPage: 25,
-        page: 1
-      })
-    },
-    numberOfItems: {
-      type: Number,
-      default: 0
-    },
-    projects: Array as PropType<Array<ProjectListItem>>
-  },
-  data() {
-    return {
-      options: Object.assign({}, this.initialOptions),
-      searchFilterByProjectName: '',
-      searchFilterByNamespace: '',
-      searchFilterByDay: '',
-      loading: false,
-      keys: ['name', 'updated', 'disk_usage'],
-      sortBy: ''
-    }
-  },
-  computed: {
-    header() {
-      let header = []
-      if (this.showNamespace) {
-        header.push({
-          text: 'Owner',
-          value: 'namespace',
-          sortable: this.sortable
-        })
-      }
-      header = header.concat(
-        { text: 'Name', value: 'name', sortable: this.sortable },
-        { text: '', width: 90, sortable: false },
-        { text: 'Last Update', value: 'updated', sortable: this.sortable },
-        { text: 'Size', value: 'meta.size', sortable: this.sortable }
-      )
-      return header
-    },
-    selectKeys() {
-      return this.keys.map((i) => {
-        return { text: formatToTitle(i), value: i }
-      })
-    }
-  },
-  watch: {
-    $route: {
-      immediate: false,
-      handler: 'changedRoute'
-    }
-  },
-  created() {
-    this.filterData = debounce(this.filterData, 3000)
-  },
-  methods: {
-    paginating(options) {
-      this.options = options
-      this.fetchProjects()
-    },
-    fetchPage(number) {
-      this.options.page = number
-      this.fetchProjects()
-    },
-    changedRoute() {
-      this.options.page = 1
-      this.fetchProjects()
-    },
-    fetchProjects() {
-      this.loading = true
-      this.$emit(
-        'fetch-projects',
-        {
-          searchFilterByProjectName: this.searchFilterByProjectName,
-          searchFilterByNamespace: this.searchFilterByNamespace,
-          namespace: this.namespace,
-          searchFilterByDay: this.searchFilterByDay
-        },
-        this.options,
-        () => {
-          this.loading = false
-        }
-      )
-    },
-    filterData() {
-      this.options.page = 1
-      this.fetchProjects()
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.v-data-iterator {
-  td {
-    text-align: left;
-
-    &.flags {
-      .v-icon {
-        margin: 0 1px;
-        cursor: default;
-      }
-    }
-  }
-
-  a {
-    text-decoration: none;
-    font-size: 1rem;
-  }
-
-  .v-chip {
-    margin: 0;
-    margin-right: 0.5em;
-    height: 1.3em;
-
-    ::v-deep(.v-chip__content) {
-      padding: 0 0.2em;
-      font-size: 85%;
-    }
-  }
-
-  .hidden {
-    opacity: 0;
-    pointer-events: none;
-  }
-}
-
-.icon {
-  margin-right: 5px;
-}
-
-.v-input {
-  padding-top: 0 !important;
-  margin-top: 0 !important;
-}
-
-.v-toolbar {
-  ::v-deep(.v-toolbar__content) {
-    padding-left: 0;
-  }
-}
-
-.v-list-item {
-  padding-left: 0;
-}
-
-.v-list__tile__title {
-  width: 110px;
-  font-weight: 800;
-}
-
-.filter-menu {
-  .activate {
-    border: 1px solid black;
-    border-radius: 5px;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTableDataLoader.vue b/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTableDataLoader.vue
deleted file mode 100644
index 35750f61..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/ProjectsTableDataLoader.vue
+++ /dev/null
@@ -1,146 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <projects-table
-    v-bind="$props"
-    :projects="projects"
-    :numberOfItems="numberOfItems"
-    :onlyPublic="onlyPublic"
-    @fetch-projects="fetchProjects"
-  />
-</template>
-
-<script lang="ts">
-import { mapActions } from 'pinia'
-import { defineComponent, PropType } from 'vue'
-
-import { PaginatedGridOptions } from '@/common'
-import { useNotificationStore } from '@/modules/notification/store'
-import ProjectsTable from '@/modules/project/components/ProjectsTable.vue'
-import { useProjectStore } from '@/modules/project/store'
-import {
-  PaginatedProjectsParams,
-  ProjectGridState
-} from '@/modules/project/types'
-
-export default defineComponent({
-  name: 'projects-table-data-loader',
-  components: { ProjectsTable },
-  props: {
-    showNamespace: Boolean,
-    onlyPublic: {
-      type: Boolean,
-      default: false
-    },
-    namespace: String,
-    sortable: {
-      type: Boolean,
-      default: true
-    },
-    asAdmin: {
-      type: Boolean,
-      default: false
-    },
-    public: {
-      type: Boolean,
-      default: true
-    },
-    showHeader: {
-      type: Boolean,
-      default: true
-    },
-    showFooter: {
-      type: Boolean,
-      default: true
-    },
-    initialOptions: {
-      type: Object as PropType<PaginatedGridOptions>,
-      default: () => ({
-        sortBy: ['updated'],
-        sortDesc: [true],
-        itemsPerPage: 25,
-        page: 1
-      })
-    }
-  },
-  data() {
-    return {
-      numberOfItems: 0,
-      projects: []
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['getProjects']),
-    ...mapActions(useNotificationStore, ['error']),
-    async fetchProjects(
-      projectGridState: ProjectGridState,
-      gridOptions: PaginatedGridOptions,
-      onFinish?: () => void
-    ) {
-      const params = {} as PaginatedProjectsParams
-      if (
-        this.$route.name === 'shared_projects' ||
-        this.$route.name === 'my_projects'
-      ) {
-        params.flag = this.$route.meta.flag
-      }
-      params.page = gridOptions.page
-      params.per_page = gridOptions.itemsPerPage
-      if (gridOptions.sortBy[0]) {
-        let orderParam = ''
-        if (gridOptions.sortBy[0] === 'meta.size') {
-          orderParam = 'disk_usage'
-        } else {
-          orderParam =
-            gridOptions.sortBy[0] === 'owner'
-              ? 'namespace'
-              : gridOptions.sortBy[0]
-        }
-        params.order_params =
-          orderParam + (gridOptions.sortDesc[0] ? '_desc' : '_asc')
-      }
-      if (projectGridState.searchFilterByProjectName) {
-        params.name = projectGridState.searchFilterByProjectName.trim()
-      }
-      if (projectGridState.searchFilterByNamespace) {
-        params.namespace = projectGridState.searchFilterByNamespace.trim()
-      }
-      if (projectGridState.namespace) {
-        params.only_namespace = projectGridState.namespace
-      }
-      if (this.asAdmin) {
-        params.as_admin = true
-      }
-      if (!this.public) {
-        params.public = false
-      }
-      if (this.onlyPublic) {
-        params.only_public = true
-      }
-      if (
-        projectGridState.searchFilterByDay &&
-        projectGridState.searchFilterByDay >= 0
-      ) {
-        params.last_updated_in = projectGridState.searchFilterByDay
-      }
-      try {
-        const response = await this.getProjects({ params })
-        this.projects = response.data?.projects
-        this.numberOfItems = response.data?.count
-        if (onFinish) {
-          onFinish()
-        }
-      } catch {
-        if (onFinish) {
-          onFinish()
-        }
-        await this.error({ text: 'Failed to fetch list of projects' })
-      }
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/UploadPanel.vue b/web-app/packages/lib-vue2/src/modules/project/components/UploadPanel.vue
deleted file mode 100644
index 9709e59c..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/UploadPanel.vue
+++ /dev/null
@@ -1,259 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card>
-    <v-toolbar dense text dark color="primary">
-      <v-toolbar-title>Data Sync</v-toolbar-title>
-      <v-spacer />
-      <v-btn icon @click="resetUpload">
-        <v-icon>close</v-icon>
-      </v-btn>
-    </v-toolbar>
-
-    <v-card-text v-if="upload.diff && upload.diff.changes">
-      <v-layout class="stats-line">
-        <label>Removed files:</label>
-        <v-spacer />
-        <span class="red--text">{{ upload.diff.removed.length }}</span>
-        <v-icon small color="red">delete</v-icon>
-      </v-layout>
-      <v-layout class="stats-line">
-        <label>Added files:</label>
-        <v-spacer />
-        <span class="green--text">{{ upload.diff.added.length }}</span>
-        <v-icon small color="green">add_circle</v-icon>
-      </v-layout>
-      <v-layout class="stats-line">
-        <label>Modified files:</label>
-        <v-spacer />
-        <span class="orange--text">{{ upload.diff.updated.length }}</span>
-        <v-icon small color="orange">edit</v-icon>
-      </v-layout>
-      <v-layout class="stats-line">
-        <label>Upload data size:</label>
-        <v-spacer />
-        <span>{{ uploadSize | filesize }}</span>
-      </v-layout>
-    </v-card-text>
-    <v-card-text v-else-if="upload.diff">
-      All files are up to date!
-    </v-card-text>
-
-    <v-card-text v-if="remainingAnalyzingFiles">
-      <v-layout row>
-        <v-progress-circular
-          :size="30"
-          :width="3"
-          color="primary"
-          indeterminate
-        />
-        <v-spacer />
-        <span style="padding-right: 30px"
-          >Remaining files: {{ remainingAnalyzingFiles }}</span
-        >
-      </v-layout>
-    </v-card-text>
-
-    <v-card-actions v-if="upload.diff && upload.diff.changes">
-      <v-spacer />
-      <action-button
-        id="update-files-btn"
-        @click="confirmUpload"
-        :disabled="upload.running || remainingAnalyzingFiles > 0"
-      >
-        <template #icon>
-          <cloud-upload-icon />
-        </template>
-        Update
-      </action-button>
-      <v-spacer />
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script lang="ts">
-import axios from 'axios'
-import pick from 'lodash/pick'
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { CloudUploadIcon } from 'vue-tabler-icons'
-
-import ActionButton from '@/common/components/ActionButton.vue'
-import { CHUNK_SIZE, isVersionedFile } from '@/common/mergin_utils'
-import { ConfirmDialog, useDialogStore, useNotificationStore } from '@/modules'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  data() {
-    return {
-      source: null
-    }
-  },
-  props: {
-    namespace: String
-  },
-  components: {
-    ActionButton,
-    CloudUploadIcon
-  },
-  computed: {
-    ...mapState(useProjectStore, ['project', 'uploads']),
-
-    upload() {
-      return this.uploads[this.project.path]
-    },
-    uploadSize() {
-      if (this.upload) {
-        const { added, updated } = this.upload.diff
-        return added.concat(updated).reduce((sum, path) => {
-          return sum + this.upload.files[path].size
-        }, 0)
-      }
-      return 0
-    },
-    remainingAnalyzingFiles() {
-      const list = (this.upload && this.upload.analysingFiles) || []
-      return list.length
-    }
-  },
-  methods: {
-    ...mapActions(useDialogStore, { showDialog: 'show' }),
-    ...mapActions(useNotificationStore, ['show']),
-    ...mapActions(useProjectStore, [
-      'setProject',
-      'discardUpload',
-      'startUpload',
-      'pushProjectChanges',
-      'pushProjectChunks',
-      'pushFinishTransaction',
-      'pushCancelTransaction'
-    ]),
-
-    resetUpload() {
-      this.discardUpload({ projectPath: this.project.path })
-      if (this.source) {
-        this.source.cancel('Operation canceled by the user.')
-        delete this.source
-      }
-    },
-    async uploadChanges() {
-      const { added, removed, updated } = this.upload.diff
-      const fileInfoFields = ['path', 'checksum', 'size', 'mtime', 'chunks']
-      const changes = {
-        removed: removed.map((path) =>
-          pick(this.project.files[path], fileInfoFields)
-        ),
-        added: added.map((path) =>
-          pick(this.upload.files[path], fileInfoFields)
-        ),
-        updated: updated.map((path) =>
-          pick(this.upload.files[path], fileInfoFields)
-        )
-      }
-
-      const projectPath = this.project.path
-      const version = this.project.version || 'v0'
-      const resp = await this.pushProjectChanges({
-        data: { version, changes },
-        projectPath
-      })
-      const { transaction } = resp.data
-      if (!transaction) {
-        this.discardUpload({ projectPath })
-        await this.show({
-          text: 'Project updated'
-        })
-        this.setProject({ project: resp.data })
-        return
-      }
-
-      this.source = axios.CancelToken.source()
-      const promises = []
-      added.concat(updated).forEach((path) => {
-        this.upload.files[path].chunks.forEach((chunk, index) => {
-          const file = this.upload.files[path].file
-          const offset = index * CHUNK_SIZE
-          const data = file.slice(offset, offset + CHUNK_SIZE)
-          const p = new Promise((resolve) => {
-            const pc = this.pushProjectChunks({
-              chunk,
-              data,
-              projectPath,
-              transaction,
-              token: this.source.token
-            })
-            resolve(pc)
-          })
-          promises.push(p)
-        })
-      })
-
-      // fire up chunks uploads
-      this.startUpload()
-      Promise.all(promises)
-        .then(() => {
-          // call server to finish upload transaction
-          this.pushFinishTransaction({
-            projectPath,
-            token: this.source.token,
-            transaction
-          })
-        })
-        .catch((err) => {
-          this.pushCancelTransaction({
-            err,
-            transaction
-          })
-        })
-    },
-    confirmUpload() {
-      const props = {
-        text: 'Changes from other users <strong> may get lost </strong> when uploading data from browser. It is highly recommended to use Mergin Maps QGIS plugin instead. <br> <br> Are you really sure you want to continue?',
-        confirmText: 'Update'
-      }
-      const listeners = {
-        confirm: () => this.uploadChanges()
-      }
-
-      if (this.upload.diff.updated.filter((i) => isVersionedFile(i)).length) {
-        this.showDialog({
-          component: ConfirmDialog,
-          params: { props, listeners, dialog: { maxWidth: 500 } }
-        })
-      } else {
-        this.uploadChanges()
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.v-card {
-  min-width: 240px;
-}
-
-.stats-line {
-  align-items: center;
-  margin: 0.75em 0;
-
-  label {
-    font-weight: 500;
-    color: #555;
-  }
-
-  .spacer {
-    height: 1em;
-    border-bottom: 1px dotted #ccc;
-    margin: 0 0.5em;
-  }
-
-  .v-icon {
-    margin: 0 0.25em;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/components/index.ts b/web-app/packages/lib-vue2/src/modules/project/components/index.ts
deleted file mode 100644
index 3f1f2889..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/components/index.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as AccountAutocomplete } from './AccountAutocomplete.vue'
-export { default as CloneDialog } from './CloneDialog.vue'
-export { default as CloneDialogTemplate } from './CloneDialogTemplate.vue'
-export { default as DropArea } from './DropArea.vue'
-export { default as FileChangesetSummaryTable } from './FileChangesetSummaryTable.vue'
-export { default as FileIcon } from './FileIcon.vue'
-export { default as FileMenu } from './FileMenu.vue'
-export { default as FolderDiff } from './FolderDiff.vue'
-export { default as PermissionInfo } from './PermissionInfo.vue'
-export { default as ProjectAccessRequests } from './ProjectAccessRequests.vue'
-export { default as ProjectAccessRequestTable } from './ProjectAccessRequestTable.vue'
-export { default as ProjectForm } from './ProjectForm.vue'
-export { default as ProjectPermissionsTemplate } from './ProjectPermissionsTemplate.vue'
-export { default as ProjectShareDialog } from './ProjectShareDialog.vue'
-export { default as ProjectShareButton } from './ProjectShareButton.vue'
-export { default as ProjectShareButtonTemplate } from './ProjectShareButtonTemplate.vue'
-export { default as ProjectsTable } from './ProjectsTable.vue'
-export { default as ProjectsTableDataLoader } from './ProjectsTableDataLoader.vue'
-export { default as UploadPanel } from './UploadPanel.vue'
-export { default as ProjectAccessRequestTableTemplate } from './ProjectAccessRequestTableTemplate.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/project/index.ts b/web-app/packages/lib-vue2/src/modules/project/index.ts
deleted file mode 100644
index fb355a65..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/index.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './views'
-export * from './store'
-export * from './projectApi'
-export * from './module'
-export * from './types'
diff --git a/web-app/packages/lib-vue2/src/modules/project/module.ts b/web-app/packages/lib-vue2/src/modules/project/module.ts
deleted file mode 100644
index 392ce707..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/module.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import getRoutes from './routes'
-
-import { applyRouteOverride } from '@/common/module_utils'
-import { Module } from '@/common/types'
-
-export const ProjectModule: Module = {
-  name: 'projectModule',
-  routerService: undefined,
-  httpService: undefined,
-  _addRoutes: (router, routeOverrides) => {
-    // add routes to router
-    getRoutes().forEach((route) => {
-      router.addRoute(applyRouteOverride(route, routeOverrides))
-    })
-  },
-  init: (services, routeOverrides) => {
-    if (services.httpService) {
-      ProjectModule.httpService = services.httpService
-    } else {
-      console.error(`Module ${ProjectModule.name} - missing httpService`)
-    }
-
-    if (services.routerService) {
-      ProjectModule.routerService = services.routerService
-      ProjectModule._addRoutes(services.routerService, routeOverrides)
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/project/projectApi.ts b/web-app/packages/lib-vue2/src/modules/project/projectApi.ts
deleted file mode 100644
index 6fe2a359..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/projectApi.ts
+++ /dev/null
@@ -1,269 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosResponse, CancelToken } from 'axios'
-
-import { getDefaultRetryOptions, validateStatus } from '@/common/http'
-import { ProjectModule } from '@/modules/project/module'
-import {
-  AcceptProjectAccessRequestData,
-  CloneProjectParams,
-  CreateProjectParams,
-  FetchProjectVersionsParams,
-  PaginatedProjectsParams,
-  PaginatedProjectsResponse,
-  PaginatedProjectVersionsResponse,
-  ProjectAccessRequestResponse,
-  ProjectAccessRequestParams,
-  ProjectDetail,
-  ProjectTemplate,
-  PushProjectChangesParams,
-  PushProjectChangesResponse,
-  SaveProjectSettings,
-  UpdateProjectAccessParams
-} from '@/modules/project/types'
-
-export const ProjectApi = {
-  async fetchProject(
-    namespace: string,
-    projectName: string
-  ): Promise<AxiosResponse<ProjectDetail>> {
-    return ProjectModule.httpService(`/v1/project/${namespace}/${projectName}`)
-  },
-
-  async createProject(
-    namespace: string,
-    data: CreateProjectParams,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(`/v1/project/${namespace}`, data, {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  async cloneProject(
-    namespace: string,
-    projectName: string,
-    data: CloneProjectParams,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/v1/project/clone/${namespace}/${projectName}`,
-      data,
-      {
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-
-  async deleteProject(
-    id: string,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(`/v2/projects/${id}/scheduleDelete`, {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  async unsubscribeProject(id: string): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(`/app/project/unsubscribe/${id}`)
-  },
-
-  async getProjectFileByUrl(url: string): Promise<AxiosResponse<string>> {
-    return ProjectModule.httpService.get(url)
-  },
-
-  async getPaginatedProject(
-    params: PaginatedProjectsParams
-  ): Promise<AxiosResponse<PaginatedProjectsResponse>> {
-    return ProjectModule.httpService('/v1/project/paginated', { params })
-  },
-
-  saveProjectSettings(
-    namespace: string,
-    projectName: string,
-    data: SaveProjectSettings,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<ProjectDetail>> {
-    return ProjectModule.httpService.put(
-      `/v1/project/${namespace}/${projectName}`,
-      data,
-      {
-        ...(withRetry ? getDefaultRetryOptions() : {}),
-        validateStatus
-      }
-    )
-  },
-
-  async fetchProjectVersions(
-    namespace: string,
-    projectName: string,
-    params: FetchProjectVersionsParams
-  ): Promise<AxiosResponse<PaginatedProjectVersionsResponse>> {
-    return ProjectModule.httpService.get(
-      `/v1/project/versions/paginated/${namespace}/${projectName}`,
-      { params }
-    )
-  },
-
-  /**
-   * List of project access requests initiated by current user in session
-   */
-  async fetchAccessRequests(
-    params: ProjectAccessRequestParams
-  ): Promise<AxiosResponse<ProjectAccessRequestResponse>> {
-    return ProjectModule.httpService('/app/project/access-requests', { params })
-  },
-
-  /**
-   * Paginated list of incoming project access requests to workspace
-   */
-  async fetchNamespaceAccessRequests(
-    namespace: string,
-    params: ProjectAccessRequestParams
-  ): Promise<AxiosResponse<ProjectAccessRequestResponse>> {
-    return ProjectModule.httpService(
-      `/app/project/access-request/${namespace}`,
-      { params }
-    )
-  },
-
-  async acceptProjectAccessRequest(
-    itemId: number,
-    data: AcceptProjectAccessRequestData,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/app/project/access-request/accept/${itemId}`,
-      data,
-      {
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-  async cancelProjectAccessRequest(
-    itemId: number,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.delete(
-      `/app/project/access-request/${itemId}`,
-      {
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-  async createProjectAccessRequest(
-    namespace: string,
-    projectName: string,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/app/project/access-request/${namespace}/${projectName}`,
-      {},
-      {
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-
-  async updateProjectAccessForUser(
-    id: string,
-    data: UpdateProjectAccessParams,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.patch(`/app/project/${id}/access`, data, {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  async pushProjectChanges(
-    url: string,
-    data: PushProjectChangesParams
-  ): Promise<AxiosResponse<PushProjectChangesResponse>> {
-    return ProjectModule.httpService.post(`/v1/project/push/${url}`, data)
-  },
-
-  async pushProjectChunks(
-    transaction: string,
-    chunk: string,
-    token: CancelToken,
-    data: any,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/v1/project/push/chunk/${transaction}/${chunk}`,
-      data,
-      {
-        cancelToken: token,
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-
-  async pushFinishTransaction(
-    transaction: string,
-    token: CancelToken,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/v1/project/push/finish/${transaction}`,
-      null,
-      {
-        cancelToken: token,
-        ...(withRetry ? getDefaultRetryOptions() : {})
-      }
-    )
-  },
-
-  async pushCancelTransaction(
-    transaction: string
-  ): Promise<AxiosResponse<void>> {
-    return ProjectModule.httpService.post(
-      `/v1/project/push/cancel/${transaction}`
-    )
-  },
-
-  constructDownloadProjectUrl(namespace: string, projectName: string) {
-    return ProjectModule.httpService.absUrl(
-      `/v1/project/download/${namespace}/${projectName}?format=zip`
-    )
-  },
-
-  constructDownloadProjectVersionUrl(
-    namespace: string,
-    projectName: string,
-    versionId: string
-  ) {
-    return ProjectModule.httpService.absUrl(
-      `/v1/project/download/${namespace}/${projectName}?version=${versionId}&format=zip`
-    )
-  },
-
-  constructDownloadProjectFileUrl(
-    namespace: string,
-    projectName: string,
-    file: string
-  ) {
-    return ProjectModule.httpService.absUrl(
-      `/v1/project/raw/${namespace}/${projectName}?file=${file}&random=${Math.random()}`
-    )
-  },
-
-  async getProjectVersion(
-    projectId: string,
-    versionName: string
-  ): Promise<AxiosResponse<string>> {
-    return ProjectModule.httpService.get(
-      `/v1/project/version/${projectId}/${versionName}`
-    )
-  },
-
-  async getProjectTemplates(): Promise<AxiosResponse<ProjectTemplate[]>> {
-    return ProjectModule.httpService.get('/app/project/templates')
-  },
-
-  async downloadFile(url: string): Promise<AxiosResponse<Blob>> {
-    return ProjectModule.httpService.get(url, { responseType: 'blob' })
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/project/routes.ts b/web-app/packages/lib-vue2/src/modules/project/routes.ts
deleted file mode 100644
index fe1b0f55..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/routes.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { RouteRecord } from 'vue-router'
-
-export default (): RouteRecord[] => []
diff --git a/web-app/packages/lib-vue2/src/modules/project/store.ts b/web-app/packages/lib-vue2/src/modules/project/store.ts
deleted file mode 100644
index 00ba131a..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/store.ts
+++ /dev/null
@@ -1,618 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosResponse } from 'axios'
-import FileSaver from 'file-saver'
-import keyBy from 'lodash/keyBy'
-import omit from 'lodash/omit'
-import { defineStore, getActivePinia } from 'pinia'
-import Vue from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { waitCursor } from '@/common/html_utils'
-import { filesDiff } from '@/common/mergin_utils'
-import { isAtLeastProjectRole, ProjectRole } from '@/common/permission_utils'
-import { useNotificationStore } from '@/modules/notification/store'
-import { ProjectApi } from '@/modules/project/projectApi'
-import {
-  AcceptProjectAccessRequestPayload,
-  CancelProjectAccessRequestPayload,
-  GetNamespaceAccessRequestsPayload,
-  ProjectListItem,
-  PaginatedProjectsPayload,
-  ProjectsPayload,
-  ProjectDetail,
-  ProjectParams,
-  EnhancedProjectDetail,
-  FetchProjectVersionsPayload,
-  ProjectVersion,
-  ProjectVersionsPayload,
-  ProjectAccessRequest,
-  GetUserAccessRequestsPayload,
-  GetProjectAccessRequestsPayload,
-  DownloadPayload,
-  DeleteProjectPayload
-} from '@/modules/project/types'
-import { useUserStore } from '@/modules/user/store'
-
-interface File {
-  chunks: unknown
-}
-
-export interface UploadFilesPayload {
-  files: File[]
-}
-
-export interface ProjectState {
-  accessRequests: ProjectAccessRequest[]
-  accessRequestsCount: number
-  project: EnhancedProjectDetail
-  projects: ProjectListItem[]
-  projectsCount: number
-  uploads: any
-  currentNamespace: string
-  versions: ProjectVersion[]
-  versionsCount: number
-  versionsLoading: boolean
-}
-
-export const useProjectStore = defineStore('projectModule', {
-  state: (): ProjectState => ({
-    accessRequests: [],
-    accessRequestsCount: 0,
-    project: null,
-    projectsCount: 0,
-    projects: undefined,
-    uploads: {},
-    currentNamespace: null,
-    versions: [],
-    versionsCount: 0,
-    versionsLoading: false
-  }),
-
-  getters: {
-    isProjectOwner: (state) =>
-      isAtLeastProjectRole(state.project?.role, ProjectRole.owner),
-    getProjectByName(state) {
-      return (payload) => {
-        return state.projects?.find((project) => project.name === payload.name)
-      }
-    }
-  },
-
-  actions: {
-    setAccessRequests(payload) {
-      this.accessRequests = payload.accessRequests
-      this.accessRequestsCount = payload.count
-    },
-
-    setProject(payload: { project: ProjectDetail }) {
-      let enhancedProject: EnhancedProjectDetail = null
-      if (payload.project) {
-        enhancedProject = {
-          ...omit(payload.project, ['files'])
-        }
-        if (enhancedProject) {
-          enhancedProject.files = keyBy(payload.project.files, 'path')
-          enhancedProject.path = [
-            enhancedProject.namespace,
-            enhancedProject.name
-          ].join('/')
-          const upload = this.uploads[enhancedProject.path]
-          if (upload) {
-            upload.diff = filesDiff(enhancedProject.files, upload.files)
-          }
-        }
-      }
-      this.project = enhancedProject
-    },
-    setProjects(payload: ProjectsPayload) {
-      this.projects = payload.projects
-      this.projectsCount = payload.count
-    },
-    setProjectVersions(payload: ProjectVersionsPayload) {
-      this.versions = payload.versions
-      this.versionsCount = payload.count
-    },
-    projectVersionsLoading(loading: boolean) {
-      this.versionsLoading = loading
-    },
-
-    initUpload(payload) {
-      const upload = {
-        files: payload.files ?? {},
-        diff: null,
-        analysingFiles: []
-      }
-      Vue.set(this.uploads, this.project.path, upload)
-    },
-
-    analysingFiles(payload) {
-      const upload = this.uploads[this.project.path]
-      Vue.set(upload, 'analysingFiles', payload.files)
-    },
-
-    finishFileAnalysis(payload) {
-      const upload = this.uploads[this.project.path]
-      if (upload.analysingFiles) {
-        Vue.set(
-          upload,
-          'analysingFiles',
-          upload.analysingFiles.filter((p) => p !== payload.path)
-        )
-      }
-    },
-
-    uploadFiles(payload: UploadFilesPayload) {
-      let files = payload.files
-      files = keyBy(files, 'path')
-      const chunks = Object.values(files)
-        .filter((f) => f.chunks !== undefined)
-        .map((f) => f.chunks.length)
-        .reduce((sum, item) => sum + item)
-      const upload = {
-        files,
-        diff: filesDiff(this.project.files, files),
-        running: false,
-        progress: 0,
-        loaded: 0,
-        total: chunks
-      }
-      Vue.set(this.uploads, this.project.path, upload)
-    },
-
-    discardUpload(payload) {
-      Vue.delete(this.uploads, payload.projectPath)
-    },
-
-    startUpload() {
-      const upload = this.uploads[this.project.path]
-      if (upload) {
-        upload.running = true
-        upload.progress = 0
-      }
-    },
-
-    chunkUploaded(payload) {
-      const upload = this.uploads[payload.project]
-      if (upload) {
-        upload.loaded++
-        if (upload.loaded === upload.total) {
-          upload.running = false
-        }
-      }
-    },
-
-    cancelUpload() {
-      const upload = this.uploads[this.project.path]
-      if (upload) {
-        upload.running = false
-        upload.progress = 0
-      }
-    },
-
-    deleteFiles(payload) {
-      let upload = this.uploads[this.project.path]
-      if (!upload) {
-        upload = {
-          files: { ...this.project.files },
-          diff: filesDiff({}, {})
-        }
-        Vue.set(this.uploads, this.project.path, upload)
-      }
-
-      payload.files.forEach((path) => {
-        if (upload.files[path]) {
-          Vue.delete(upload.files, path)
-        } else {
-          // should be folder
-          const dirPrefix = path + '/'
-          const removed = Object.keys(upload.files).filter((path) =>
-            path.startsWith(dirPrefix)
-          )
-          upload.files = omit(upload.files, removed)
-        }
-      })
-      upload.diff = filesDiff(this.project.files, upload.files)
-    },
-
-    setCurrentNamespace(payload) {
-      this.currentNamespace = payload.currentNamespace
-    },
-
-    async initProjects(payload: PaginatedProjectsPayload) {
-      if (!(this.projects?.length > 0)) {
-        await this.getProjects(payload)
-      }
-    },
-
-    async getProjects(payload: PaginatedProjectsPayload) {
-      const notificationStore = useNotificationStore()
-
-      let response
-      try {
-        response = await ProjectApi.getPaginatedProject(payload.params)
-        this.setProjects({
-          projects: response.data?.projects,
-          count: response.data?.count
-        })
-      } catch (_err) {
-        await notificationStore.error({
-          text: 'Failed to load projects'
-        })
-      }
-      return response
-    },
-
-    clearProjects() {
-      this.setProjects({ projects: [], count: 0 })
-      this.setProject({ project: null })
-    },
-
-    async createProject(payload) {
-      waitCursor(true)
-      try {
-        await ProjectApi.createProject(payload.namespace, payload.data, true)
-        this.setProject({ project: null })
-        await getActivePinia().router.push({
-          name: 'project',
-          params: {
-            namespace: payload.namespace,
-            projectName: payload.data.name
-          }
-        })
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async deleteProject(payload: DeleteProjectPayload) {
-      const notificationStore = useNotificationStore()
-      const userStore = useUserStore()
-
-      try {
-        waitCursor(true)
-        await ProjectApi.deleteProject(payload.projectId, true)
-        this.setProject({ project: null })
-        await userStore.fetchUserProfile()
-        waitCursor(false)
-        getActivePinia().router.replace({ path: '/' })
-      } catch (e) {
-        await notificationStore.error({
-          text: getErrorMessage(e, 'Failed to remove project')
-        })
-        waitCursor(false)
-      }
-    },
-    async initUserAccessRequests(payload?: GetUserAccessRequestsPayload) {
-      await this.fetchUserAccessRequests({
-        params: {
-          page: 1,
-          per_page: 10,
-          order_params: 'expire DESC',
-          ...payload?.params
-        }
-      })
-    },
-
-    async fetchUserAccessRequests(payload: GetUserAccessRequestsPayload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        const accessRequestResponse = await ProjectApi.fetchAccessRequests(
-          payload.params
-        )
-        this.setAccessRequests({
-          accessRequests: accessRequestResponse.data?.items,
-          count: accessRequestResponse.data?.count
-        })
-      } catch {
-        await notificationStore.error({
-          text: 'Failed to fetch project access requests'
-        })
-      }
-    },
-
-    async initNamespaceAccessRequests(
-      payload: GetNamespaceAccessRequestsPayload
-    ) {
-      await this.fetchNamespaceAccessRequests({
-        ...payload,
-        params: {
-          page: 1,
-          per_page: 10,
-          order_params: 'expire DESC',
-          ...payload.params
-        }
-      })
-    },
-
-    async fetchNamespaceAccessRequests(
-      payload: GetNamespaceAccessRequestsPayload
-    ) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        const accessRequestResponse =
-          await ProjectApi.fetchNamespaceAccessRequests(
-            payload.namespace,
-            payload.params
-          )
-        this.setAccessRequests({
-          accessRequests: accessRequestResponse.data?.items,
-          count: accessRequestResponse.data?.count
-        })
-      } catch {
-        await notificationStore.error({
-          text: 'Failed to fetch project access requests'
-        })
-      }
-    },
-
-    async getProjectAccessRequests(payload: GetProjectAccessRequestsPayload) {
-      if (payload.namespace) {
-        await this.fetchNamespaceAccessRequests({
-          namespace: payload.namespace,
-          ...payload
-        })
-      } else {
-        await this.fetchUserAccessRequests(payload)
-      }
-    },
-
-    async cancelProjectAccessRequest(
-      payload: CancelProjectAccessRequestPayload
-    ) {
-      const notificationStore = useNotificationStore()
-
-      waitCursor(true)
-      try {
-        await ProjectApi.cancelProjectAccessRequest(payload.itemId, true)
-      } catch (err) {
-        await notificationStore.error({
-          text: getErrorMessage(err, 'Failed to cancel access request')
-        })
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async acceptProjectAccessRequest(
-      payload: AcceptProjectAccessRequestPayload
-    ) {
-      waitCursor(true)
-      try {
-        await ProjectApi.acceptProjectAccessRequest(
-          payload.itemId,
-          payload.data,
-          true
-        )
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async cloneProject(payload) {
-      const { namespace, project, data, cbSuccess } = payload
-      try {
-        waitCursor(true)
-        await ProjectApi.cloneProject(namespace, project, data)
-        waitCursor(false)
-        cbSuccess()
-        this.setProject({ project: null })
-        await getActivePinia().router.push({
-          name: 'project',
-          params: {
-            namespace: data.namespace,
-            projectName: data.project
-          }
-        })
-      } catch (err) {
-        waitCursor(false)
-        throw err
-      }
-    },
-
-    async fetchProject(payload: ProjectParams) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        const projectResponse = await ProjectApi.fetchProject(
-          payload.namespace,
-          payload.projectName
-        )
-        this.setProject({ project: projectResponse.data })
-      } catch (e) {
-        console.warn('Failed to load project data', e)
-        await notificationStore.error({ text: 'Failed to load project data' })
-      }
-    },
-
-    async unsubscribeProject(payload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        waitCursor(true)
-        await ProjectApi.unsubscribeProject(payload.id)
-        this.setProject({ project: null })
-        waitCursor(false)
-      } catch (err) {
-        await notificationStore.error({
-          text: getErrorMessage(err, 'Failed to unsubscribe from project')
-        })
-        waitCursor(false)
-      }
-    },
-
-    async fetchProjectDetail(payload) {
-      const notificationStore = useNotificationStore()
-
-      const { callbackStatus, namespace, projectName, isLoggedUser } = payload
-      try {
-        const projectResponse = await ProjectApi.fetchProject(
-          payload.namespace,
-          payload.projectName
-        )
-        this.setProject({ project: projectResponse.data })
-      } catch (e) {
-        callbackStatus(e.response.status)
-
-        if (e.response.status !== 404 && e.response.status !== 403) {
-          notificationStore.error({
-            text: 'Failed to load project data'
-          })
-        } else if (e.response.status === 403 && !isLoggedUser) {
-          await getActivePinia().router.push(
-            `/login?redirect=/projects/${namespace}/${projectName}`
-          )
-        } else if (e.response.status === 403) {
-          ProjectApi.fetchAccessRequests({
-            page: 1,
-            per_page: 1,
-            project_name: payload.projectName
-          })
-            .then((resp) => {
-              if (resp.data.count) {
-                callbackStatus(409)
-              }
-            })
-            .catch(() => {
-              notificationStore.error({
-                text: 'Failed to load project access requests data'
-              })
-            })
-        }
-      }
-    },
-
-    async fetchProjectVersions(payload: FetchProjectVersionsPayload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        this.projectVersionsLoading(true)
-        const response = await ProjectApi.fetchProjectVersions(
-          payload.namespace,
-          payload.projectName,
-          payload.params
-        )
-        this.setProjectVersions({
-          versions: response.data?.versions,
-          count: response.data?.count
-        })
-      } catch (e) {
-        await notificationStore.error({
-          text: 'Failed to fetch project versions'
-        })
-      } finally {
-        this.projectVersionsLoading(false)
-      }
-    },
-
-    async saveProjectSettings(payload): Promise<AxiosResponse<ProjectDetail>> {
-      const { namespace, newSettings, projectName } = payload
-
-      try {
-        waitCursor(true)
-        const saveProjectSettingsResponse =
-          await ProjectApi.saveProjectSettings(
-            namespace,
-            projectName,
-            newSettings,
-            true
-          )
-        this.setProject({ project: saveProjectSettingsResponse.data })
-        waitCursor(false)
-        return saveProjectSettingsResponse
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async pushProjectChunks(payload) {
-      const pushProjectChunksResponse = await ProjectApi.pushProjectChunks(
-        payload.transaction,
-        payload.chunk,
-        payload.token,
-        payload.data,
-        true
-      )
-      this.chunkUploaded({ project: payload.projectPath })
-      return pushProjectChunksResponse
-    },
-
-    async pushFinishTransaction(payload) {
-      const notificationStore = useNotificationStore()
-      const userStore = useUserStore()
-
-      const { projectPath, token, transaction } = payload
-      try {
-        const pushFinishTransactionResponse =
-          await ProjectApi.pushFinishTransaction(transaction, token, true)
-        this.discardUpload({ projectPath })
-        notificationStore.show({
-          text: `Upload finished: ${projectPath}`
-        })
-        this.setProject({ project: pushFinishTransactionResponse.data })
-        await userStore.fetchUserProfile()
-        waitCursor(false)
-      } catch (err) {
-        this.pushCancelTransaction({ err, transaction })
-      }
-    },
-
-    async pushProjectChanges(payload) {
-      const notificationStore = useNotificationStore()
-
-      const { data, projectPath } = payload
-      try {
-        return await ProjectApi.pushProjectChanges(projectPath, data)
-      } catch (err) {
-        await notificationStore.error({ text: getErrorMessage(err, 'Error') })
-        return undefined
-      }
-    },
-
-    async pushCancelTransaction(payload) {
-      const notificationStore = useNotificationStore()
-
-      const { err, transaction } = payload
-      this.cancelUpload()
-      const msg = err.__CANCEL__
-        ? err.message
-        : (err.response && err.response.data?.detail) || 'Error'
-      notificationStore.error({ text: msg })
-      await ProjectApi.pushCancelTransaction(transaction)
-      waitCursor(false)
-    },
-
-    async downloadArchive(payload: DownloadPayload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        const resp = await ProjectApi.downloadFile(payload.url)
-        const fileName =
-          resp.headers['content-disposition'].split('filename=')[1]
-        FileSaver.saveAs(resp.data, fileName)
-      } catch (e) {
-        // parse error details from blob
-        let resp
-        const blob = new Blob([e.response.data], { type: 'text/plain' })
-        blob.text().then((text) => {
-          resp = JSON.parse(text)
-          notificationStore.error({ text: resp.detail })
-        })
-      }
-    },
-
-    constructDownloadProjectUrl(payload: {
-      namespace: string
-      projectName: string
-    }) {
-      return ProjectApi.constructDownloadProjectUrl(
-        payload.namespace,
-        payload.projectName
-      )
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/project/types.ts b/web-app/packages/lib-vue2/src/modules/project/types.ts
deleted file mode 100644
index cdb22a7e..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/types.ts
+++ /dev/null
@@ -1,313 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-/* eslint-disable camelcase */
-import {
-  ProjectRoleName,
-  ProjectPermissionName
-} from '@/common/permission_utils'
-import {
-  PaginatedRequestParamsApi,
-  PaginatedResponse,
-  PaginatedResponseDefaults
-} from '@/common/types'
-import { UserSearch } from '@/modules/user/types'
-
-export interface ProjectGridState {
-  searchFilterByProjectName: string
-  searchFilterByNamespace: string
-  namespace: string
-  searchFilterByDay: number
-}
-
-export interface PaginatedProjectsParams extends PaginatedRequestParamsApi {
-  namespace?: string
-  only_namespace?: string
-  name?: string
-  user?: string
-  last_updated_in?: number
-  flag?: string
-  as_admin?: boolean
-  public?: boolean
-  only_public?: boolean
-}
-
-export interface ProjectItemPermissions {
-  delete: boolean
-  update: boolean
-  upload: boolean
-}
-
-export interface ProjectAccess {
-  owners: number[]
-  ownersnames: string[]
-  public: boolean
-  readers: number[]
-  readersnames: string[]
-  writers: number[]
-  writersnames: string[]
-}
-
-export type ProjectTags = 'valid_qgis' | 'mappin_use' | 'input_use'
-
-export interface Project {
-  name: string
-  created?: string
-}
-
-export interface ProjectListItem extends Project {
-  access: ProjectAccess
-  creator: number | null
-  disk_usage: number
-  has_conflict: boolean
-  id: string
-  name: string
-  namespace: string
-  permissions: ProjectItemPermissions
-  tags: ProjectTags[]
-  updated: string
-  version: string
-}
-
-export interface FileInfo {
-  path: string
-  checksum: string
-  size: number
-  mtime?: string
-}
-
-export interface FileDiff {
-  path: string
-  checksum: string
-  size?: number
-}
-
-export interface UpdateFileInfo extends FileInfo, FileDiff {
-  // specified size again with required modifier
-  size: number
-}
-
-export interface UploadFileInfo extends FileInfo {
-  chunks: string[]
-}
-
-export type FileChangeType = 'added' | 'updated' | 'removed'
-
-export interface FileInfoHistory extends UpdateFileInfo {
-  change: FileChangeType
-  expiration?: string
-}
-
-export interface HistoryFileInfo {
-  path?: string
-  checksum?: string
-  size?: number
-  mtime?: string
-  diff?: FileDiff
-  history?: FileInfoHistory
-}
-
-export interface ProjectListItemFiles extends FileInfo, HistoryFileInfo {
-  // specified size again with required modifier
-  path: string
-  checksum: string
-  size: number
-}
-
-export interface ProjectDetail extends ProjectListItem {
-  role: ProjectRoleName
-  files?: ProjectListItemFiles[]
-}
-
-export interface PaginatedProjectsResponse extends PaginatedResponseDefaults {
-  projects: ProjectListItem[]
-}
-
-export interface PaginatedProjectsPayload {
-  params: PaginatedProjectsParams
-}
-
-export interface ProjectsPayload extends PaginatedResponseDefaults {
-  projects: ProjectListItem[]
-}
-
-export interface CloneProjectParams {
-  project: string
-  namespace: string
-  merginComponentUuid: string
-}
-
-export interface ProjectParams {
-  projectName: string
-  namespace: string
-}
-
-export interface ProjectAccessRequest {
-  expire: string
-  id: number
-  namespace: string
-  project?: string
-  project_name: string
-  requested_by: string
-  user: UserSearch
-}
-
-export type ProjectAccessRequestResponse =
-  PaginatedResponse<ProjectAccessRequest>
-
-export interface ProjectAccessRequestParams extends PaginatedRequestParamsApi {
-  project_name?: string
-}
-
-export interface AccessRequestsPayload extends PaginatedResponseDefaults {
-  accessRequests: ProjectAccessRequest[]
-}
-
-export interface GetUserAccessRequestsPayload {
-  params: ProjectAccessRequestParams
-}
-
-export interface GetNamespaceAccessRequestsPayload {
-  namespace: string
-  params: ProjectAccessRequestParams
-}
-
-export interface AcceptProjectAccessRequestData {
-  permissions: ProjectPermissionName
-}
-
-export interface GetProjectAccessRequestsPayload
-  extends GetUserAccessRequestsPayload {
-  namespace?: string
-}
-
-export interface AcceptProjectAccessRequestPayload {
-  itemId: number
-  data: AcceptProjectAccessRequestData
-  namespace?: string
-}
-
-export interface CancelProjectAccessRequestPayload {
-  itemId: number
-  namespace: string
-}
-
-export interface CreateProjectParams {
-  name: string
-  public?: boolean
-  template?: string
-}
-
-export interface AccessUpdate {
-  ownersnames: string[]
-  writersnames: string[]
-  readersnames: string[]
-  public: boolean
-}
-
-export interface SaveProjectSettings {
-  access: AccessUpdate
-}
-
-export interface FetchProjectVersionsParams {
-  page: number
-  per_page: number
-  descending: boolean
-}
-
-export interface ChangesetError {
-  size?: number
-  error?: string
-}
-
-export interface ChangesetSuccessSummaryItem {
-  table?: string
-  insert?: number
-  update?: number
-  delete?: number
-}
-
-export interface ChangesetSuccess {
-  size?: number
-  summary?: ChangesetSuccessSummaryItem[]
-}
-
-export interface ProjectVersion {
-  name: string
-  author: string
-  created: string
-  changes: {
-    added: FileInfo[]
-    removed: FileInfo[]
-    updated: FileInfo[]
-  }
-  project_name: string
-  namespace: string
-  user_agent: string
-  changesets: ChangesetSuccess | ChangesetError
-}
-
-export interface PaginatedProjectVersionsResponse
-  extends PaginatedResponseDefaults {
-  versions: ProjectVersion[]
-}
-
-export interface PushProjectChangesParams {
-  version: string
-  changes: {
-    added: UploadFileInfo[]
-    removed: FileInfo[]
-    updated: UpdateFileInfo[]
-  }
-}
-
-export type PushProjectChangesResponse =
-  | ProjectDetail
-  | {
-      transaction: string
-    }
-
-export interface ProjectTemplate {
-  id: string
-  name: string
-  namespace: string
-  version: string
-}
-
-export type EnhancedProjectDetail = ProjectDetail & {
-  files: Record<string, ProjectListItemFiles>
-  path: string
-}
-
-export interface UpdateProjectAccessParams {
-  user_id: number
-  role: ProjectRoleName
-}
-
-export interface DownloadPayload {
-  url: string
-}
-
-export interface FetchProjectVersionsPayload extends ProjectParams {
-  params: FetchProjectVersionsParams
-}
-
-export interface ProjectVersionsPayload extends PaginatedResponseDefaults {
-  versions: ProjectVersion[]
-}
-
-export interface ProjectVersionsItem extends ProjectVersion {
-  disabled: boolean
-}
-
-export interface TableDataHeader {
-  text: string
-  value: string
-  sortable?: boolean
-  width?: number
-}
-
-export interface DeleteProjectPayload {
-  projectId: string
-}
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/FileBrowserView.vue b/web-app/packages/lib-vue2/src/modules/project/views/FileBrowserView.vue
deleted file mode 100644
index d42be5aa..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/FileBrowserView.vue
+++ /dev/null
@@ -1,471 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-layout class="column">
-      <v-row>
-        <v-col class="pa-0">
-          <v-text-field
-            class="search"
-            placeholder="Find file"
-            append-icon="search"
-            v-model="searchFilter"
-            hide-details
-            style="padding-left: 7px; padding-bottom: 10px"
-            v-if="searchFilter !== '' || items.length > 0"
-          />
-        </v-col>
-      </v-row>
-      <v-data-table
-        v-if="
-          searchFilter !== '' ||
-          items.length ||
-          (project && !project.permissions.upload) ||
-          filter !== ''
-        "
-        class="file-table"
-        :headers="header"
-        :items="items"
-        color="primary"
-        no-data-text="No files found."
-        :items-per-page="itemPerPage"
-        :hide-default-footer="items.length <= itemPerPage"
-        :options="options"
-        v-model="selected"
-        item-key="path"
-        data-cy="file-browser-table"
-      >
-        <template #item.name="{ item }">
-          <router-link :to="item.link">
-            <file-icon :file="item" />
-            <span data-cy="file-browser-item">{{ item.name }}</span>
-          </router-link>
-          <v-spacer />
-          <folder-diff v-if="item.diffStats" v-bind="item.diffStats" />
-        </template>
-        <template #item.mtime="{ value }">
-          <v-tooltip bottom>
-            <template v-slot:activator="{ on }">
-              <span v-on="on">
-                <template v-if="value">
-                  {{ value | timediff }}
-                </template>
-              </span>
-            </template>
-            <span>
-              <template v-if="value">
-                {{ value | datetime }}
-              </template>
-            </span>
-          </v-tooltip>
-        </template>
-        <template #item.size="{ value }">
-          <template v-if="value !== undefined">
-            {{ value | filesize }}
-          </template>
-        </template>
-      </v-data-table>
-      <v-card v-else style="-webkit-box-shadow: none; box-shadow: none">
-        <v-card-title style="padding-left: 0"
-          ><strong>
-            Well done! The next step is adding some data.
-          </strong></v-card-title
-        >
-        <v-card-text style="padding-left: 0">
-          There are two options: <br />
-          <br />
-          1. Use the Mergin Maps plugin for QGIS to upload data. This is the
-          easiest and <strong>recommended</strong> way. See the documentation on
-          <a target="_blank" :href="docsLinkManageCreateProject"
-            >how to install and use the plugin</a
-          >. <br />
-          <br />
-          2. Drag and drop files from your computer to the lower part of this
-          page. This option is convenient if your project files are already
-          fully prepared and only need uploading.
-        </v-card-text>
-      </v-card>
-      <v-spacer />
-      <file-menu ref="menu" />
-    </v-layout>
-  </div>
-</template>
-
-<script lang="ts">
-import difference from 'lodash/difference'
-import escapeRegExp from 'lodash/escapeRegExp'
-import max from 'lodash/max'
-import orderBy from 'lodash/orderBy'
-import union from 'lodash/union'
-import Path from 'path'
-import { mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { formatDateTime } from '@/common/date_utils'
-import { dirname } from '@/common/path_utils'
-import { removeAccents } from '@/common/text_utils'
-import { useInstanceStore } from '@/modules/instance/store'
-import FileIcon from '@/modules/project/components/FileIcon.vue'
-import FileMenu from '@/modules/project/components/FileMenu.vue'
-import FolderDiff from '@/modules/project/components/FolderDiff.vue'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'FileBrowserView',
-  components: { FileIcon, FolderDiff, FileMenu },
-  props: {
-    namespace: String,
-    projectName: String,
-    location: {
-      type: String,
-      default: ''
-    },
-    asAdmin: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      options: {
-        rowsPerPage: -1
-      },
-      itemPerPage: 50,
-      sortBy: 'name',
-      searchFilter: '',
-      filter: '',
-      selected: [],
-      header: [
-        { text: 'Name', value: 'name' },
-        { text: 'Modified', value: 'mtime' },
-        { text: 'Size', value: 'size' }
-      ]
-    }
-  },
-  computed: {
-    ...mapState(useInstanceStore, ['configData']),
-    ...mapState(useProjectStore, ['project', 'uploads']),
-    docsLinkManageCreateProject() {
-      return `${this.configData?.docs_url ?? ''}/manage/create-project`
-    },
-    upload() {
-      return this.uploads[this.project?.path]
-    },
-    projectFiles() {
-      let files = this.project?.files
-      if (this.upload && this.diff) {
-        files = { ...files, ...this.upload.files }
-      }
-      return files ? Object.values(files).map(this.fileTreeView) : []
-    },
-    directoryFiles() {
-      return this.projectFiles.filter(
-        (file) => dirname(file.path) === this.location
-      )
-    },
-    folders() {
-      const folders = {}
-      const prefix = this.location ? escapeRegExp(this.location + '/') : ''
-      const regex = new RegExp(`^${prefix}([^/]+)/`)
-      this.projectFiles.forEach((f) => {
-        const m = f.path.match(regex)
-        if (m) {
-          const name = m[1]
-          if (folders[name]) {
-            folders[name].push(f)
-          } else {
-            folders[name] = [f]
-          }
-        }
-      })
-      return Object.keys(folders)
-        .sort()
-        .map((name) => {
-          const path = Path.join(this.location, name)
-          const files = folders[name]
-          return {
-            name,
-            path,
-            files,
-            type: 'folder',
-            link: this.folderLink(path),
-            size: files.reduce((sum, f) => sum + f.size, 0),
-            mtime: max(files, (f) => f.mtime).mtime, // new Date(f.mtime).getTime(),
-            flags: this.folderFlags(files),
-            diffStats: this.diff ? this.folderDiffStats(files) : null
-          }
-        })
-    },
-    diffsList() {
-      const list = []
-      if (this.diff) {
-        const { added, removed, updated } = this.diff
-        list.push(
-          ...orderBy(
-            removed
-              .map((path) => this.project?.files[path])
-              .map(this.fullPathView),
-            this.sortBy,
-            this.options.descending ? 'desc' : 'asc'
-          )
-        )
-        list.push(
-          ...orderBy(
-            added
-              .map((path) => this.upload?.files[path])
-              .map(this.fullPathView),
-            this.sortBy,
-            this.options.descending ? 'desc' : 'asc'
-          )
-        )
-        list.push(
-          ...orderBy(
-            updated
-              .map((path) => this.upload?.files[path])
-              .map(this.fullPathView),
-            this.sortBy,
-            this.options.descending ? 'desc' : 'asc'
-          )
-        )
-      }
-      return list
-    },
-    items() {
-      if (this.filter === 'diff') {
-        const changedFiles = this.filterByLocation(this.diffsList)
-        if (this.searchFilter) {
-          const regex = new RegExp(
-            escapeRegExp(removeAccents(this.searchFilter)),
-            'i'
-          )
-          return changedFiles.filter((f) => f.path.search(regex) !== -1)
-        }
-        return changedFiles
-      }
-      if (this.searchFilter) {
-        const regex = new RegExp(
-          escapeRegExp(removeAccents(this.searchFilter)),
-          'i'
-        )
-        return orderBy(
-          this.filterByLocation(this.projectFiles).filter(
-            (f) => f.path.search(regex) !== -1
-          ),
-          this.sortBy,
-          this.options.descending ? 'desc' : 'asc'
-        )
-      }
-      const items = []
-      if (this.location) {
-        items.push({
-          name: '..',
-          type: 'folder',
-          link: Path.normalize(Path.join(this.$route.path, '@/')),
-          mtime: ''
-        })
-      }
-      items.push(
-        ...orderBy(
-          this.folders,
-          this.sortBy,
-          this.options.descending ? 'desc' : 'asc'
-        )
-      )
-      items.push(
-        ...orderBy(
-          this.directoryFiles,
-          this.sortBy,
-          this.options.descending ? 'desc' : 'asc'
-        )
-      )
-      return items
-    },
-    diff() {
-      const diff = this.upload && this.upload.diff
-      if (diff && diff.changes) {
-        return {
-          ...diff
-        }
-      }
-      return null
-    },
-    allSelected() {
-      return this.items.every((i) => this.selected.includes(i.path))
-    }
-  },
-  methods: {
-    fileFlags(file) {
-      return (
-        this.diff && {
-          added: this.diff.added.includes(file.path),
-          updated: this.diff.updated.includes(file.path),
-          removed: this.diff.removed.includes(file.path)
-        }
-      )
-    },
-    folderFlags(files) {
-      // TODO: or use file.flags ?
-      return (
-        this.diff && {
-          added: files.every((f) => this.diff.added.includes(f.path)),
-          removed: files.every((f) => this.diff.removed.includes(f.path))
-        }
-      )
-    },
-    folderDiffStats(files) {
-      const { added, removed, updated } = this.diff
-      return {
-        added: files.filter((f) => added.includes(f.path)).length,
-        removed: files.filter((f) => removed.includes(f.path)).length,
-        updated: files.filter((f) => updated.includes(f.path)).length,
-        count: files.length
-      }
-    },
-    fullPathView(file) {
-      return {
-        ...file,
-        name: file.path,
-        link: this.fileLink(file),
-        mtime: formatDateTime(file.mtime),
-        flags: this.fileFlags(file)
-      }
-    },
-    fileTreeView(file) {
-      const filename = Path.basename(file.path)
-      return {
-        ...file,
-        type: 'file',
-        name: filename,
-        link: this.fileLink(file),
-        mtime: formatDateTime(file.mtime),
-        flags: this.fileFlags(file)
-      }
-    },
-    fileLink(file) {
-      return `/projects/${this.namespace}/${
-        this.projectName
-      }/blob/${encodeURIComponent(file.path)}`
-    },
-    folderLink(path) {
-      return `/projects/${this.namespace}/${this.projectName}/tree/${path}`
-    },
-    filterByLocation(files) {
-      let dirPrefix = ''
-      if (this.location) {
-        dirPrefix = this.location.replace(/\/$/, '') + '/'
-        files = files.filter((file) =>
-          (dirname(file.path) + '/').startsWith(dirPrefix)
-        )
-      }
-      return files.map((f) => ({ ...f, name: f.path.slice(dirPrefix.length) }))
-    },
-    openMenu(evt, file) {
-      // TODO: highlight
-      this.$refs.menu.open(evt, file)
-    },
-    toggleAll(selected) {
-      const fn = selected ? union : difference
-      this.selected = fn(
-        this.selected,
-        this.items.map((i) => i.path)
-      )
-    },
-    changeSort(column) {
-      if (this.sortBy === column) {
-        this.options.descending = !this.options.descending
-      } else {
-        this.sortBy = column
-        this.options.descending = false
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.search {
-  max-width: 260px;
-  margin: 0 0.25em;
-}
-
-.v-menu__content {
-  .v-list__tile__title {
-    text-align: right;
-  }
-}
-
-::v-deep(.v-data-table) {
-  tr {
-    color: #555;
-
-    &.updated {
-      color: orange;
-    }
-
-    &.removed,
-    &.rmoved {
-      color: red;
-    }
-
-    &.added,
-    &.nmoved {
-      color: green;
-    }
-
-    a,
-    .v-icon {
-      color: inherit;
-    }
-
-    .v-icon {
-      opacity: 0.75;
-    }
-  }
-
-  td {
-    text-align: left;
-
-    a {
-      text-decoration: none;
-
-      .v-icon {
-        line-height: 18px;
-        margin-right: 4px;
-      }
-    }
-  }
-
-  th,
-  tr {
-    min-width: 0;
-
-    .v-input--checkbox {
-      opacity: 0.75;
-      align-items: flex-end;
-      justify-content: flex-end;
-
-      .v-input--selection-controls__input {
-        margin: 0;
-      }
-
-      .v-icon {
-        pointer-events: none;
-      }
-    }
-  }
-}
-
-.v-speed-dial {
-  position: absolute;
-}
-
-.v-data-table {
-  ::v-deep(.v-data-footer__select) {
-    display: none;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/FileDetailView.vue b/web-app/packages/lib-vue2/src/modules/project/views/FileDetailView.vue
deleted file mode 100644
index d46a19bf..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/FileDetailView.vue
+++ /dev/null
@@ -1,232 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <div v-if="state" v-text="stateText" :class="['status', colors[state]]" />
-    <action-button
-      v-if="project && project.permissions.upload && this.state !== 'removed'"
-      @click="removeSelected"
-      data-cy="file-detail-remove-btn"
-      style="float: right"
-      colorClass="red"
-    >
-      <template #icon>
-        <trash-icon />
-      </template>
-      Remove file
-    </action-button>
-    <action-button
-      :disabled="state === 'added'"
-      :href="downloadLink"
-      data-cy="file-detail-download-btn"
-      style="float: right"
-    >
-      <template #icon>
-        <download-icon />
-      </template>
-      Download File
-    </action-button>
-
-    <v-list two-line subheader>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Name</v-list-item-title>
-          <v-list-item-subtitle>{{ filename }}</v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Size</v-list-item-title>
-          <v-list-item-subtitle>
-            {{ file.size | filesize }}
-            <span v-if="state === 'updated'"
-              >(new: {{ upload.files[file.path].size | filesize }})</span
-            >
-          </v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Last update</v-list-item-title>
-          <v-list-item-subtitle
-            >{{ file.mtime | datetime }} ({{ file.mtime | timediff }})
-          </v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-    </v-list>
-
-    <!--     render only if file is smaller than 100MB-->
-    <div class="container" v-if="mimetype && file.size < 104857600">
-      <output>
-        <img :src="downloadLink" v-if="mimetype.match('image')" />
-        <v-textarea
-          v-else-if="mimetype.match('text')"
-          :auto-grow="true"
-          :readonly="true"
-          :value="content"
-          filled
-          solo
-        >
-        </v-textarea>
-      </output>
-    </div>
-  </div>
-</template>
-
-<script lang="ts">
-import Path from 'path'
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { DownloadIcon, TrashIcon } from 'vue-tabler-icons'
-
-import ActionButton from '@/common/components/ActionButton.vue'
-import { ProjectApi } from '@/modules/project/projectApi'
-import { useProjectStore } from '@/modules/project/store'
-
-const Colors = {
-  added: 'green',
-  removed: 'red',
-  updated: 'orange'
-}
-
-export default defineComponent({
-  name: 'FileInfoView',
-  props: {
-    namespace: String,
-    projectName: String,
-    location: {
-      type: String,
-      default: ''
-    }
-  },
-  components: {
-    // pdf,
-    ActionButton,
-    DownloadIcon,
-    TrashIcon
-  },
-  computed: {
-    ...mapState(useProjectStore, ['project', 'uploads']),
-    upload() {
-      return this.uploads[this.project.path]
-    },
-    file() {
-      if (!this.project.files[this.location]) {
-        this.$router.replace({
-          name: 'project',
-          namespace: this.namespace,
-          projectName: this.projectName
-        })
-      }
-      return (
-        this.project.files[this.location] || this.upload.files[this.location]
-      )
-    },
-    filename() {
-      return Path.basename(this.file.path)
-    },
-    downloadLink() {
-      // added random number to request avoid to browser caching files
-      return ProjectApi.constructDownloadProjectFileUrl(
-        this.namespace,
-        this.projectName,
-        encodeURIComponent(this.file.path)
-      )
-    },
-    state() {
-      const diff = this.upload && this.upload.diff
-      if (diff) {
-        const path = this.file.path
-        if (diff.added.includes(path)) {
-          return 'added'
-        } else if (diff.removed.includes(path)) {
-          return 'removed'
-        } else if (diff.updated.includes(path)) {
-          return 'updated'
-        }
-      }
-      return null
-    },
-    stateText() {
-      return (
-        {
-          added: 'New file',
-          removed: 'Deleted file',
-          updated: 'Modified file'
-        }[this.state] || this.state
-      )
-    },
-    colors() {
-      return Colors
-    }
-  },
-  data() {
-    return {
-      previewUrl: '',
-      pageCount: 0,
-      currentPage: 0,
-      content: null,
-      mimetype: null
-    }
-  },
-  created() {
-    this.txtPreview()
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['deleteFiles']),
-    txtPreview() {
-      ProjectApi.getProjectFileByUrl(this.downloadLink).then((resp) => {
-        this.mimetype = resp.headers['content-type']
-        if (resp.headers['content-type'].match('text')) {
-          if (resp.data.constructor === Object) {
-            resp.data = JSON.stringify(resp.data)
-          }
-          this.content = resp.data.match(/^.*([^\n]*\n){0,50}/gi)[0]
-          if (!this.content) {
-            this.content = ''
-            return
-          }
-          if (this.content.length > 10000) {
-            this.content = this.content.substring(0, 10000)
-          }
-        } else {
-          this.content = null
-        }
-      })
-    },
-    removeSelected() {
-      this.deleteFiles({ files: [this.file.path] })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.status {
-  margin: 0.5em auto;
-  padding: 0 1em;
-  text-align: center;
-  color: #fff;
-  height: 2em;
-  line-height: 2em;
-}
-
-.v-list {
-  ::v-deep(.v-list__tile) {
-    font-size: 14px;
-    color: #444;
-
-    .v-list__tile__title {
-      font-weight: 500;
-    }
-  }
-}
-
-output img {
-  max-width: 100%;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/FileVersionDetailView.vue b/web-app/packages/lib-vue2/src/modules/project/views/FileVersionDetailView.vue
deleted file mode 100644
index d98a3b93..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/FileVersionDetailView.vue
+++ /dev/null
@@ -1,179 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-list two-line subheader v-if="tables">
-      <v-list-item v-bind:key="name" v-for="(value, name) in tables">
-        <v-list-item-content>
-          <v-list-item-title>
-            <h3 class="primary--text">{{ name }}</h3>
-          </v-list-item-title>
-          <br />
-          <v-data-table
-            :headers="value.headers"
-            :items="value.changes"
-            no-data-text="No changeset"
-            color="primary"
-            footer-props.items-per-page-options='[10, 25, {"text": "$vuetify.dataIterator.rowsPerPageAll","value": -1}]'
-            :hide-default-footer="value.changes.length <= 10"
-            disable-sort
-            style="overflow-x: auto"
-          >
-            <template #item.operationTypeHeader="{ value }">
-              <v-icon small :color="actions[value].color">{{
-                actions[value].icon
-              }}</v-icon>
-            </template>
-          </v-data-table>
-        </v-list-item-content>
-      </v-list-item>
-    </v-list>
-    <v-card v-else-if="!tables && !loading" class="bubble mt-3" outlined>
-      <h4>Changes cannot be calculated</h4>
-      For details please check the
-      <a :href="docsLinkManageSynchronisation" target="_blank">documentation</a
-      >.
-    </v-card>
-  </div>
-</template>
-
-<script lang="ts">
-import groupBy from 'lodash/groupBy'
-import isArray from 'lodash/isArray'
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { waitCursor } from '@/common/html_utils'
-import { useNotificationStore } from '@/modules'
-import { useInstanceStore } from '@/modules/instance/store'
-
-export default defineComponent({
-  name: 'FileVersionDetailView',
-  props: {
-    namespace: String,
-    projectName: String,
-    version_id: String,
-    path: String,
-    asAdmin: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      tables: null,
-      loading: true,
-      actions: {
-        insert: { icon: 'add_circle', color: 'green' },
-        update: { icon: 'edit', color: 'orange' },
-        delete: { icon: 'delete', color: 'red' }
-      }
-    }
-  },
-  computed: {
-    ...mapState(useInstanceStore, ['configData']),
-    docsLinkManageSynchronisation() {
-      return `${this.configData?.docs_url ?? ''}/manage/synchronisation`
-    }
-  },
-  created() {
-    this.getChangeset()
-  },
-
-  methods: {
-    ...mapActions(useNotificationStore, ['error']),
-
-    // TODO: refactor to pinia action
-    getChangeset() {
-      waitCursor(true)
-      this.$http
-        .get(
-          `/v1/resource/changesets/${this.namespace}/${this.projectName}/${this.version_id}?path=${this.path}`
-        )
-        .then((resp) => {
-          if (!resp.data.length) return
-          // process data grouped by tables
-          this.tables = {}
-          let changeset = { ...resp.data }
-          changeset = groupBy(changeset, 'table')
-          // eslint-disable-next-line @typescript-eslint/no-this-alias
-          const _this = this
-          for (const [key, value] of Object.entries(changeset)) {
-            _this.tables[key] = {}
-            const headers = [
-              { text: 'Change', value: 'operationTypeHeader', width: 50 }
-            ]
-            const changes = []
-            if (isArray(value)) {
-              const arrayValue = value as []
-              arrayValue.forEach((data: any) => {
-                if (data.table === 'gpkg_contents') {
-                  return
-                }
-                data.values = { operationTypeHeader: data.type }
-                data.changes.forEach((row) => {
-                  const columnIdentifier = row.name
-                  // based on operation type create a value to display: old, new or change old -> new
-                  // display undefined values as N/A
-                  row.value = {}
-                  if (data.type === 'insert') {
-                    data.values[columnIdentifier] =
-                      typeof row.new === 'undefined' ? 'N/A' : row.new
-                  } else if (data.type === 'update') {
-                    if (typeof row.new === 'undefined') {
-                      data.values[columnIdentifier] =
-                        typeof row.old === 'undefined' ? 'N/A' : row.old
-                    } else {
-                      data.values[columnIdentifier] =
-                        (typeof row.old === 'undefined' ? 'N/A' : row.old) +
-                        ' ' +
-                        String.fromCharCode(parseInt('2794', 16)) +
-                        ' ' +
-                        (typeof row.new === 'undefined' ? 'N/A' : row.new)
-                    }
-                  } else if (data.type === 'delete') {
-                    data.values[columnIdentifier] =
-                      typeof row.old === 'undefined' ? 'N/A' : row.old
-                  }
-
-                  if (!headers.map((h) => h.value).includes(columnIdentifier)) {
-                    headers.push({
-                      text: row.name,
-                      value: columnIdentifier,
-                      width: 50
-                    })
-                  }
-                })
-                changes.push(data.values)
-              })
-            }
-
-            _this.tables[key].headers = headers
-            _this.tables[key].changes = changes
-          }
-        })
-        .catch((err) => {
-          this.error({
-            text: getErrorMessage(err, 'Failed to display changeset of file')
-          })
-        })
-        .finally(() => {
-          this.loading = false
-          waitCursor(false)
-        })
-    }
-  }
-})
-</script>
-<style lang="scss" scoped>
-::v-deep(.v-data-table__wrapper) {
-  td.text-start {
-    max-width: 250px;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/ProjectSettingsViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/views/ProjectSettingsViewTemplate.vue
deleted file mode 100644
index e56afbcb..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/ProjectSettingsViewTemplate.vue
+++ /dev/null
@@ -1,210 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-layout class="settings column">
-    <slot
-      name="permissions"
-      :settings="settings"
-      :key-prop="key"
-      :save-project="saveProject"
-    ></slot>
-    <project-access-requests />
-    <v-layout class="public-private-zone">
-      <v-container>
-        <v-row>
-          <v-col>
-            <span class="private-public-text" v-if="settings.access.public">
-              <b>This is public project</b><br />
-              <span class="description-text"
-                >Hide this project from everyone.</span
-              >
-            </span>
-            <span class="private-public-text" v-else>
-              <b>This is private project</b><br />
-              <span class="description-text"
-                >Make this project visible to anyone.</span
-              >
-            </span>
-          </v-col>
-          <v-col>
-            <v-btn
-              @click="confirmPublicPrivate()"
-              class="private-public-btn"
-              outlined
-            >
-              <span v-if="settings.access.public">Make private</span>
-              <span v-else>Make public</span>
-            </v-btn>
-          </v-col>
-        </v-row>
-        <slot name="operations"></slot>
-        <v-row
-          v-if="project && project.permissions && project.permissions.delete"
-        >
-          <v-col>
-            <span class="private-public-text">
-              <b>Delete project</b><br />
-              <span class="description-text">All data will be lost</span></span
-            >
-          </v-col>
-          <v-col self-align="end">
-            <v-btn @click="confirmDelete" class="private-public-btn" outlined>
-              <span>Delete</span>
-            </v-btn>
-          </v-col>
-        </v-row>
-      </v-container>
-    </v-layout>
-  </v-layout>
-</template>
-
-<script lang="ts">
-import debounce from 'lodash/debounce'
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import ConfirmDialog from '@/modules/dialog/components/ConfirmDialog.vue'
-import { useDialogStore } from '@/modules/dialog/store'
-import { useNotificationStore } from '@/modules/notification/store'
-import ProjectAccessRequests from '@/modules/project/components/ProjectAccessRequests.vue'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'ProjectSettingsViewTemplate',
-  components: {
-    ProjectAccessRequests
-  },
-  props: {
-    namespace: String,
-    projectName: String,
-    asAdmin: {
-      type: Boolean,
-      default: false
-    },
-    showSettings: Boolean
-  },
-  data() {
-    return {
-      settings: {},
-      key: 0
-    }
-  },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useProjectStore, ['project'])
-  },
-  watch: {
-    project: {
-      immediate: true,
-      handler(project) {
-        if (
-          JSON.stringify(this.settings.access) !==
-          JSON.stringify(this.project.access)
-        ) {
-          this.settings = {
-            access: JSON.parse(JSON.stringify(project.access))
-          }
-        }
-        this.key++
-      }
-    }
-  },
-  created() {
-    if (!this.showSettings) {
-      this.$router.push('/projects')
-    }
-    this.settings = {
-      access: JSON.parse(JSON.stringify(this.project.access))
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['deleteProject', 'saveProjectSettings']),
-    ...mapActions(useDialogStore, ['show']),
-    ...mapActions(useNotificationStore, ['error']),
-
-    saveProject(newSettingsAccessValues) {
-      const newSettings = {
-        ...this.settings,
-        access: { ...this.settings.access, ...newSettingsAccessValues }
-      }
-      this.settings.access.readersnames = newSettings.access.readersnames
-      this.settings.access.ownersnames = newSettings.access.ownersnames
-      this.settings.access.writersnames = newSettings.access.writersnames
-      this.saveSettings(newSettings)
-    },
-    saveSettings: debounce(function (newSettings) {
-      try {
-        this.saveProjectSettings({
-          namespace: this.namespace,
-          newSettings,
-          projectName: this.projectName
-        })
-      } catch (err) {
-        this.error({
-          text: getErrorMessage(err, 'Failed to save project settings')
-        })
-      }
-    }, 2000),
-    togglePublicPrivate() {
-      this.settings.access.public = !this.settings.access.public
-    },
-    confirmDelete() {
-      const props = {
-        text: `Are you sure to delete project: ${this.projectName}? All files will be lost. <br> <br> Type in project name to confirm:`,
-        confirmText: 'Delete',
-        confirmField: {
-          label: 'Project name',
-          expected: this.projectName
-        }
-      }
-      const listeners = {
-        confirm: () => this.onDeleteProject()
-      }
-      this.show({
-        component: ConfirmDialog,
-        params: { props, listeners, dialog: { maxWidth: 500 } }
-      })
-    },
-    confirmPublicPrivate() {
-      const props = {
-        text: `Do you really want to make this project ${
-          this.settings.access.public ? 'private' : 'public'
-        }?`,
-        confirmText: 'Yes'
-      }
-      const listeners = {
-        confirm: () => this.togglePublicPrivate()
-      }
-      this.show({
-        component: ConfirmDialog,
-        params: { props, listeners, dialog: { maxWidth: 500 } }
-      })
-    },
-    onDeleteProject() {
-      this.deleteProject({
-        projectId: this.project.id
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-@use '@/sass/project';
-
-.settings {
-  display: flex;
-  flex-direction: column;
-  flex: 1 0 auto;
-}
-
-.actions {
-  flex: 0 0 auto;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsView.vue b/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsView.vue
deleted file mode 100644
index f9e37fcd..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsView.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <project-versions-view-template
-    :projectName="projectName"
-    :namespace="namespace"
-    :asAdmin="asAdmin"
-  />
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import ProjectVersionsViewTemplate from '@/modules/project/views/ProjectVersionsViewTemplate.vue'
-
-export default defineComponent({
-  name: 'ProjectVersionsView',
-  components: { ProjectVersionsViewTemplate },
-  props: {
-    projectName: String,
-    namespace: String,
-    asAdmin: {
-      type: Boolean,
-      default: false
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsViewTemplate.vue
deleted file mode 100644
index 33f6d28e..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/ProjectVersionsViewTemplate.vue
+++ /dev/null
@@ -1,293 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div>
-    <v-layout align-center shrink>
-      <v-spacer />
-    </v-layout>
-    <div class="text-center">
-      <v-pagination
-        v-if="showPagination && options && versionsCount > options.itemsPerPage"
-        v-model="options.page"
-        :length="Math.ceil(versionsCount / options.itemsPerPage)"
-        :total-visible="2"
-        circle
-        color="primary"
-        @input="fetchPage"
-      ></v-pagination>
-    </div>
-    <v-data-table
-      :headers="headers"
-      :items="items"
-      item-key="name"
-      :options="options"
-      :server-items-length="versionsCount"
-      v-on:update:options="paginating"
-      :hide-default-footer="true"
-      :loading="versionsLoading"
-      no-data-text="No project history"
-      color="primary"
-      data-cy="project-version-table"
-    >
-      <!-- headers -->
-      <template v-slot:header.changes.added="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Added</span>
-        </v-tooltip>
-      </template>
-      <template v-slot:header.changes.removed="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Deleted</span>
-        </v-tooltip>
-      </template>
-      <template v-slot:header.changes.updated="{ header }">
-        <v-tooltip bottom>
-          <template v-slot:activator="{ on }">
-            <v-icon v-on="on" small :color="header.color"
-              >{{ header.icon }}
-            </v-icon>
-          </template>
-          <span>Modified</span>
-        </v-tooltip>
-      </template>
-      <!-- data -->
-      <template v-slot:item.created="{ item }">
-        <span>
-          <v-tooltip bottom>
-            <template v-slot:activator="{ on }">
-              <span :style="[rowStyle(item)]" v-on="on">{{
-                item.created | timediff
-              }}</span>
-            </template>
-            <span>{{ item.created | datetime }}</span>
-          </v-tooltip>
-        </span>
-      </template>
-      <template v-slot:item.author="{ item }"
-        ><span :style="[rowStyle(item)]">{{ item.author }}</span></template
-      >
-      <template v-slot:item.name="{ item }">
-        <span data-cy="project-versions-version">
-          <router-link
-            :style="[rowStyle(item)]"
-            :to="
-              item.disabled
-                ? ''
-                : {
-                    name: 'project-versions-detail',
-                    params: { version_id: item.name }
-                  }
-            "
-          >
-            {{ item.name }}
-          </router-link>
-        </span>
-      </template>
-      <template v-slot:item.changes.added="{ item }">
-        <span>
-          <span :style="[rowStyle(item)]" class="green--text">{{
-            item.changes.added.length
-          }}</span>
-        </span>
-      </template>
-      <template v-slot:item.changes.removed="{ item }">
-        <span>
-          <span :style="[rowStyle(item)]" class="red--text">{{
-            item.changes.removed.length
-          }}</span>
-        </span>
-      </template>
-      <template v-slot:item.changes.updated="{ item }">
-        <span>
-          <span :style="[rowStyle(item)]" class="orange--text">{{
-            item.changes.updated.length
-          }}</span>
-        </span>
-      </template>
-      <template v-slot:item.project_size="{ item }">
-        <span :style="[rowStyle(item)]">{{
-          item.project_size | filesize
-        }}</span>
-      </template>
-      <template v-slot:item.archived="{ item }">
-        <v-tooltip top>
-          <template v-slot:activator="{ on }">
-            <v-btn
-              icon
-              v-on="on"
-              :disabled="item.disabled"
-              :style="[rowStyle(item)]"
-              data-cy="project-versions-download-btn"
-              @click="
-                downloadArchive({
-                  url:
-                    '/v1/project/download/' +
-                    namespace +
-                    '/' +
-                    projectName +
-                    '?version=' +
-                    item.name +
-                    '&format=zip'
-                })
-              "
-            >
-              <v-icon>archive</v-icon>
-            </v-btn>
-          </template>
-          <span>Download Project Version {{ item.name }} (ZIP)</span>
-        </v-tooltip>
-      </template>
-    </v-data-table>
-    <div class="text-center">
-      <v-pagination
-        v-if="showPagination && options && versionsCount > options.itemsPerPage"
-        v-model="options.page"
-        :length="Math.ceil(versionsCount / options.itemsPerPage)"
-        :total-visible="7"
-        circle
-        color="primary"
-        @input="fetchPage"
-      ></v-pagination>
-    </div>
-    <slot name="table-footer"></slot>
-  </div>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent, PropType } from 'vue'
-
-import {
-  FetchProjectVersionsParams,
-  ProjectVersion,
-  ProjectVersionsItem
-} from '@/modules'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'ProjectVersionsViewTemplate',
-  props: {
-    projectName: String,
-    namespace: String,
-    asAdmin: {
-      type: Boolean,
-      default: false
-    },
-    /** Default items per page */
-    defaultItemsPerPage: Number as PropType<number>,
-    /** Disabled keys (name attribute of rows in vuetify table are keys for items) */
-    disabledKeys: { type: Array as PropType<string[]>, default: () => [] },
-    /** Show pagination */
-    showPagination: { type: Boolean, default: true }
-  },
-  data() {
-    return {
-      headers: [
-        { text: 'Version', value: 'name' },
-        { text: 'Created', value: 'created' },
-        { text: 'Author', value: 'author', sortable: false },
-        {
-          text: 'Added',
-          value: 'changes.added',
-          icon: 'add_circle',
-          color: 'green',
-          sortable: false
-        },
-        {
-          text: 'Removed',
-          value: 'changes.removed',
-          icon: 'delete',
-          color: 'red',
-          sortable: false
-        },
-        {
-          text: 'Modified',
-          value: 'changes.updated',
-          icon: 'edit',
-          color: 'orange',
-          sortable: false
-        },
-        { text: 'Size', value: 'project_size', sortable: false },
-        { text: '', value: 'archived', sortable: false }
-      ],
-      options: {
-        sortDesc: [true],
-        itemsPerPage: this.defaultItemsPerPage ?? 50,
-        page: 1
-      }
-    }
-  },
-  computed: {
-    ...mapState(useProjectStore, [
-      'versions',
-      'versionsLoading',
-      'versionsCount'
-    ]),
-    /**
-     * Table data from versions in global state transformed
-     */
-    items(): ProjectVersionsItem[] {
-      const versions: ProjectVersion[] = this.versions
-
-      return versions?.map<ProjectVersionsItem>((v) => ({
-        ...v,
-        disabled: this.disabledKeys.some((d) => d === v.name)
-      }))
-    }
-  },
-  watch: {
-    $route: 'fetchVersions'
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['fetchProjectVersions', 'downloadArchive']),
-    paginating(options) {
-      this.options = options
-      this.fetchVersions()
-    },
-    fetchPage(number) {
-      this.options.page = number
-      this.fetchVersions()
-    },
-    rowStyle(item: ProjectVersionsItem) {
-      return item.disabled && { opacity: 0.5, cursor: 'not-allowed' }
-    },
-    async fetchVersions() {
-      const params: FetchProjectVersionsParams = {
-        page: this.options.page,
-        per_page: this.options.itemsPerPage,
-        descending: this.options.sortDesc[0]
-      }
-      await this.fetchProjectVersions({
-        params,
-        namespace: this.namespace,
-        projectName: this.projectName
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.v-card.table {
-  min-height: unset;
-  overflow: unset;
-}
-
-.changes {
-  flex: 0.3 1 auto;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/ProjectViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/views/ProjectViewTemplate.vue
deleted file mode 100644
index 05d7ff63..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/ProjectViewTemplate.vue
+++ /dev/null
@@ -1,478 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <page-view
-    :style="`padding-left: ${
-      drawer ? 260 : 20
-    }px; overflow-y: auto; padding-right:20px; margin-right: 0px;`"
-  >
-    <div slot="left" class="panel" />
-    <v-layout class="column fill-height project-page main-content">
-      <v-card v-if="project" style="margin-bottom: 0" outlined>
-        <!-- Toolbar -->
-        <v-layout class="row align-center toolbar">
-          <div class="breadcrumbs" style="font-size: 20px">
-            <v-icon color="primary">map</v-icon>
-            <span v-if="showNamespace" class="primary--text"
-              >{{ project.namespace }} /</span
-            >
-            <router-link
-              :to="{
-                name: 'project',
-                project: project
-              }"
-            >
-              <b>{{ project.name }}</b></router-link
-            >
-
-            <router-link
-              :to="{
-                name: 'project-versions-detail'
-              }"
-              v-slot="{ href, route, navigate }"
-            >
-              <span v-if="route.params.version_id">
-                &gt;
-                <a :href="href" @click="navigate">
-                  {{ route.params.version_id }}
-                </a>
-              </span>
-            </router-link>
-            <router-link
-              :to="{ name: 'file-version-detail' }"
-              v-slot="{ href, route, navigate }"
-            >
-              <span v-if="route.params.path">
-                &gt;
-                <a :href="href" @click="navigate">
-                  {{ route.params.path }}
-                </a>
-              </span>
-            </router-link>
-          </div>
-          <v-spacer />
-          <portal-target name="project-toolbar" class="layout row shrink" />
-          <slot name="shareButton">
-            <project-share-button />
-          </slot>
-          <action-button
-            @click="downloadArchive({ url: downloadUrl })"
-            data-cy="project-download-btn"
-          >
-            <template #icon>
-              <download-icon />
-            </template>
-            Download
-          </action-button>
-          <action-button
-            @click="cloneDialog"
-            v-if="canCloneProject"
-            data-cy="project-clone-btn"
-          >
-            <template #icon>
-              <copy-icon />
-            </template>
-            Clone
-          </action-button>
-          <action-button
-            @click="unsubscribeDialog"
-            data-cy="project-leave-btn"
-            v-if="canLeaveProject"
-          >
-            <template #icon>
-              <square-minus-icon />
-            </template>
-            Leave project
-          </action-button>
-        </v-layout>
-
-        <v-card class="layout column fill-height" flat>
-          <v-card-title>
-            <v-tabs left-active v-model="tab" show-arrows>
-              <v-tabs-slider color="primary"></v-tabs-slider>
-              <v-tab
-                key="files"
-                :to="{
-                  name: `project-tree`,
-                  params: { namespace: namespace, projectName: project.name }
-                }"
-                >Files
-              </v-tab>
-              <slot name="map.tab" v-if="loggedUser" />
-              <v-tab
-                key="history"
-                v-if="loggedUser && showHistory"
-                :to="{
-                  name: `project-versions`,
-                  params: { namespace: namespace, projectName: project.name }
-                }"
-                >History
-              </v-tab>
-              <v-tab
-                key="settings"
-                v-if="loggedUser && showSettings"
-                :to="{
-                  name: `project-settings`,
-                  params: { namespace: namespace, projectName: project.name }
-                }"
-                >Settings
-              </v-tab>
-            </v-tabs>
-          </v-card-title>
-          <v-divider></v-divider>
-          <router-view v-if="project" class="content-container" />
-        </v-card>
-      </v-card>
-      <v-card v-else-if="fetchProjectsResponseStatus === 403">
-        <v-layout
-          class="public-private-zone"
-          style="padding-top: 25px; padding-left: 25px"
-        >
-          <v-btn id="request-access-btn" @click="createAccessRequest"
-            >Request access
-          </v-btn>
-          <span class="private-public-text">
-            <b>This is a private project</b><br />
-            You don't have permissions to access this project.
-          </span>
-        </v-layout>
-      </v-card>
-      <v-card v-else-if="fetchProjectsResponseStatus === 404">
-        <span
-          class="private-public-text"
-          style="padding-top: 25px; padding-left: 25px"
-        >
-          <b>Project not found</b><br />
-          Please check if address is written correctly
-        </span>
-      </v-card>
-      <v-card v-else-if="fetchProjectsResponseStatus === 409">
-        <span
-          class="private-public-text"
-          style="padding-top: 25px; padding-left: 25px"
-        >
-          <b>You don't have permission to access this project</b><br />
-          You already requested access
-        </span>
-      </v-card>
-      <drop-area
-        v-if="
-          project &&
-          $route.name === 'project-tree' &&
-          project.permissions &&
-          project.permissions.upload
-        "
-        class="drop-area"
-        :location="location"
-        data-cy="project-drop-area"
-      >
-        <v-layout row wrap align-center class="drag-drop-text">
-          <span>
-            <v-icon>publish</v-icon> Drag & drop here or click and select
-            file(s) to upload
-          </span>
-        </v-layout>
-      </drop-area>
-    </v-layout>
-    <div slot="right" class="panel">
-      <upload-panel v-if="upload" :namespace="namespace" class="my-1 mr-1" />
-    </div>
-  </page-view>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent, PropType } from 'vue'
-import { CopyIcon, DownloadIcon, SquareMinusIcon } from 'vue-tabler-icons'
-
-import ActionButton from '@/common/components/ActionButton.vue'
-import { waitCursor } from '@/common/html_utils'
-import { USER_ROLE_NAME_BY_ROLE, UserRole } from '@/common/permission_utils'
-import ConfirmDialog from '@/modules/dialog/components/ConfirmDialog.vue'
-import { useDialogStore } from '@/modules/dialog/store'
-import PageView from '@/modules/layout/components/PageView.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import { useNotificationStore } from '@/modules/notification/store'
-import DropArea from '@/modules/project/components/DropArea.vue'
-import ProjectShareButton from '@/modules/project/components/ProjectShareButton.vue'
-import UploadPanel from '@/modules/project/components/UploadPanel.vue'
-import { ProjectApi } from '@/modules/project/projectApi'
-import { useProjectStore } from '@/modules/project/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'ProjectViewTemplate',
-  components: {
-    ActionButton,
-    ProjectShareButton,
-    PageView,
-    UploadPanel,
-    DropArea,
-    CopyIcon,
-    DownloadIcon,
-    SquareMinusIcon
-  },
-  props: {
-    /**  Show namespace (ws) label in breadcrumb of page */
-    showNamespace: {
-      type: Boolean as PropType<boolean>,
-      default: true
-    },
-    namespace: String,
-    projectName: String,
-    location: {
-      type: String,
-      default: ''
-    },
-    showSettings: Boolean as PropType<boolean>,
-    showHistory: { type: Boolean as PropType<boolean>, default: true },
-    hideCloneButton: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      fetchProjectsResponseStatus: null,
-      tab: null
-    }
-  },
-  computed: {
-    ...mapState(useLayoutStore, ['drawer']),
-    ...mapState(useProjectStore, ['project', 'uploads']),
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useProjectStore, ['isProjectOwner']),
-    ...mapState(useUserStore, ['currentWorkspace', 'isLoggedIn']),
-
-    canCloneProject() {
-      return this.isLoggedIn && !this.hideCloneButton
-    },
-
-    canLeaveProject() {
-      return (
-        this.project?.workspace_id === this.currentWorkspace?.id &&
-        this.currentWorkspace?.role === USER_ROLE_NAME_BY_ROLE[UserRole.guest]
-      )
-    },
-
-    upload() {
-      return this.project && this.uploads[this.project.path]
-    },
-    downloadUrl() {
-      if (this.$route.name === 'project-versions-detail') {
-        return ProjectApi.constructDownloadProjectVersionUrl(
-          this.namespace,
-          this.projectName,
-          this.$route.params.version_id
-        )
-      } else {
-        return this.constructDownloadProjectUrl({
-          namespace: this.namespace,
-          projectName: this.projectName
-        })
-      }
-    }
-  },
-  async created() {
-    if (
-      !this.project ||
-      this.project.name !== this.projectName ||
-      this.project.namespace !== this.namespace
-    ) {
-      this.setProject({ project: null })
-      await this.getProject()
-    }
-  },
-  watch: {
-    project() {
-      if (
-        !this.project ||
-        this.project.name !== this.projectName ||
-        this.project.namespace !== this.namespace
-      ) {
-        this.setProject({ project: null })
-        this.getProject()
-      }
-    }
-  },
-  methods: {
-    ...mapActions(useProjectStore, [
-      'downloadArchive',
-      'fetchProjectDetail',
-      'unsubscribeProject',
-      'constructDownloadProjectUrl'
-    ]),
-    ...mapActions(useProjectStore, ['setProject']),
-    ...mapActions(useDialogStore, { showDialog: 'show' }),
-    ...mapActions(useNotificationStore, ['error', 'show']),
-
-    setFetchProjectResponseStatus(status) {
-      this.fetchProjectsResponseStatus = status
-    },
-    async getProject() {
-      await new Promise((resolve) => {
-        resolve(
-          this.fetchProjectDetail({
-            callbackStatus: this.setFetchProjectResponseStatus,
-            projectName: this.projectName,
-            namespace: this.namespace,
-            isLoggedUser: !!this.loggedUser
-          })
-        )
-      })
-    },
-    cloneDialog() {
-      this.$emit('open-clone-dialog')
-    },
-    createAccessRequest() {
-      waitCursor(true)
-      ProjectApi.createProjectAccessRequest(
-        this.namespace,
-        this.projectName,
-        true
-      )
-        .then(() => {
-          waitCursor(false)
-          this.show({
-            text: 'Access has been requested'
-          })
-          this.$router.push({
-            name: 'projects'
-          })
-        })
-        .catch(() => {
-          this.error({
-            text: 'Failed to request'
-          })
-          waitCursor(false)
-        })
-    },
-    unsubscribeDialog() {
-      const projPath = `${this.namespace}/${this.projectName}`
-      const props = {
-        text: `Are you sure to leave the project <strong>${projPath}</strong>?
-        You will not have access to it anymore.`,
-        confirmText: 'OK'
-      }
-      const listeners = {
-        confirm: async () => {
-          await this.unsubscribeProject({ id: this.project.id })
-          if (!this.project) {
-            await this.$router.push('/dashboard')
-          }
-        }
-      }
-      this.showDialog({
-        component: ConfirmDialog,
-        params: { props, listeners, dialog: { maxWidth: 500 } }
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.project-page {
-  .drop-area {
-    max-height: 100%;
-    display: flex;
-    flex-grow: 1;
-    flex-direction: column;
-  }
-
-  .v-card {
-    display: flex;
-    flex-direction: column;
-    margin: 0.25em;
-    overflow: unset;
-    flex-grow: 0;
-
-    .content-container {
-      padding: 0.25em 0;
-      background-color: #fff;
-      flex: 1;
-    }
-  }
-
-  small {
-    opacity: 0.6;
-    margin-bottom: 2px;
-  }
-}
-
-.theme--light.v-card.v-sheet--outlined {
-  border: none;
-}
-
-.panel {
-  flex: 1 1;
-  box-sizing: border-box;
-  position: relative;
-}
-
-.v-card__subtitle,
-.v-card__text,
-.v-card__title {
-  padding: 16px 0 16px 0;
-}
-
-.toolbar {
-  max-width: 100%;
-  margin-right: 0;
-  margin-left: 0;
-  flex-shrink: 0;
-  flex-grow: 0;
-  padding: 0.5em 1em;
-  background-color: #fafafa;
-  border: solid #eee;
-  border-width: 1px 0;
-
-  ::v-deep(*) {
-    .v-text-field {
-      padding-top: 0;
-      margin-top: 0;
-      font-size: 15px;
-    }
-
-    .v-btn {
-      padding: 0 0.5em;
-      margin: 0.25em;
-      min-width: 2em;
-    }
-  }
-}
-
-.breadcrumbs {
-  color: #777;
-
-  a {
-    text-decoration: none;
-    margin: 0 0.25em;
-  }
-}
-
-.drop-area {
-  margin-top: 5px;
-  padding-left: 5px;
-
-  .drag-drop-text {
-    border: 1px dashed rgba(0, 0, 0, 0.6);
-    opacity: 0.6;
-    margin: 0.25em 0.25em 0.25em 0.25em;
-
-    span {
-      width: 100%;
-      text-align: center;
-      margin: 20px;
-    }
-
-    i {
-      transform: rotate(180deg);
-    }
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/ProjectsListViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/project/views/ProjectsListViewTemplate.vue
deleted file mode 100644
index 5a9ab6c8..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/ProjectsListViewTemplate.vue
+++ /dev/null
@@ -1,157 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <page-view
-    :style="`padding-left: ${
-      drawer ? 260 : 20
-    }px; overflow-y: auto; padding-right:20px; margin-right: 0px;`"
-  >
-    <v-layout v-if="!namespace" class="column fill-height main-content">
-      <v-layout shrink class="column ml-1 my-2 pl-3">
-        <v-layout align-center shrink>
-          <h1 class="primary--text">
-            {{ header }}
-            <span v-if="namespace">
-              <v-icon class="arrow">chevron_right</v-icon> {{ namespace }}</span
-            >
-          </h1>
-          <v-spacer />
-          <portal-target name="additional-action" />
-          <div class="action-button" v-if="canCreateProject">
-            <action-button
-              v-if="loggedUser && loggedUser.email"
-              @click="newProjectDialog"
-              data-cy="action-button-create"
-            >
-              <template #icon>
-                <plus-icon />
-              </template>
-              Create
-            </action-button>
-          </div>
-          <div class="action-button" v-if="!onlyPublic">
-            <action-button
-              v-if="loggedUser && loggedUser.email"
-              @click="findPublicProjects"
-            >
-              <template #icon>
-                <search-icon />
-              </template>
-              Find public projects
-            </action-button>
-          </div>
-        </v-layout>
-        <br />
-        <v-divider />
-      </v-layout>
-      <v-card class="table" style="-webkit-box-shadow: none; box-shadow: none">
-        <v-card-text>
-          <slot name="projects" :onlyPublic="onlyPublic"></slot>
-        </v-card-text>
-      </v-card>
-    </v-layout>
-    <v-layout v-else class="column fill-height main-content">
-      <v-card>
-        <span
-          class="private-public-text"
-          style="padding-top: 25px; padding-left: 25px"
-        >
-          <b>Namespace not found</b><br />
-          Please check if address is written correctly
-        </span>
-      </v-card>
-    </v-layout>
-  </page-view>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-import { PlusIcon, SearchIcon } from 'vue-tabler-icons'
-
-import ActionButton from '@/common/components/ActionButton.vue'
-import { useDialogStore } from '@/modules'
-import PageView from '@/modules/layout/components/PageView.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import ProjectForm from '@/modules/project/components/ProjectForm.vue'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'ProjectsListView',
-  components: { ActionButton, PageView, PlusIcon, SearchIcon },
-  props: {
-    namespace: String,
-    canCreateProject: Boolean
-  },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useLayoutStore, ['drawer']),
-    header() {
-      return this.onlyPublic ? 'Mergin Maps public projects' : 'Projects'
-    },
-    onlyPublic() {
-      return this.$route.name === 'explore' || !this.loggedUser?.email
-    }
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['show']),
-
-    findPublicProjects() {
-      this.$router.push({
-        name: 'explore'
-      })
-    },
-    newProjectDialog() {
-      const dialog = { maxWidth: 500, persistent: true }
-      this.show({
-        component: ProjectForm,
-        params: {
-          listeners: {
-            error: (err, data) => this.$emit('new-project-error', err, data)
-          },
-          dialog
-        }
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-h1 a {
-  text-decoration: none;
-}
-
-.v-card.table {
-  min-height: unset;
-  overflow: unset;
-}
-
-.arrow {
-  color: black;
-  font-size: large;
-}
-
-@media (max-width: 400px) {
-  .action-button {
-    width: 135px;
-  }
-}
-
-.action-button {
-  div {
-    display: inline-block;
-  }
-}
-
-.toggle-toolbar {
-  position: fixed;
-  left: 5px;
-  z-index: 100;
-  bottom: 20px;
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/VersionDetailView.vue b/web-app/packages/lib-vue2/src/modules/project/views/VersionDetailView.vue
deleted file mode 100644
index af6dffc3..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/VersionDetailView.vue
+++ /dev/null
@@ -1,256 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <div v-if="version">
-    <portal to="download-button">
-      <v-tooltip top>
-        <template v-slot:activator="{ on }">
-          <v-btn icon v-on="on" :href="downloadUrl">
-            <v-icon>archive</v-icon>
-          </v-btn>
-        </template>
-        <span>Download Project Version {{ version.name }} (ZIP)</span>
-      </v-tooltip>
-    </portal>
-    <v-list two-line subheader>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Version</v-list-item-title>
-          <v-list-item-subtitle>{{ version.name }}</v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Author</v-list-item-title>
-          <v-list-item-subtitle>{{ version.author }}</v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Project Size</v-list-item-title>
-          <v-list-item-subtitle
-            >{{ version.project_size | filesize }}
-          </v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Created</v-list-item-title>
-          <v-list-item-subtitle
-            >{{ version.created | datetime }}
-          </v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>User Agent</v-list-item-title>
-          <v-list-item-subtitle>{{ version.user_agent }}</v-list-item-subtitle>
-        </v-list-item-content>
-      </v-list-item>
-    </v-list>
-    <v-list class="files" expand>
-      <v-list-item>
-        <v-list-item-content>
-          <v-list-item-title>Files changes:</v-list-item-title>
-        </v-list-item-content>
-      </v-list-item>
-      <v-list-group
-        data-cy="version-detail-groups"
-        v-for="{ key, text, icon } in changeHeader"
-        :key="key"
-        no-action
-      >
-        <!--                v-if="changes[key].length"-->
-        <template v-slot:activator>
-          <v-list-item-content>
-            <v-list-item-title>
-              <v-icon small v-text="icon" class="mr-2" />
-              <span>{{ text }} ({{ changes[key].length }})</span>
-            </v-list-item-title>
-          </v-list-item-content>
-        </template>
-
-        <div
-          class="v-list__tile v-list-item-file"
-          v-for="item in changes[key]"
-          :key="item.path"
-          no-action
-        >
-          <div :class="colors[key]">
-            {{ item.path }}:
-            {{
-              version.changesets[item.path]
-                ? version.changesets[item.path]['size']
-                : item.size | filesize
-            }}
-            <template v-if="version.changesets[item.path]">
-              <div v-if="!version.changesets[item.path].error">
-                <router-link
-                  class="show-advanced"
-                  :to="{
-                    name: 'file-version-detail',
-                    params: {
-                      namespace: version.namespace,
-                      projectName: version.project_name,
-                      version_id: version.name,
-                      path: item.path
-                    }
-                  }"
-                >
-                  <v-btn data-cy="version-detail-advanced-btn">
-                    <span>Show advanced</span>
-                  </v-btn>
-                </router-link>
-                <file-changeset-summary-table
-                  :changesets="version.changesets[item.path]['summary']"
-                />
-              </div>
-              <div v-else class="text--primary">
-                Details not available: {{ version.changesets[item.path].error }}
-              </div>
-            </template>
-          </div>
-        </div>
-      </v-list-group>
-    </v-list>
-  </div>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { useNotificationStore } from '@/modules/notification/store'
-import FileChangesetSummaryTable from '@/modules/project/components/FileChangesetSummaryTable.vue'
-import { ProjectApi } from '@/modules/project/projectApi'
-import { useProjectStore } from '@/modules/project/store'
-
-const Colors = {
-  added: 'green--text',
-  removed: 'red--text',
-  updated: 'orange--text'
-}
-
-export default defineComponent({
-  name: 'VersionDetailView',
-  components: { FileChangesetSummaryTable },
-  props: {
-    version_id: {
-      type: String,
-      default: ''
-    },
-    asAdmin: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      version: null
-    }
-  },
-  created() {
-    this.getVersion()
-  },
-  computed: {
-    ...mapState(useProjectStore, ['project', 'versions']),
-    colors() {
-      return Colors
-    },
-    changeHeader() {
-      return [
-        { key: 'added', text: 'Added', icon: 'add_circle' },
-        { key: 'removed', text: 'Removed', icon: 'delete' },
-        { key: 'updated', text: 'Modified', icon: 'edit' }
-      ]
-    },
-    changes() {
-      return this.version?.changes
-    },
-    downloadUrl() {
-      return ProjectApi.constructDownloadProjectVersionUrl(
-        this.project.namespace,
-        this.project.name,
-        this.version_id
-      )
-    }
-  },
-  watch: {
-    $route: 'getVersion'
-  },
-  methods: {
-    ...mapActions(useNotificationStore, ['error']),
-    async getVersion() {
-      try {
-        const currentVersion = this.versions?.find(
-          (v) => v.name === this.version_id
-        )
-        if (currentVersion) {
-          this.version = currentVersion
-          return
-        }
-        const response = await ProjectApi.getProjectVersion(
-          this.project.id,
-          this.version_id
-        )
-        this.version = response.data
-      } catch (err) {
-        this.error({
-          text: getErrorMessage(err, 'Failed to fetch project version')
-        })
-      }
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.status {
-  margin: 0.5em auto;
-  padding: 0 1em;
-  text-align: center;
-  color: #fff;
-  height: 2em;
-  line-height: 2em;
-  border-radius: 1em;
-  float: right;
-}
-
-.v-list-item-file {
-  min-height: 48px;
-  height: auto;
-}
-
-.v-list {
-  ::v-deep(.v-list-item) {
-    font-size: 14px;
-    color: #444;
-
-    .v-list-item__title {
-      font-weight: 500;
-    }
-  }
-
-  &.files {
-    ::v-deep(.v-list-group__items) {
-      .v-list-item {
-        padding-left: 20px;
-      }
-    }
-  }
-}
-
-.show-advanced {
-  font-style: unset;
-
-  button {
-    font-size: 12px;
-    margin-left: 30px;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/project/views/index.ts b/web-app/packages/lib-vue2/src/modules/project/views/index.ts
deleted file mode 100644
index 467ffb5e..00000000
--- a/web-app/packages/lib-vue2/src/modules/project/views/index.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as FileBrowserView } from './FileBrowserView.vue'
-export { default as FileDetailView } from './FileDetailView.vue'
-export { default as FileVersionDetailView } from './FileVersionDetailView.vue'
-export { default as ProjectsListViewTemplate } from './ProjectsListViewTemplate.vue'
-export { default as ProjectSettingsViewTemplate } from './ProjectSettingsViewTemplate.vue'
-export { default as ProjectVersionsView } from './ProjectVersionsView.vue'
-export { default as ProjectViewTemplate } from './ProjectViewTemplate.vue'
-export { default as VersionDetailView } from './VersionDetailView.vue'
-export { default as ProjectVersionsViewTemplate } from './ProjectVersionsViewTemplate.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/types.ts b/web-app/packages/lib-vue2/src/modules/types.ts
deleted file mode 100644
index 3050d968..00000000
--- a/web-app/packages/lib-vue2/src/modules/types.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-// Copyright (C) 2022 Lutra Consulting Limited. All rights reserved.
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { DialogState } from '@/modules/dialog'
-import { FormState } from '@/modules/form'
-import { InstanceState } from '@/modules/instance'
-import { LayoutState } from '@/modules/layout'
-import { NotificationState } from '@/modules/notification'
-import { ProjectState } from '@/modules/project'
-import { UserState } from '@/modules/user'
-
-export interface RootState {
-  dialogModule: DialogState
-  formModule: FormState
-  instanceModule: InstanceState
-  layoutModule: LayoutState
-  notificationModule: NotificationState
-  projectModule: ProjectState
-  userModule: UserState
-}
diff --git a/web-app/packages/lib-vue2/src/modules/user/components/ChangePasswordForm.vue b/web-app/packages/lib-vue2/src/modules/user/components/ChangePasswordForm.vue
deleted file mode 100644
index 821353c3..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/components/ChangePasswordForm.vue
+++ /dev/null
@@ -1,148 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card>
-    <v-card-title>
-      <span class="text-h5">Change password</span>
-    </v-card-title>
-    <v-card-text>
-      <v-form
-        @submit.prevent
-        class="layout column"
-        data-cy="user-change-password-form"
-      >
-        <v-text-field
-          label="Old Password"
-          name="oldPassword"
-          color="inputColor"
-          v-model="oldPassword"
-          data-cy="user-change-password-old"
-          :append-icon="passwordVisible ? 'visibility_off' : 'visibility'"
-          @click:append="passwordVisible = !passwordVisible"
-          :type="passwordVisible ? 'text' : 'password'"
-          :error-messages="errors.old_password"
-        />
-        <v-text-field
-          label="New Password"
-          name="password"
-          color="inputColor"
-          v-model="password"
-          data-cy="user-change-password-new"
-          :type="passwordVisible ? 'text' : 'password'"
-          :error-messages="errors.password"
-          @keyup.enter="changePassword"
-        />
-        <v-text-field
-          label="Confirm New Password"
-          name="confirm"
-          color="inputColor"
-          v-model="confirm"
-          data-cy="user-change-password-confirm"
-          :type="passwordVisible ? 'text' : 'password'"
-          :error-messages="errors.confirm"
-          @keyup.enter="changePassword"
-        />
-        <v-layout row class="d-flex flex-row-reverse">
-          <v-tooltip
-            top
-            color="orange"
-            max-width="350"
-            content-class="form-tooltip"
-          >
-            <template v-slot:activator="{ on }">
-              <v-icon v-on="on" class="ml-1 mb-1" style="margin-right: 1rem"
-                >info
-              </v-icon>
-            </template>
-            <ul>
-              <li>Password must be at least 8 characters long.</li>
-              <li>
-                Password must contain at least 3 character categories among the
-                following:
-                <ul>
-                  <li>Lowercase characters (a-z)</li>
-                  <li>Uppercase characters (A-Z)</li>
-                  <li>Digits (0-9)</li>
-                  <li>Special characters</li>
-                </ul>
-              </li>
-            </ul>
-          </v-tooltip>
-        </v-layout>
-
-        <v-card-actions>
-          <v-spacer />
-          <v-btn
-            class="text--primary"
-            @click="close"
-            data-cy="user-change-password-close-btn"
-          >
-            Close
-          </v-btn>
-          <v-btn
-            class="primary text--white"
-            :disabled="!password || !oldPassword || !confirm"
-            @click="changePassword"
-            data-cy="user-change-password-change-btn"
-          >
-            Change
-          </v-btn>
-        </v-card-actions>
-      </v-form>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { waitCursor } from '@/common/html_utils'
-import { useDialogStore } from '@/modules/dialog/store'
-import { useFormStore } from '@/modules/form/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  data() {
-    return {
-      oldPassword: '',
-      password: '',
-      confirm: '',
-      passwordVisible: false
-    }
-  },
-  computed: {
-    ...mapState(useFormStore, ['getErrorByComponentId']),
-    errors() {
-      return this.getErrorByComponentId(this.merginComponentUuid) ?? {}
-    }
-  },
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-  methods: {
-    ...mapActions(useFormStore, ['clearErrors']),
-    ...mapActions(useDialogStore, ['close']),
-    ...mapActions(useUserStore, {
-      changePasswordAction: 'changePassword'
-    }),
-    changePassword() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      const data = {
-        old_password: this.oldPassword,
-        password: this.password,
-        confirm: this.confirm
-      }
-      waitCursor(true)
-      this.changePasswordAction({ data, componentId: this.merginComponentUuid })
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/user/components/EditProfileForm.vue b/web-app/packages/lib-vue2/src/modules/user/components/EditProfileForm.vue
deleted file mode 100644
index efd4f756..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/components/EditProfileForm.vue
+++ /dev/null
@@ -1,113 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card v-on:keyup.enter="submit" data-cy="profile-edit-form">
-    <v-card-title>
-      <span class="text-h5">Edit profile</span>
-    </v-card-title>
-    <v-card-text>
-      <v-form @submit.prevent class="layout column">
-        <v-text-field
-          label="First name"
-          v-model="editedProfile.first_name"
-          data-cy="profile-edit-first-name"
-          :error-messages="errors.first_name"
-          @keyup.enter="submit"
-        />
-        <v-text-field
-          label="Last name"
-          v-model="editedProfile.last_name"
-          data-cy="profile-edit-last-name"
-          :error-messages="errors.last_name"
-          @keyup.enter="submit"
-        />
-        <v-text-field
-          label="Email address"
-          v-model="editedProfile.email"
-          data-cy="profile-edit-email"
-          :error-messages="errors.email"
-          @keyup.enter="submit"
-        />
-        <v-checkbox
-          label="Receive notifications"
-          color="orange"
-          data-cy="profile-edit-notification"
-          v-model="editedProfile.receive_notifications"
-          :error-messages="errors.receive_notifications"
-        />
-
-        <v-card-actions>
-          <v-spacer />
-          <v-btn
-            class="text--primary"
-            @click="close"
-            data-cy="profile-edit-close-btn"
-          >
-            Close
-          </v-btn>
-          <v-btn
-            class="primary white--text"
-            data-cy="profile-edit-save-btn"
-            @click="submit"
-          >
-            Save
-          </v-btn>
-        </v-card-actions>
-      </v-form>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { useDialogStore } from '@/modules/dialog/store'
-import { useFormStore } from '@/modules/form/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  props: {
-    profile: Object
-  },
-  data() {
-    return {
-      editedProfile: Object.assign({}, this.profile)
-    }
-  },
-  computed: {
-    ...mapState(useFormStore, ['getErrorByComponentId']),
-    errors() {
-      return this.getErrorByComponentId(this.merginComponentUuid) ?? {}
-    }
-  },
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-  methods: {
-    ...mapActions(useFormStore, ['clearErrors']),
-    ...mapActions(useUserStore, ['editUserProfile']),
-    ...mapActions(useDialogStore, ['close']),
-
-    submit() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      const keys = ['first_name', 'last_name', 'email']
-      keys.forEach((key) => {
-        if (this.editedProfile[key])
-          this.editedProfile[key] = this.editedProfile[key].trim()
-      })
-      this.editUserProfile({
-        editedUser: this.editedProfile,
-        componentId: this.merginComponentUuid
-      })
-    }
-  }
-})
-</script>
diff --git a/web-app/packages/lib-vue2/src/modules/user/components/ProfileAccessRequestsRow.vue b/web-app/packages/lib-vue2/src/modules/user/components/ProfileAccessRequestsRow.vue
deleted file mode 100644
index 02996a23..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/components/ProfileAccessRequestsRow.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-card class="table" v-if="accessRequests && accessRequestsCount > 0" flat>
-    <v-card-text>
-      <h3>You requested access to these projects</h3>
-      <project-access-request-table />
-    </v-card-text>
-  </v-card>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import ProjectAccessRequestTable from '@/modules/project/components/ProjectAccessRequestTable.vue'
-import { useProjectStore } from '@/modules/project/store'
-
-export default defineComponent({
-  name: 'ProfileAccessRequestsRow',
-  components: { ProjectAccessRequestTable },
-  computed: {
-    ...mapState(useProjectStore, ['accessRequests', 'accessRequestsCount'])
-  },
-  async created() {
-    await this.initUserAccessRequests()
-  },
-  methods: {
-    ...mapActions(useProjectStore, ['initUserAccessRequests'])
-  }
-})
-</script>
-
-<style scoped lang="scss"></style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/components/UserSearchChip.vue b/web-app/packages/lib-vue2/src/modules/user/components/UserSearchChip.vue
deleted file mode 100644
index 76f18752..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/components/UserSearchChip.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <v-chip v-bind="$attrs" v-on="$listeners" label :ripple="false">
-    <v-avatar size="18" left>
-      <send-icon v-if="item.isInvite" size="18" class="primary--text" />
-      <user-icon v-else size="18" class="primary--text" />
-    </v-avatar>
-    {{ item.isInvite ? item.email : item.username }}
-  </v-chip>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType } from 'vue'
-import { SendIcon, UserIcon } from 'vue-tabler-icons'
-
-import { UserSearchInvite, UserSearch } from '@/modules/user/types'
-
-export default defineComponent({
-  name: 'UserSearchChip',
-  components: { SendIcon, UserIcon },
-  props: {
-    item: Object as PropType<UserSearch | UserSearchInvite>
-  }
-})
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/components/index.ts b/web-app/packages/lib-vue2/src/modules/user/components/index.ts
deleted file mode 100644
index 559770ae..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/components/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as ChangePasswordForm } from './ChangePasswordForm.vue'
-export { default as EditProfileForm } from './EditProfileForm.vue'
-export { default as ProfileAccessRequestsRow } from './ProfileAccessRequestsRow.vue'
-export { default as UserSearchChip } from './UserSearchChip.vue'
diff --git a/web-app/packages/lib-vue2/src/modules/user/constants.ts b/web-app/packages/lib-vue2/src/modules/user/constants.ts
deleted file mode 100644
index 53100dff..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/constants.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { UserSearchInvite } from './types'
-
-export const EMPTY_INVITE_ITEM: UserSearchInvite = {
-  email: null,
-  username: null,
-  id: null,
-  profile: null,
-  isInvite: true
-}
diff --git a/web-app/packages/lib-vue2/src/modules/user/index.ts b/web-app/packages/lib-vue2/src/modules/user/index.ts
deleted file mode 100644
index 675147ae..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/index.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export * from './components'
-export * from './constants'
-export * from './views'
-export * from './store'
-export * from './userApi'
-export * from './module'
-export * from './types'
diff --git a/web-app/packages/lib-vue2/src/modules/user/module.ts b/web-app/packages/lib-vue2/src/modules/user/module.ts
deleted file mode 100644
index 5c9dd5cb..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/module.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import getRoutes from './routes'
-
-import { applyRouteOverride } from '@/common/module_utils'
-import { Module } from '@/common/types'
-
-export const UserModule: Module = {
-  name: 'userModule',
-  routerService: undefined,
-  httpService: undefined,
-  _addRoutes: (router, routeOverrides) => {
-    // add routes to router
-    getRoutes().forEach((route) => {
-      router.addRoute(applyRouteOverride(route, routeOverrides))
-    })
-  },
-  init: (services, routeOverrides) => {
-    if (services.httpService) {
-      UserModule.httpService = services.httpService
-    } else {
-      console.error(`Module ${UserModule.name} - missing httpService`)
-    }
-
-    if (services.routerService) {
-      UserModule.routerService = services.routerService
-      UserModule._addRoutes(services.routerService, routeOverrides)
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/user/routes.ts b/web-app/packages/lib-vue2/src/modules/user/routes.ts
deleted file mode 100644
index fe1b0f55..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/routes.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { RouteRecord } from 'vue-router'
-
-export default (): RouteRecord[] => []
diff --git a/web-app/packages/lib-vue2/src/modules/user/store.ts b/web-app/packages/lib-vue2/src/modules/user/store.ts
deleted file mode 100644
index 2107b6ca..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/store.ts
+++ /dev/null
@@ -1,586 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import isObject from 'lodash/isObject'
-import { defineStore, getActivePinia } from 'pinia'
-import Cookies from 'universal-cookie'
-// import { isNavigationFailure, NavigationFailureType } from 'vue-router'
-import Vue from 'vue'
-
-import { getErrorMessage } from '@/common/error_utils'
-import { waitCursor } from '@/common/html_utils'
-import { isAtLeastRole, UserRole } from '@/common/permission_utils'
-import { useDialogStore } from '@/modules/dialog/store'
-import { useFormStore } from '@/modules/form/store'
-import { useInstanceStore } from '@/modules/instance/store'
-import { useNotificationStore } from '@/modules/notification/store'
-import { useProjectStore } from '@/modules/project/store'
-import {
-  ResetPasswordPayload,
-  ChangePasswordWithTokenPayload,
-  ChangePasswordPayload,
-  IsWorkspaceAdminPayload,
-  LoginPayload,
-  UserDetailResponse,
-  WorkspaceIdPayload,
-  WorkspaceResponse,
-  SetWorkspaceIdPayload,
-  UserSearchParams
-} from '@/modules/user/types'
-import { UserApi } from '@/modules/user/userApi'
-
-export interface UserState {
-  loggedUser?: UserDetailResponse
-  workspaces: WorkspaceResponse[]
-  workspaceId: number
-}
-
-const cookies = new Cookies()
-const COOKIES_CURRENT_WORKSPACE = 'currentWorkspace'
-
-export const useUserStore = defineStore('userModule', {
-  state: (): UserState => ({
-    loggedUser: null,
-    workspaces: [],
-    workspaceId: undefined
-  }),
-
-  getters: {
-    isLoggedIn: (state) => {
-      const instanceStore = useInstanceStore()
-      return (
-        instanceStore.initData?.authenticated ||
-        state.loggedUser?.username != null
-      )
-    },
-    isSuperUser() {
-      const instanceStore = useInstanceStore()
-      return this.isLoggedIn && instanceStore.initData?.superuser
-    },
-    isGlobalWorkspaceAdmin() {
-      return isAtLeastRole(this.getPreferredWorkspace?.role, UserRole.admin)
-    },
-    getPreferredWorkspace: (state) => {
-      return (
-        state.loggedUser?.workspaces &&
-        state.loggedUser?.workspaces.find(
-          (workspace) => workspace.id === state.loggedUser.preferred_workspace
-        )
-      )
-    },
-    getUserFullName: (state) => {
-      return state.loggedUser?.name && state.loggedUser?.name !== ''
-        ? state.loggedUser.name
-        : state.loggedUser?.username
-        ? state.loggedUser.username
-        : ''
-    },
-    isWorkspaceAdmin() {
-      return (payload?: IsWorkspaceAdminPayload): boolean => {
-        const workspace = payload?.id
-          ? this.getWorkspaceById({ id: payload.id })
-          : this.currentWorkspace
-        return isAtLeastRole(workspace?.role, UserRole.admin)
-      }
-    },
-    isWorkspaceOwner() {
-      return (payload?: IsWorkspaceAdminPayload): boolean => {
-        const workspace = payload?.id
-          ? this.getWorkspaceById({ id: payload.id })
-          : this.currentWorkspace
-        return isAtLeastRole(workspace?.role, UserRole.owner)
-      }
-    },
-    currentWorkspace: (state) => {
-      return state.workspaces.find(
-        (workspace) => workspace.id === state.workspaceId
-      )
-    },
-    getWorkspaceById(state) {
-      return (payload: WorkspaceIdPayload) => {
-        return state.workspaces.find((workspace) => workspace.id === payload.id)
-      }
-    },
-    getWorkspaceByName(state) {
-      return (payload) => {
-        return state.workspaces.find(
-          (workspace) => workspace.name === payload.name
-        )
-      }
-    },
-    isWorkspaceUser: (state) => {
-      return (payload: WorkspaceIdPayload) => {
-        return state.workspaces.some((workspace) => workspace.id === payload.id)
-      }
-    }
-  },
-
-  actions: {
-    updateLoggedUser(payload) {
-      this.loggedUser = payload.loggedUser
-    },
-
-    updateVerifiedEmail(payload) {
-      Vue.set(this.loggedUser, 'verified_email', payload.verifiedEmail)
-    },
-
-    setWorkspaces(payload) {
-      this.workspaces = payload.workspaces
-    },
-
-    setWorkspaceId(payload) {
-      this.workspaceId = payload.id
-    },
-
-    async editUserProfile(payload) {
-      const dialogStore = useDialogStore()
-      const notificationStore = useNotificationStore()
-      const formStore = useFormStore()
-
-      waitCursor(true)
-      try {
-        await UserApi.editUserProfile(payload.editedUser, true)
-        dialogStore.close()
-        this.updateLoggedUser({
-          loggedUser: payload.editedUser
-        })
-        await this.fetchUserProfile()
-        await notificationStore.show({ text: 'Profile has been changed' })
-      } catch (error) {
-        await formStore.handleError({
-          componentId: payload.componentId,
-          error,
-          generalMessage: 'Failed to change profile'
-        })
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async fetchUserProfile() {
-      const projectStore = useProjectStore()
-      const notificationStore = useNotificationStore()
-
-      let resp
-      try {
-        resp = await UserApi.fetchUserProfile()
-        this.updateLoggedUser({ loggedUser: resp.data })
-        this.updateVerifiedEmail({
-          verifiedEmail: resp.data.verified_email
-        })
-        if (!projectStore.currentNamespace) {
-          // set current namespace only if not set
-          const preferredWorkspace = this.getPreferredWorkspace
-          if (preferredWorkspace?.name) {
-            projectStore.setCurrentNamespace({
-              currentNamespace: preferredWorkspace.name
-            })
-          }
-        }
-      } catch {
-        await notificationStore.error({
-          text: "Failed to fetch user's profile"
-        })
-      }
-      return resp?.data
-    },
-
-    async closeUserProfile() {
-      const notificationStore = useNotificationStore()
-
-      waitCursor(true)
-      try {
-        await UserApi.closeUserProfile(true)
-        this.updateLoggedUser({
-          loggedUser: null
-        })
-        // taken from logout action, router would return error because user is considered as logged in
-        location.href = '/'
-      } catch (err) {
-        await notificationStore.error({
-          text: getErrorMessage(err, 'Unable to close account')
-        })
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    async redirectAfterLogin(payload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        getActivePinia()
-          .router.push(payload.currentRoute.query.redirect)
-          // TODO: V3_UPGRADE - probably not needed anymore in vue-router v4 - check needed
-          .catch((e) => {
-            //   if (!isNavigationFailure(e, NavigationFailureType.redirected)) {
-            Promise.reject(e)
-            //   }
-          })
-      } catch (e) {
-        // TODO: V3_UPGRADE - probably not needed anymore in vue-router v4 - check needed
-        // if (isNavigationFailure(e, NavigationFailureType.redirected)) {
-        //   // expected redirect
-        //   //   https://router.vuejs.org/guide/advanced/navigation-failures.html#detecting-navigation-failures
-        // } else {
-        await notificationStore.error({
-          text: e
-        })
-        // }
-      }
-    },
-
-    async redirectFromLoginAfterLogin(payload) {
-      if (payload.currentRoute.path === '/login') {
-        getActivePinia()
-          .router.push({ path: '/' })
-          .catch((e) => {
-            // TODO: V3_UPGRADE - probably not needed anymore in vue-router v4 - check needed
-            // if (!isNavigationFailure(e, NavigationFailureType.redirected)) {
-            Promise.reject(e)
-            // }
-          })
-      }
-    },
-
-    async userLogin(payload: LoginPayload) {
-      const instanceStore = useInstanceStore()
-      const formStore = useFormStore()
-
-      try {
-        await UserApi.login(payload.data)
-        await instanceStore.initApp()
-      } catch (error) {
-        await formStore.handleError({
-          componentId: payload.componentId,
-          error,
-          generalMessage: 'Failed to login'
-        })
-      }
-    },
-
-    async resetPassword(payload: ResetPasswordPayload) {
-      const notificationStore = useNotificationStore()
-      const formStore = useFormStore()
-
-      try {
-        await UserApi.resetPassword({ email: payload.email })
-        await getActivePinia().router.push({ path: '/login' })
-        await notificationStore.show({
-          text: 'Email with password reset link was sent to your email address',
-          timeout: 3000
-        })
-      } catch (error) {
-        await formStore.handleError({
-          componentId: payload.componentId,
-          error,
-          generalMessage: 'Failed to send confirmation email'
-        })
-      }
-    },
-
-    async changePasswordWithToken(payload: ChangePasswordWithTokenPayload) {
-      const formStore = useFormStore()
-
-      waitCursor(true)
-      try {
-        await UserApi.changePasswordWithToken(payload.token, payload.data, true)
-        // callback - set => this.success = true
-        payload.callback(true)
-        waitCursor(false)
-      } catch (e) {
-        waitCursor(false)
-        // callback - set => this.success = false
-        payload.callback(false)
-        await formStore.handleError({
-          componentId: payload.componentId,
-          error: e,
-          generalMessage: 'Failed to change password'
-        })
-      }
-    },
-
-    async resendConfirmationEmail(payload) {
-      const notificationStore = useNotificationStore()
-
-      try {
-        await UserApi.resendEmail()
-        await notificationStore.show({
-          text: `Email was sent to address: ${payload.email}`
-        })
-      } catch (err) {
-        await notificationStore.error({
-          text: 'Failed to send confirmation email, please check your address in user profile settings'
-        })
-      }
-    },
-
-    async changePassword(payload: ChangePasswordPayload) {
-      const notificationStore = useNotificationStore()
-      const formStore = useFormStore()
-      const dialogStore = useDialogStore()
-
-      waitCursor(true)
-      try {
-        await UserApi.changePassword(payload.data, true)
-        dialogStore.close()
-        await notificationStore.show({ text: 'Password has been changed' })
-      } catch (error) {
-        await formStore.handleError({
-          componentId: payload.componentId,
-          error,
-          generalMessage: 'Failed to change password'
-        })
-      } finally {
-        waitCursor(false)
-      }
-    },
-
-    clearUserData() {
-      const projectStore = useProjectStore()
-
-      projectStore.clearProjects()
-      this.updateLoggedUser({ loggedUser: null })
-    },
-
-    async getWorkspace(payload) {
-      const notificationStore = useNotificationStore()
-
-      let newWorkspace
-      try {
-        const workspaceResponse = await UserApi.getWorkspaceById(payload.id)
-        newWorkspace = workspaceResponse.data
-        this.setWorkspaceId({ id: payload.id })
-        await this.updateWorkspacesWithWorkspaceChange({
-          workspace: newWorkspace
-        })
-      } catch (_err) {
-        await notificationStore.error({
-          text: 'Failed to load workspace'
-        })
-      }
-      return newWorkspace
-    },
-
-    async getWorkspaces() {
-      const notificationStore = useNotificationStore()
-
-      let workspacesResponse
-      try {
-        workspacesResponse = await UserApi.getWorkspaces()
-        this.setWorkspaces({ workspaces: workspacesResponse.data })
-      } catch (_err) {
-        await notificationStore.error({
-          text: 'Failed to load workspaces'
-        })
-      }
-      return workspacesResponse
-    },
-
-    async updateWorkspacesWithWorkspaceChange(payload) {
-      // update this.workspaces
-      if (this.workspaces) {
-        const idx = this.workspaces.findIndex(
-          (workspace) => workspace.id === payload.workspace.id
-        )
-        if (idx !== -1) {
-          this.setWorkspaces({
-            workspaces: [
-              ...this.workspaces.slice(0, idx),
-              payload.workspace,
-              ...this.workspaces.slice(idx + 1)
-            ]
-          })
-        }
-      }
-    },
-
-    async getPreferredWorkspaceId() {
-      let preferredWorkspaceId
-      try {
-        const userProfileResponse = await this.fetchUserProfile()
-        preferredWorkspaceId = userProfileResponse.preferred_workspace
-      } catch (err) {
-        console.warn('Failed to get preferred workspace id', err)
-      }
-      return preferredWorkspaceId
-    },
-
-    async setWorkspace(payload: SetWorkspaceIdPayload) {
-      const projectStore = useProjectStore()
-
-      if (this.workspaceId === payload.workspaceId) {
-        return
-      }
-      // 'setWorkspaceId' and 'projectModule/setCurrentNamespace' has to be called together synchronously.
-      // In case when there is some async call between their calls, the watchers can be updated incorrectly
-      this.setWorkspaceId({ id: payload.workspaceId })
-      if (this.currentWorkspace) {
-        projectStore.setCurrentNamespace({
-          currentNamespace: this.currentWorkspace.name
-        })
-      }
-      if (!payload.skipSavingInCookies) {
-        return await this.setUserWorkspaceToCookies({
-          id: payload.workspaceId
-        })
-      }
-    },
-
-    async getAllUserWorkspacesFromCookies() {
-      let value: Record<string, string>
-      try {
-        const cookieValue = cookies.get(COOKIES_CURRENT_WORKSPACE, {
-          doNotParse: true
-        })
-        if (cookieValue) {
-          const parsedValue = JSON.parse(cookieValue)
-          if (isObject(parsedValue)) {
-            value = parsedValue
-          } else {
-            console.warn(
-              `Stored cookies (${COOKIES_CURRENT_WORKSPACE}) value is not an object, removing it.`
-            )
-            // stored cookies value has deprecated format
-            cookies.remove(COOKIES_CURRENT_WORKSPACE)
-          }
-        }
-      } catch (e) {
-        console.warn(
-          `Stored cookies (${COOKIES_CURRENT_WORKSPACE}) value is malformed, removing it.`,
-          e
-        )
-        // stored cookies value is malformed, remove it
-        cookies.remove(COOKIES_CURRENT_WORKSPACE)
-      }
-      return value
-    },
-
-    async getUserWorkspaceFromCookies() {
-      let userWorkspaceId: string
-      if (this.loggedUser?.username) {
-        try {
-          const value = await this.getAllUserWorkspacesFromCookies()
-          if (value) {
-            userWorkspaceId = value[this.loggedUser?.username]
-          }
-        } catch {
-          // ignore
-        }
-      }
-      return userWorkspaceId
-    },
-
-    async removeUserWorkspaceFromCookies() {
-      const projectStore = useProjectStore()
-
-      if (this.loggedUser?.username) {
-        let value: Record<string, string>
-        try {
-          value = await this.getAllUserWorkspacesFromCookies()
-        } catch {
-          // ignore
-        }
-
-        if (value) {
-          delete value[this.loggedUser?.username]
-          const strValue = JSON.stringify(value)
-
-          const expires = new Date()
-          // cookies expire in one year
-          expires.setFullYear(expires.getFullYear() + 1)
-          cookies.set(COOKIES_CURRENT_WORKSPACE, strValue, {
-            expires
-          })
-        }
-      }
-      await projectStore.setCurrentNamespace({
-        currentNamespace: ''
-      })
-    },
-
-    async setUserWorkspaceToCookies(payload) {
-      if (this.loggedUser?.username) {
-        let oldValue: Record<string, string>
-        try {
-          oldValue = await this.getAllUserWorkspacesFromCookies()
-        } catch {
-          // ignore
-        }
-
-        const value = JSON.stringify({
-          ...oldValue,
-          [this.loggedUser?.username]: payload.id
-        })
-        const expires = new Date()
-        // cookies expire in one year
-        expires.setFullYear(expires.getFullYear() + 1)
-        cookies.set(COOKIES_CURRENT_WORKSPACE, value, {
-          expires
-        })
-      }
-    },
-
-    async setFirstWorkspace() {
-      if (this.workspaces.length > 0) {
-        await this.setWorkspace({
-          workspaceId: this.workspaces[0].id
-        })
-      }
-    },
-
-    async checkCurrentWorkspace() {
-      try {
-        await this.getWorkspaces()
-        const currentWorkspaceFromCookie =
-          await this.getUserWorkspaceFromCookies()
-        if (this.workspaces.length > 0) {
-          let foundWorkspace
-          let skipSavingInCookies = true
-          if (currentWorkspaceFromCookie !== undefined) {
-            // try to use workspace stored in cookies
-            foundWorkspace = this.getWorkspaceById({
-              id: parseInt(currentWorkspaceFromCookie)
-            })
-          }
-          if (!foundWorkspace) {
-            // try to use preferred_workspace from user profile response
-            const preferredWorkspaceId = await this.getPreferredWorkspaceId()
-            if (preferredWorkspaceId) {
-              foundWorkspace = this.getWorkspaceById({
-                id: preferredWorkspaceId
-              })
-              if (foundWorkspace?.id) {
-                // do not skip saving in cookies when using preferredWorkspace
-                skipSavingInCookies = false
-              }
-            }
-          }
-          // use id from found workspace, if not found fallback to first workspace from user workspaces
-          const currentWorkspaceIdToSet =
-            foundWorkspace?.id ?? this.workspaces[0].id
-          await this.setWorkspace({
-            workspaceId: currentWorkspaceIdToSet,
-            // do not save workspaceId to cookies as it could be:
-            // * already there, if was loaded from cookies
-            // * used the first user workspace as fallback, then it is not a user choice
-            skipSavingInCookies
-          })
-        } else {
-          await this.removeUserWorkspaceFromCookies()
-        }
-      } catch (e) {
-        console.warn('Loading of stored user workspace id has failed.', e)
-      }
-    },
-
-    async logout() {
-      await UserApi.logout()
-    },
-
-    async getAuthUserSearch(payload: UserSearchParams) {
-      return await UserApi.getAuthUserSearch(payload)
-    }
-  }
-})
diff --git a/web-app/packages/lib-vue2/src/modules/user/types.ts b/web-app/packages/lib-vue2/src/modules/user/types.ts
deleted file mode 100644
index e43722ee..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/types.ts
+++ /dev/null
@@ -1,146 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { Route } from 'vue-router'
-
-import { PaginatedRequestParams } from '@/common'
-import { UserRoleName } from '@/common/permission_utils'
-import { MerginComponentUuidPayload } from '@/modules/form/types'
-
-export interface LoginData {
-  login: string
-  password: string
-}
-
-export interface LoginPayload extends MerginComponentUuidPayload {
-  data: LoginData
-  currentRoute: Route
-}
-
-export interface ResetPasswordPayload extends MerginComponentUuidPayload {
-  email: string
-}
-
-export interface ResetPasswordData {
-  email: string
-}
-
-/* eslint-disable camelcase */
-export interface UserProfileResponse {
-  disk_usage: number
-  first_name: string
-  has_project: boolean
-  last_name: string
-  name: string
-  receive_notifications: boolean
-  registration_date: string
-  storage: number
-}
-
-export interface UserResponse {
-  active: boolean
-  email: string
-  id: number
-  is_admin: boolean
-  profile: UserProfileResponse
-  username: string
-  verified_email: boolean
-}
-
-export interface UserWorkspace {
-  id: number
-  name: string
-  role: UserRoleName
-}
-
-export interface UserDetailResponse extends UserProfileResponse {
-  id: number
-  username: string
-  email: string
-  verified_email: boolean
-  first_name: string
-  last_name: string
-  name: string
-  preferred_workspace: number
-  receive_notifications: boolean
-  registration_date: string
-  workspaces: UserWorkspace[]
-}
-
-export interface WorkspaceResponse extends UserWorkspace {
-  description: string
-  project_count: number
-  disk_usage: number
-  storage: number
-}
-
-export interface UserSearchParams {
-  id?: string
-  names?: string
-  like?: string
-  namespace: string
-}
-
-export interface UserSearch {
-  id: number
-  profile: {
-    first_name: string
-    last_name: string
-  }
-  username: string
-  email: string
-  permission?: string
-}
-
-export interface UserSearchInvite extends UserSearch {
-  isInvite: boolean
-}
-
-export interface ChangePasswordWithTokenParams {
-  password: string
-  confirm: string
-}
-
-export interface ChangePasswordWithTokenPayload
-  extends MerginComponentUuidPayload {
-  data: ChangePasswordWithTokenParams
-  token: string
-  callback: (value: boolean) => void
-}
-
-export interface EditUserProfileParams {
-  receive_notifications: boolean
-  first_name: string
-  last_name: string
-  email: string
-}
-
-export interface ChangePasswordParams {
-  old_password: string
-  password: string
-  confirm: string
-}
-
-export interface ChangePasswordPayload extends MerginComponentUuidPayload {
-  data: ChangePasswordParams
-}
-
-export interface PaginatedUsersParams extends PaginatedRequestParams {
-  like?: string
-}
-
-export interface WorkspaceIdPayload {
-  id: number
-}
-
-export interface IsWorkspaceAdminPayload {
-  id: number
-}
-
-export interface SetWorkspaceIdPayload {
-  workspaceId: number
-  skipSavingInCookies?: boolean
-}
-
-/* eslint-enable camelcase */
diff --git a/web-app/packages/lib-vue2/src/modules/user/userApi.ts b/web-app/packages/lib-vue2/src/modules/user/userApi.ts
deleted file mode 100644
index 1ecab091..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/userApi.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { AxiosResponse } from 'axios'
-
-import { getDefaultRetryOptions } from '@/common/http'
-import { UserModule } from '@/modules/user/module'
-import {
-  WorkspaceResponse,
-  ChangePasswordWithTokenParams,
-  LoginData,
-  UserResponse,
-  ResetPasswordData,
-  UserDetailResponse,
-  UserSearch,
-  UserSearchParams,
-  EditUserProfileParams,
-  ChangePasswordParams
-} from '@/modules/user/types'
-
-export const UserApi = {
-  getAuthUserSearch: (
-    params: UserSearchParams
-  ): Promise<AxiosResponse<UserSearch[]>> => {
-    return UserModule.httpService.get('/app/auth/user/search', { params })
-  },
-
-  editUserProfile: (
-    data: EditUserProfileParams,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.post('/app/auth/user/profile', data, {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  closeUserProfile: (withRetry?: boolean): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.delete('/v1/user', {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  changePasswordWithToken: (
-    token: string,
-    data: ChangePasswordWithTokenParams,
-    withRetry?: boolean
-  ): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.post(
-      `/app/auth/reset-password/${token}`,
-      data,
-      { ...(withRetry ? getDefaultRetryOptions() : {}) }
-    )
-  },
-
-  changePassword: (data: ChangePasswordParams, withRetry?: boolean) => {
-    return UserModule.httpService.post('/app/auth/change-password', data, {
-      ...(withRetry ? getDefaultRetryOptions() : {})
-    })
-  },
-
-  resetPassword: (data: ResetPasswordData): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.post('/app/auth/reset-password', data)
-  },
-
-  // TODO: deprecated?
-  confirmEmail: (token: string): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.post(`/app/auth/confirm-email/${token}`)
-  },
-
-  resendEmail: (): Promise<AxiosResponse<void>> => {
-    return UserModule.httpService.get('/app/auth/resend-confirm-email')
-  },
-
-  login: (data: LoginData): Promise<AxiosResponse<UserResponse>> =>
-    UserModule.httpService.post('/app/auth/login', data),
-
-  logout: (): Promise<AxiosResponse<void>> =>
-    UserModule.httpService.get('/app/auth/logout'),
-
-  fetchUserProfile: (): Promise<AxiosResponse<UserDetailResponse>> => {
-    return UserModule.httpService.get(`/v1/user/profile`)
-  },
-
-  async getWorkspaces(): Promise<AxiosResponse<WorkspaceResponse[]>> {
-    return UserModule.httpService.get(`/v1/workspaces`)
-  },
-
-  async getWorkspaceById(
-    id: number
-  ): Promise<AxiosResponse<WorkspaceResponse>> {
-    return UserModule.httpService.get(`/v1/workspace/${id}`)
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/modules/user/views/ChangePasswordView.vue b/web-app/packages/lib-vue2/src/modules/user/views/ChangePasswordView.vue
deleted file mode 100644
index c4f0b023..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/views/ChangePasswordView.vue
+++ /dev/null
@@ -1,186 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <custom-page>
-    <v-card
-      style="min-width: 300px"
-      class="text-center"
-      v-on:="changePasswordWithToken"
-    >
-      <v-card-title class="justify-center primary--text font-weight-bold ml-3">
-        <h3>Change password</h3>
-      </v-card-title>
-      <v-card-text>
-        <v-form @submit.prevent v-if="!success" class="layout column">
-          <v-text-field
-            label="New Password"
-            name="password"
-            color="inputColor"
-            v-model="password"
-            data-cy="change-password"
-            :append-icon="passwordVisible ? 'visibility_off' : 'visibility'"
-            @click:append="passwordVisible = !passwordVisible"
-            :type="passwordVisible ? 'text' : 'password'"
-            :error-messages="errors.password"
-            v-on="on"
-          >
-            <template v-slot:append-outer>
-              <v-tooltip
-                top
-                color="orange"
-                max-width="350"
-                content-class="form-tooltip"
-              >
-                <template v-slot:activator="{ on }">
-                  <v-icon v-on="on" class="ml-1 mb-1">info</v-icon>
-                </template>
-                <ul>
-                  <li>Password must be at least 8 characters long.</li>
-                  <li>
-                    Password must contain at least 3 character categories among
-                    the following:
-                    <ul>
-                      <li>Lowercase characters (a-z)</li>
-                      <li>Uppercase characters (A-Z)</li>
-                      <li>Digits (0-9)</li>
-                      <li>Special characters</li>
-                    </ul>
-                  </li>
-                </ul>
-              </v-tooltip>
-            </template>
-          </v-text-field>
-          <v-text-field
-            label="Confirm New Password"
-            name="confirm"
-            color="inputColor"
-            v-model="confirm"
-            data-cy="change-password-confirm"
-            :type="passwordVisible ? 'text' : 'password'"
-            :error-messages="errors.confirm"
-            @keyup.enter="changePasswordWithToken"
-          />
-
-          <v-card-actions class="justify-center">
-            <v-btn
-              class="primary text--white"
-              data-cy="change-password-btn"
-              :disabled="!password || !confirm"
-              @click="changePasswordWithToken"
-            >
-              Change
-            </v-btn>
-          </v-card-actions>
-        </v-form>
-        <div v-else>
-          <p>Your password was changed. You can now Sign In</p>
-          <v-btn
-            class="align-self-center orange white--text"
-            data-cy="change-password-btn-signin"
-            href="/login"
-            >Sign in
-          </v-btn>
-        </div>
-        <br />
-      </v-card-text>
-    </v-card>
-  </custom-page>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-import { defineComponent } from 'vue'
-
-import CustomPage from '@/common/components/CustomPage.vue'
-import { useFormStore } from '@/modules/form/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'ChangePasswordView',
-  components: { CustomPage },
-  data() {
-    return {
-      on: '',
-      success: false,
-      password: '',
-      confirm: '',
-      passwordVisible: false
-    }
-  },
-  computed: {
-    ...mapState(useFormStore, ['getErrorByComponentId']),
-    errors() {
-      return this.getErrorByComponentId(this.merginComponentUuid) ?? {}
-    },
-    token() {
-      return this.$route.params.token
-    }
-  },
-
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-
-  methods: {
-    ...mapActions(useUserStore, {
-      changePasswordWithTokenAction: 'changePasswordWithToken'
-    }),
-    ...mapActions(useFormStore, ['clearErrors', 'handleError']),
-    responseCallback(value) {
-      this.success = value
-    },
-    changePasswordWithToken() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      const data = {
-        password: this.password,
-        confirm: this.confirm
-      }
-
-      this.changePasswordWithTokenAction({
-        data,
-        token: this.token,
-        callback: this.responseCallback,
-        componentId: this.merginComponentUuid
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-.main-window {
-  position: fixed;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-
-  display: flex;
-  flex-direction: column;
-  z-index: 100;
-  overflow: auto;
-
-  .bg {
-    position: absolute;
-    left: 0;
-    top: 0;
-    height: 100%;
-    width: 100%;
-    object-fit: cover;
-  }
-
-  .container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 0 0 auto;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/views/LoginViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/user/views/LoginViewTemplate.vue
deleted file mode 100644
index 660fc612..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/views/LoginViewTemplate.vue
+++ /dev/null
@@ -1,270 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <custom-page class="login-window">
-    <v-card>
-      <mergin-logo-light @click="navigateHome" />
-      <v-card-text>
-        <v-form @submit.prevent class="login-form">
-          <template v-if="forgotPassword">
-            <v-text-field
-              placeholder="Email"
-              name="email"
-              color="inputColor"
-              data-cy="reset-form-email"
-              v-model="email"
-              :error-messages="errors.email"
-              @keyup.enter="reset"
-            />
-            <v-btn
-              :dark="email !== ''"
-              color="secondary"
-              data-cy="reset-form-btn"
-              :disabled="!email"
-              @click="reset"
-            >
-              Reset Password
-            </v-btn>
-          </template>
-          <template v-else>
-            <v-text-field
-              placeholder="Username or email"
-              data-cy="login-form-login"
-              name="login"
-              color="inputColor"
-              v-model="login"
-              :error-messages="errors.login"
-              @keyup.enter="loginUser"
-            />
-            <v-text-field
-              placeholder="Password"
-              data-cy="login-form-password"
-              name="password"
-              color="inputColor"
-              v-model="password"
-              :append-icon="passwordVisible ? 'visibility_off' : 'visibility'"
-              @click:append="passwordVisible = !passwordVisible"
-              :type="passwordVisible ? 'text' : 'password'"
-              :error-messages="errors.password"
-              @keyup.enter="loginUser"
-            />
-            <v-btn
-              :dark="Boolean(login && password)"
-              :disabled="!login || !password"
-              data-cy="login-form-btn-login"
-              color="secondary"
-              class="mx-0 mt-3"
-              id="login-btn"
-              @click="loginUser"
-            >
-              Sign In
-            </v-btn>
-          </template>
-        </v-form>
-        <div class="d-flex justify-space-between">
-          <v-btn
-            v-if="!forgotPassword"
-            text
-            small
-            data-cy="login-form-btn-reset"
-            color="primary"
-            class="reset"
-            :to="{ name: 'login', params: { reset: 'reset' } }"
-            >Forgot password?
-          </v-btn>
-          <slot name="additionalButtons"></slot>
-        </div>
-      </v-card-text>
-    </v-card>
-  </custom-page>
-</template>
-
-<script lang="ts">
-import { mapActions, mapState } from 'pinia'
-
-import CustomPage from '@/common/components/CustomPage.vue'
-import MerginLogoLight from '@/common/components/MerginLogoLight.vue'
-import { useFormStore } from '@/modules/form/store'
-import { useUserStore } from '@/modules/user/store'
-
-export default {
-  name: 'LoginViewTemplate',
-  components: { MerginLogoLight, CustomPage },
-  props: {
-    presetLogin: {
-      type: String,
-      default: null
-    }
-  },
-  data() {
-    return {
-      valid: true,
-      login: this.presetLogin ?? '',
-      password: '',
-      email: '',
-      passwordVisible: false
-    }
-  },
-  created() {
-    if (this.presetLogin) {
-      this.login = this.presetLogin
-    }
-    this.updateLoggedUser({ loggedUser: null }) // clear current user to prevent commit to store (and thus reload)
-  },
-  computed: {
-    ...mapState(useUserStore, ['loggedUser']),
-    ...mapState(useFormStore, ['getErrorByComponentId']),
-    errors() {
-      return this.getErrorByComponentId(this.merginComponentUuid) ?? {}
-    },
-    forgotPassword() {
-      return this.$route.params.reset === 'reset'
-    }
-  },
-  beforeDestroy() {
-    this.clearErrors({
-      componentId: this.merginComponentUuid,
-      keepNotification: true
-    })
-  },
-  methods: {
-    ...mapActions(useFormStore, ['clearErrors']),
-    ...mapActions(useUserStore, [
-      'updateLoggedUser',
-      'userLogin',
-      'resetPassword'
-    ]),
-    loginUser() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      const data = {
-        login: this.login.trim(),
-        password: this.password.trim()
-      }
-      this.$emit('userLogin', {
-        data,
-        currentRoute: this.$route,
-        componentId: this.merginComponentUuid
-      })
-    },
-    reset() {
-      this.clearErrors({ componentId: this.merginComponentUuid })
-      this.resetPassword({
-        email: this.email,
-        componentId: this.merginComponentUuid
-      })
-    },
-    navigateHome() {
-      this.$router.push('/')
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.login-window {
-  position: fixed;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-
-  display: flex;
-  flex-direction: column;
-  z-index: 100;
-  overflow: auto;
-
-  .bg {
-    position: absolute;
-    left: 0;
-    top: 0;
-    height: 100%;
-    width: 100%;
-    object-fit: cover;
-  }
-
-  .container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 0 0 auto;
-  }
-
-  ::v-deep(.v-card) {
-    min-width: 300px;
-    max-width: 400px;
-    flex: 1;
-
-    .v-responsive__content {
-      display: flex;
-      flex-direction: row;
-      justify-content: center;
-      margin-left: 5px;
-      cursor: pointer;
-
-      img {
-        height: 4em;
-        width: auto;
-      }
-    }
-
-    .v-card__text {
-      display: flex;
-      flex-direction: column;
-    }
-
-    form {
-      display: flex;
-      flex-direction: column;
-
-      input {
-        padding-left: 0.25em;
-      }
-
-      .input-group label:after {
-        /* Remove asterisk from required fields */
-        display: none;
-      }
-
-      .v-input__append-inner {
-        .v-icon {
-          color: #ccc !important;
-        }
-      }
-    }
-
-    .version {
-      margin: 1em 0 0.5em 0;
-      text-align: center;
-      opacity: 0.6;
-      font-size: 90%;
-    }
-  }
-
-  .copyright {
-    position: absolute;
-    right: -1em;
-    bottom: 0.25em;
-    padding: 0 2em 0 2em;
-    color: #fff;
-    text-shadow: 1px 1px 3px #333;
-    opacity: 0.7;
-    user-select: none;
-
-    b {
-      font-weight: 500;
-    }
-  }
-
-  ::v-deep(.v-btn) {
-    text-transform: none;
-
-    &.reset {
-      align-self: center;
-    }
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/views/ProfileViewTemplate.vue b/web-app/packages/lib-vue2/src/modules/user/views/ProfileViewTemplate.vue
deleted file mode 100644
index 01f1b7cc..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/views/ProfileViewTemplate.vue
+++ /dev/null
@@ -1,348 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <page-view
-    :style="`padding-left: ${
-      drawer ? 260 : 20
-    }px; overflow-y: auto; padding-right:20px; margin-right: 0px;`"
-  >
-    <v-layout class="column main-content fill-height">
-      <v-container>
-        <slot name="additionalBeforeContent"></slot>
-        <v-row>
-          <v-col cols="12" class="pa-0">
-            <v-card
-              v-if="!loggedUser?.verified_email"
-              outlined
-              class="bubble mt-3"
-              style="
-                background-color: #ffc863;
-                color: rgba(0, 0, 0, 0.87);
-                overflow: hidden;
-              "
-            >
-              Your email hasn't been confirmed yet
-              <v-btn
-                color="#ecf3ff"
-                @click="resendConfirmationEmail"
-                style="float: right"
-                >Send confirmation email
-              </v-btn>
-            </v-card>
-          </v-col>
-        </v-row>
-        <v-row>
-          <v-col cols="12" class="pa-0">
-            <v-card flat>
-              <v-card-text>
-                <div class="profile">
-                  <h1 class="primary--text">Profile</h1>
-                  <br />
-                  <v-divider />
-                  <v-layout align-center>
-                    <v-row>
-                      <v-col>
-                        <!-- Render profile -->
-                        <div class="section" data-cy="profile-info">
-                          <ul v-if="loggedUser">
-                            <li data-cy="profile-username">
-                              <b> Username: </b>{{ loggedUser.username }}
-                            </li>
-                            <li data-cy="profile-name">
-                              <b> Name: </b>{{ loggedUser.name }}
-                            </li>
-                            <li data-cy="profile-email">
-                              <b> Email: </b>{{ loggedUser.email }}
-                              <v-tooltip
-                                top
-                                v-if="
-                                  'project-versions' !== $route.name &&
-                                  'project-versions-detail' !== $route.name
-                                "
-                              >
-                                <template v-slot:activator="{ on }">
-                                  <span v-on="on">
-                                    <v-icon
-                                      v-if="loggedUser.verified_email"
-                                      color="green"
-                                      >check</v-icon
-                                    >
-                                    <v-icon v-else color="red">clear</v-icon>
-                                  </span>
-                                </template>
-                                <span>Email verification status</span>
-                              </v-tooltip>
-                            </li>
-                            <li data-cy="profile-notification">
-                              <b> Receive notifications: </b>
-                              <v-icon
-                                v-if="loggedUser.receive_notifications"
-                                color="green"
-                                >check</v-icon
-                              >
-                              <v-icon v-else color="red">clear</v-icon>
-                            </li>
-                            <li data-cy="profile-registered">
-                              <b> Registered: </b
-                              >{{ loggedUser.registration_date | date }}
-                            </li>
-                          </ul>
-                          <br />
-                        </div>
-                        <v-spacer />
-                      </v-col>
-                      <!-- actions -->
-                      <v-col>
-                        <div>
-                          <div>
-                            <v-btn
-                              @click="changePasswordDialog"
-                              class="primary--text"
-                              data-cy="profile-change-password-btn"
-                            >
-                              <v-icon small class="mr-2">lock</v-icon>
-                              Change password
-                            </v-btn>
-                          </div>
-                          <div>
-                            <v-btn
-                              @click="editProfileDialog"
-                              class="primary--text"
-                              data-cy="profile-edit-btn"
-                            >
-                              <v-icon small class="mr-2">edit</v-icon>
-                              Edit profile
-                            </v-btn>
-                          </div>
-                          <div>
-                            <v-btn
-                              @click="showConfirmationDialog"
-                              class="primary--text"
-                              :disabled="loggedUser?.verified_profile"
-                              data-cy="profile-verify-email-btn"
-                            >
-                              <v-icon small class="mr-2">send</v-icon>
-                              Verify email
-                            </v-btn>
-                          </div>
-                          <div>
-                            <v-btn
-                              @click="confirmDeleteUser"
-                              class="white--text"
-                              depressed
-                              color="red"
-                              data-cy="profile-close-account-btn"
-                            >
-                              <v-icon small class="mr-2">remove_circle</v-icon>
-                              Close my account
-                            </v-btn>
-                          </div>
-                        </div>
-                      </v-col>
-                    </v-row>
-                  </v-layout>
-                </div>
-                <v-divider />
-              </v-card-text>
-              <slot name="additionalContent"></slot>
-            </v-card>
-          </v-col>
-        </v-row>
-      </v-container>
-    </v-layout>
-  </page-view>
-</template>
-
-<script lang="ts">
-import { mapState, mapActions } from 'pinia'
-import { defineComponent } from 'vue'
-
-import { ConfirmDialog, useDialogStore } from '@/modules'
-import PageView from '@/modules/layout/components/PageView.vue'
-import { useLayoutStore } from '@/modules/layout/store'
-import ChangePasswordForm from '@/modules/user/components/ChangePasswordForm.vue'
-import EditProfileForm from '@/modules/user/components/EditProfileForm.vue'
-import { useUserStore } from '@/modules/user/store'
-
-export default defineComponent({
-  name: 'ProfileViewTemplate',
-  props: {
-    name: String
-  },
-  components: { PageView },
-  data() {
-    return {
-      dialog: false
-    }
-  },
-  computed: {
-    ...mapState(useLayoutStore, ['drawer']),
-    ...mapState(useUserStore, ['loggedUser']),
-    usage() {
-      return this.loggedUser?.disk_usage / this.loggedUser?.storage
-    }
-  },
-  created() {
-    this.fetchUserProfile()
-  },
-  watch: {
-    name: function () {
-      this.fetchUserProfile()
-    }
-  },
-  methods: {
-    ...mapActions(useDialogStore, ['show']),
-    ...mapActions(useUserStore, {
-      fetchUserProfile: 'fetchUserProfile',
-      resendConfirmationEmailToUser: 'resendConfirmationEmail',
-      closeUserProfile: 'closeUserProfile'
-    }),
-
-    resendConfirmationEmail() {
-      this.resendConfirmationEmailToUser({ email: this.loggedUser?.email })
-    },
-    showConfirmationDialog(_email) {
-      const props = {
-        text: 'Do you want send confirmation email?',
-        confirmText: 'Send email'
-      }
-      const listeners = {
-        confirm: () => this.resendConfirmationEmail()
-      }
-      this.show({
-        component: ConfirmDialog,
-        params: {
-          props,
-          listeners,
-          dialog: { maxWidth: 500, persistent: true }
-        }
-      })
-    },
-    confirmDeleteUser() {
-      const props = {
-        text: 'Are you sure to close your account? <br>  <br> Type in username to confirm:',
-        confirmText: 'Submit',
-        confirmField: {
-          label: 'Username',
-          expected: this.loggedUser?.username
-        }
-      }
-      const listeners = {
-        confirm: async () => await this.closeUserProfile()
-      }
-      this.show({
-        component: ConfirmDialog,
-        params: {
-          props,
-          listeners,
-          dialog: { maxWidth: 500 }
-        }
-      })
-    },
-    changePasswordDialog() {
-      const props = {}
-      const dialog = { maxWidth: 500, persistent: true }
-      this.show({
-        component: ChangePasswordForm,
-        params: {
-          props,
-          dialog
-        }
-      })
-    },
-    editProfileDialog() {
-      const props = { profile: this.loggedUser }
-      const dialog = { maxWidth: 500, persistent: true }
-      this.show({
-        component: EditProfileForm,
-        params: {
-          props,
-          dialog
-        }
-      })
-    }
-  }
-})
-</script>
-
-<style lang="scss" scoped>
-@use '@/sass/dashboard';
-
-.bubble {
-  width: 100%;
-}
-
-.main-content {
-  overflow: unset;
-}
-
-.col-5 {
-  max-width: 100%;
-}
-
-.profile {
-  margin-bottom: 20px;
-
-  h2 {
-    color: #2d4470;
-    margin-bottom: 10px;
-  }
-
-  button {
-    padding-left: 10px;
-    height: 35px;
-    padding-right: 10px;
-    float: right;
-    @media (max-width: 770px) {
-      width: 100%;
-    }
-    @media (min-width: 771px) {
-      width: 60%;
-    }
-  }
-
-  .align-center {
-    padding-top: 10px;
-    padding-bottom: 10px;
-    align-items: flex-start;
-    padding-right: 10px;
-  }
-
-  .section {
-    margin-right: 10px;
-
-    ul {
-      padding-left: 0;
-    }
-
-    li {
-      list-style: none;
-
-      b {
-        width: 150px;
-        display: inline-block;
-      }
-    }
-
-    .v-icon {
-      font-size: 18px;
-    }
-  }
-}
-
-@media (max-width: 480px) {
-  .action-button {
-    width: 135px;
-  }
-}
-
-.action-button {
-  div {
-    display: inline-block;
-  }
-}
-</style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/views/VerifyEmailView.vue b/web-app/packages/lib-vue2/src/modules/user/views/VerifyEmailView.vue
deleted file mode 100644
index eb3e566f..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/views/VerifyEmailView.vue
+++ /dev/null
@@ -1,59 +0,0 @@
-<!--
-Copyright (C) Lutra Consulting Limited
-
-SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
--->
-
-<template>
-  <custom-page>
-    <v-card style="min-width: 300px" class="text-center">
-      <v-card-title class="justify-center primary--text font-weight-bold ml-3">
-        <h3>Email confirmation</h3>
-      </v-card-title>
-      <v-card-text>
-        <p v-if="verified">Your email address has been verified.</p>
-        <p v-else class="error--text">Invalid token</p>
-        <br />
-        <v-btn
-          data-cy="verify-email-btn"
-          class="align-self-center orange white--text"
-          href="/"
-          >Continue
-        </v-btn>
-      </v-card-text>
-    </v-card>
-  </custom-page>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-import CustomPage from '@/common/components/CustomPage.vue'
-import { UserApi } from '@/modules/user/userApi'
-
-// TODO: deprecated?
-export default defineComponent({
-  name: 'VerifyEmailView',
-  components: { CustomPage },
-  data() {
-    return {
-      verified: false
-    }
-  },
-  computed: {
-    token() {
-      return this.$route.params.token
-    }
-  },
-  async created() {
-    try {
-      await UserApi.confirmEmail(this.token)
-      this.verified = true
-    } catch (e) {
-      this.verified = false
-    }
-  }
-})
-</script>
-
-<style scoped></style>
diff --git a/web-app/packages/lib-vue2/src/modules/user/views/index.ts b/web-app/packages/lib-vue2/src/modules/user/views/index.ts
deleted file mode 100644
index 44df67bf..00000000
--- a/web-app/packages/lib-vue2/src/modules/user/views/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-export { default as ChangePasswordView } from './ChangePasswordView.vue'
-export { default as LoginViewTemplate } from './LoginViewTemplate.vue'
-export { default as ProfileViewTemplate } from './ProfileViewTemplate.vue'
-export { default as VerifyEmailView } from './VerifyEmailView.vue'
diff --git a/web-app/packages/lib-vue2/src/sass/dashboard.scss b/web-app/packages/lib-vue2/src/sass/dashboard.scss
deleted file mode 100644
index 24fe71a3..00000000
--- a/web-app/packages/lib-vue2/src/sass/dashboard.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-/*
- * Copyright (C) Lutra Consulting Limited
- *
- * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
- */
-
-.theme--light.v-card.bubble {
-  width: 800px;
-  background-color: #eaebef;
-  padding: 20px 25px 15px 15px;
-}
diff --git a/web-app/packages/lib-vue2/src/sass/overrides.sass b/web-app/packages/lib-vue2/src/sass/overrides.sass
deleted file mode 100644
index b81a50fa..00000000
--- a/web-app/packages/lib-vue2/src/sass/overrides.sass
+++ /dev/null
@@ -1,49 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-// Creative Tim refine style code
-@import ./vuetify-material/sidebar
-@import ./vuetify-material/appbar
-@import ./vuetify-material/buttons
-@import ./vuetify-material/pagination
-@import ./vuetify-material/footer
-@import ./vuetify-material/view
-@import ./vuetify-material/settings
-@import ./vuetify-material/card
-@import ./vuetify-material/table
-@import ./vuetify-material/tab
-@import ./vuetify-material/notification
-@import ./vuetify-material/modal
-@import ./vuetify-material/map
-@import ./vuetify-material/chip
-@import 'variables'
-
-
-//.v-btn.v-size--default,
-//.v-btn.v-size--large
-//  &:not(.v-btn--icon):not(.v-btn--fab)
-//    padding: 0 30px !important
-
-.theme--light.v-list-item .v-list-item__action-text,
-.theme--light.v-list-item .v-list-item__subtitle
-  color: #999
-
-.theme--light.v-text-field > .v-input__control > .v-input__slot:before
-  border-color: #d2d2d2
-
-.v-label.v-label,
-.v-alert.v-alert
-  font-size: $font-size-root
-
-.theme--light .v-main
-  background-color: #eee
diff --git a/web-app/packages/lib-vue2/src/sass/project.scss b/web-app/packages/lib-vue2/src/sass/project.scss
deleted file mode 100644
index 7b804b60..00000000
--- a/web-app/packages/lib-vue2/src/sass/project.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-/*
- * Copyright (C) Lutra Consulting Limited
- *
- * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
- */
-
-.private-public-btn {
-  font-size: 12px;
-  padding-left: 20px;
-  padding-right: 20px;
-  background-color: #f3f5f7;
-  color: #2d4470;
-  text-transform: none;
-  min-width: 116px !important;
-  float: right;
-  border-color: #e0e0e0;
-
-  span {
-    font-weight: 700;
-  }
-}
-
-.private-public-text {
-  font-size: 14px;
-  color: black;
-}
-
-.description-text {
-  color: #757575;
-}
diff --git a/web-app/packages/lib-vue2/src/sass/variables.scss b/web-app/packages/lib-vue2/src/sass/variables.scss
deleted file mode 100644
index cf4259ea..00000000
--- a/web-app/packages/lib-vue2/src/sass/variables.scss
+++ /dev/null
@@ -1,40 +0,0 @@
-/*
- * Copyright (C) Lutra Consulting Limited
- *
- * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
- */
-
-$font-size-root: 12px;
-$sheet-border-radius: 4px;
-$list-item-title-font-size: 0.929rem;
-$list-item-dense-title-font-size: 0.929rem;
-$list-item-dense-title-font-weight: initial;
-$fab-icon-sizes: (small: 20);
-$btn-font-sizes: (default: 1rem, large: 1rem);
-$btn-sizes: (default: 41, large: 54);
-$btn-letter-spacing: 0;
-$btn-font-weight: 400;
-$card-text-font-size: 12px;
-
-$headings: (
-  //'h1': (
-  //  'size': 3.3125rem,
-  //  'line-height': 1.15em
-  //),
-  //'h2': (
-  //  'size': 2.25rem,
-  //  'line-height': 1.5em
-  //),
-  //'h3': (
-  //  'size': 1.5625rem,
-  //  'line-height': 1.4em
-  //),
-  //'h4': (
-  //  'size': 1.125rem,
-  //  'line-height': 1.4em
-  //),
-  //'h5': ( 'size': 1.0625rem ),
-  //'h6': ( 'size': .75rem ),
-        'text-subtitle-2': ('size': 1rem),
-        'text-overline': ('letter-spacing': 0)
-);
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_appbar.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_appbar.sass
deleted file mode 100644
index 9d233db5..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_appbar.sass
+++ /dev/null
@@ -1,71 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-#app-bar
-  .v-badge__badge
-    font-size: 9px
-    padding: 5px 6px
-
-// -----------------------
-.v-toolbar__content,
-.v-toolbar__extension
-  padding: 0px 15px 0 31px
-
-.v-sheet
-  .v-toolbar__content
-    .v-btn.v-size--default:not(.v-btn--icon):not(.v-btn--fab),
-    .v-btn.v-size--large:not(.v-btn--icon):not(.v-btn--fab)
-      margin-bottom: 5px
-      padding: 10px 15px !important
-
-    .theme--light.v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined)
-      background-color: #fff
-
-      .v-icon
-        color: #999
-
-.theme--light.v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined)
-  background-color: #fff
-  margin-right: 17px
-  margin-bottom: 2px
-
-.theme--light.v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined):hover
-  background-color: #fff
-
-.v-toolbar__content
-  height: 75px
-
-.v-toolbar__content .v-btn--flat
-  .v-icon
-    margin-right: 3px
-
-.theme--light.v-label
-  color: rgba(0, 0, 0, 0.3)
-
-.v-menu__content .v-list--nav
-  padding: .3125rem 0
-  border-radius: 4px
-
-  .v-list-item
-    padding: 10px 20px
-    margin: 0 .3125rem
-    margin-bottom: 0px !important
-    min-height: 40px
-    border-radius: 2px
-
-    .v-list-item__title
-      font-weight: 400
-      font-size: 13px
-
-.v-navigation-drawer .v-icon.v-icon
-  font-size: 24px
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_buttons.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_buttons.sass
deleted file mode 100644
index aad1efe2..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_buttons.sass
+++ /dev/null
@@ -1,85 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-btn.v-size--default
-  font-size: .85rem
-
-.v-icon.v-icon
-  font-size: 20px
-
-.v-btn__content .v-icon--left
-  margin-right: 4px
-
-.v-sheet button.v-btn.v-size--default:not(.v-btn--icon):not(.v-btn--fab)
-  padding: 12px 30px !important
-
-.theme--light.v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined)
-  background-color: #999
-
-  &:hover
-    background-color: #999000
-
-.v-btn.white
-  .v-btn__content
-    color: #999
-
-.v-sheet .v-btn.v-size--large:not(.v-btn--icon):not(.v-btn--fab)
-  padding: 18px 36px !important
-
-.v-btn--fab.v-size--small
-  height: 41px
-  width: 41px
-
-.v-btn:not(.v-btn--text):not(.v-btn--outlined):hover:before
-  opacity: 0
-
-.v-btn:not(.v-btn--text):not(.v-btn--outlined):focus:before
-  opacity: 0
-
-.v-btn.v-size--default:not(.v-btn--icon):not(.v-btn--fab),
-.v-btn.v-size--large:not(.v-btn--icon):not(.v-btn--fab)
-  padding: 10px 15px !important
-
-// Button group
-
-.v-item-group
-  .v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined)
-    margin-right: 0
-
-.v-btn-toggle
-  .v-btn
-    opacity: 1
-
-.v-btn-toggle > .v-btn.v-size--default
-  height: inherit
-
-.theme--light.v-btn-toggle .v-btn.v-btn
-  border-color: #999 !important
-
-  &.primary
-    border-color: #e91e63 !important
-
-  &.secondary
-    border-color: #9c27b0 !important
-
-  &.success
-    border-color: #4caf50 !important
-
-  &.warning
-    border-color: #fb8c00 !important
-
-  &.error
-    border-color: #ff5252 !important
-
-  &.info
-    border-color: #00cae3 !important
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_card.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_card.sass
deleted file mode 100644
index 250477cf..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_card.sass
+++ /dev/null
@@ -1,128 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-card
-  border-radius: 6px
-  margin-top: 30px
-  margin-bottom: 15px
-
-  .card-title
-    font-size: 18px
-
-  .v-card--material__heading
-    top: -30px
-
-    .text-subtitle-1
-      color: hsla(0, 0%, 100%, .8)
-
-    .text-h3
-      font-size: 18px !important
-
-  .text-caption
-    font-size: 12px !important
-    letter-spacing: 0 !important
-
-  .v-card__actions
-    padding-top: 15px
-
-    .text-h3
-      font-size: 18px !important
-
-  .v-divider
-    border-color: #eee
-
-  .ct-label
-    font-size: 14px
-
-.v-card--material-chart .v-card--material__heading .ct-label
-  font-weight: 300
-
-
-.v-btn--icon.v-size--default .v-icon,
-.v-btn--fab.v-size--default .v-icon
-  font-size: 18px
-
-.v-card--material .v-image
-  .v-image__image
-    border-radius: 6px
-
-.v-card__title
-  font-size: 18px
-  padding-top: 7px
-  padding-bottom: 2px
-
-.theme--light
-  .v-card > .v-card__text
-    color: #333
-
-  .card-title
-    color: #3c4858
-
-.theme--dark
-  .card-title
-    color: #fff
-
-
-.v-timeline-item .v-card
-  margin-top: 0
-
-.v-card--wizard
-  .v-tabs-bar
-    height: 42px
-
-  .v-card__actions
-    .v-btn
-      margin-right: 0 !important
-
-  .v-tabs .v-tab--active:hover::before, .theme--light.v-tabs .v-tab--active::before
-    opacity: 0
-
-  .v-tabs .v-tab:hover::before
-    opacity: 0
-
-.v-card--plan
-  .text-body-2
-    font-weight: 500
-    letter-spacing: 0 !important
-    margin-top: 10px
-    margin-bottom: 8px
-
-  .text-h3
-    margin-top: 30px
-
-  .v-card__text
-    color: #999
-    margin-bottom: 16px
-
-  .v-btn
-    margin-right: 0 !important
-
-  .v-avatar
-    margin-top: 10px
-
-.v-card--testimony
-  .v-card__text
-    color: #999 !important
-
-  .text-h3
-    font-size: 18px !important
-
-  .text-body-2
-    font-weight: 500
-    font-size: 12px !important
-
-  .v-avatar
-    left: calc(50% - 50px)
-
-.ct-square:before
-  float: none
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_chip.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_chip.sass
deleted file mode 100644
index f67e0e6c..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_chip.sass
+++ /dev/null
@@ -1,23 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-chip.v-size--small
-  height: 20px
-
-.v-chip__content
-  font-size: 10px
-  font-weight: 500
-
-  .v-chip__close
-    font-size: 15px
-    margin-top: -1px
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_footer.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_footer.sass
deleted file mode 100644
index 836bef26..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_footer.sass
+++ /dev/null
@@ -1,48 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-footer
-  padding: 20px 0 20px 4px
-  border-top: 1px solid #e7e7e7 !important
-  position: relative
-
-  a
-    padding: 15px 18px 15px 16px
-    font-size: 12px !important
-
-  .text-body-1
-    font-size: 16px !important
-    padding-right: 18px
-    letter-spacing: 0px !important
-
-    a
-      color: #9c27b0 !important
-      padding: 0
-      text-transform: inherit !important
-      font-size: 16px !important
-      font-weight: 300 !important
-
-  .v-icon
-    margin-top: -3px
-
-  &.v-footer--absolute
-    position: absolute !important
-
-.theme--light.v-footer
-  background-color: transparent
-
-  .text-body-1
-    color: #3c4858
-
-  .v-icon
-    color: #3c4858
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_map.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_map.sass
deleted file mode 100644
index 5f8177ef..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_map.sass
+++ /dev/null
@@ -1,16 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.mapouter
-  position: relative !important
-  height: 100vh !important
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_modal.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_modal.sass
deleted file mode 100644
index b6917f18..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_modal.sass
+++ /dev/null
@@ -1,41 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-dialog
-  .v-card
-    margin: 0
-
-    .v-card__title
-      font-weight: 300
-      font-size: 18px
-      display: inline-block
-      text-align: center
-      width: 100%
-      padding: 24px 24px 0
-
-      .v-icon
-        position: absolute
-        top: 15px
-        right: 20px
-        color: #999
-        opacity: .5
-        font-size: 16px
-
-        &:hover
-          opacity: 1
-
-.v-dialog > .v-card > .v-card__text
-  padding-top: 24px
-  font-weight: 300
-  line-height: 1.75em
-  letter-spacing: 0
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_notification.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_notification.sass
deleted file mode 100644
index c6bce41c..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_notification.sass
+++ /dev/null
@@ -1,27 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-alert
-  padding: 20px 15px
-
-  .v-alert__wrapper
-    .v-alert__icon
-      height: 38px
-      min-width: 38px
-
-    .v-alert__content
-      font-weight: 300
-
-      span
-        font-size: 12px
-        font-weight: 500
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_pagination.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_pagination.sass
deleted file mode 100644
index 9cc19b55..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_pagination.sass
+++ /dev/null
@@ -1,18 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-pagination
-  .v-pagination__item,
-  .v-pagination__navigation
-    &:focus
-      outline: none
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_settings.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_settings.sass
deleted file mode 100644
index 8b069926..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_settings.sass
+++ /dev/null
@@ -1,53 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-#settings
-  z-index: 200
-
-.v-settings
-  border-radius: 10px
-
-  .v-card
-    margin-top: 0
-
-  .v-card__text
-    strong
-      height: 30px
-      line-height: 25px
-      font-size: 12px
-      font-weight: 600
-      text-transform: uppercase
-      text-align: center
-
-  .v-avatar
-    border-color: #fff
-    border-radius: 50% !important
-    cursor: pointer
-    display: inline-block
-    height: 23px
-    margin-right: 12px
-    position: relative
-    width: 23px
-    padding: 8px
-
-  .v-settings__item
-    border-radius: 10px
-
-    .v-image
-      border-radius: 7px !important
-
-  .v-settings__item:not(.v-settings__item--active)
-    border-color: #fff !important
-
-  .v-divider.secondary
-    border-color: rgb(221, 221, 221) !important
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_sidebar.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_sidebar.sass
deleted file mode 100644
index ebccd046..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_sidebar.sass
+++ /dev/null
@@ -1,83 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-application .v-navigation-drawer .v-navigation-drawer__content .v-list-item .v-list-item__content .v-list-item__title.text-h3
-  font-size: 18px !important
-  margin-top: 12px
-  margin-bottom: 12px
-
-.v-application .v-navigation-drawer .v-navigation-drawer__content .v-list .v-list-group .v-list-group__header .v-list-item__content .v-list-item__title
-  font-size: 14px
-  font-weight: 300
-
-.v-application--is-ltr .v-list-item__avatar:first-child
-  margin-right: 11px
-
-.v-application .v-navigation-drawer .v-navigation-drawer__content .v-list-item__icon.v-list-group__header__append-icon .v-icon
-  font-size: 19px
-
-.v-application--is-ltr #core-navigation-drawer div.v-list-item__icon--text,
-.v-application--is-ltr #core-navigation-drawer div.v-list-item__icon:first-child
-  margin-left: 5px !important
-  margin-right: 18px
-  opacity: .8
-
-.v-application--is-ltr .v-list-item__action:last-of-type:not(:only-child),
-.v-application--is-ltr .v-list-item__avatar:last-of-type:not(:only-child),
-.v-application--is-ltr .v-list-item__icon:last-of-type:not(:only-child)
-  margin-right: 2px
-
-.v-list--nav.v-list--dense .v-list-item:not(:last-child):not(:only-child),
-.v-list--nav .v-list-item--dense:not(:last-child):not(:only-child),
-.v-list--rounded.v-list--dense .v-list-item:not(:last-child):not(:only-child),
-.v-list--rounded .v-list-item--dense:not(:last-child):not(:only-child)
-  margin-bottom: 3px
-
-.v-list-item .v-list-item__title, .v-list-item .v-list-item__subtitle
-  line-height: 1.2
-  font-weight: 300
-  font-size: 14px
-
-.v-list-group__items .v-list-item
-  font-size: 13px
-  margin-bottom: 5px !important
-
-  .v-list-item__title
-    font-size: 13px
-
-  .v-list-item__icon
-    margin-top: 14px
-
-.v-list-group__items .v-list-group--sub-group .v-list-group__header .v-list-item__icon--text
-  margin-top: 15px !important
-
-
-.v-list-item__icon
-  margin: 12px 0
-
-.theme--dark.v-list-item--active:hover::before, .theme--dark.v-list-item--active::before
-  opacity: 0
-
-.v-navigation-drawer
-  .v-list-item__content
-    transition: all 0.3s linear 0s
-
-.v-list--nav
-  padding-left: 15px
-  padding-right: 15px
-
-.theme--dark.v-navigation-drawer .v-divider
-  background-color: rgba(181, 181, 181, 0.2)
-  border-color: rgba(181, 181, 181, 0.1)
-  width: calc(100% - 30px)
-  margin-left: 15px
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_tab.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_tab.sass
deleted file mode 100644
index 78a68c87..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_tab.sass
+++ /dev/null
@@ -1,25 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-card--wizard
-  .v-tabs-bar
-    .v-slide-group__wrapper
-      overflow: visible
-      display: -webkit-inline-box
-      contain: inherit
-
-      .v-slide-group__content
-        z-index: 2
-
-    .v-tab:not(:first-child)
-      margin-left: 5px
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_table.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_table.sass
deleted file mode 100644
index 07565f04..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_table.sass
+++ /dev/null
@@ -1,35 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-data-table td
-  font-weight: 300
-  padding: 12px 8px
-
-.v-data-table table thead tr th
-  font-weight: 300
-  font-size: 17px
-  padding: 0px 8px
-
-.v-data-table table tbody tr td .v-btn
-  margin-right: 0px !important
-
-.v-data-table .v-data-table-header__sort-badge
-  font-size: 10px
-
-.v-data-table.theme--dark
-  tr th
-    color: #fff !important
-
-.theme--light
-  .v-data-table table thead tr th
-    color: #333
diff --git a/web-app/packages/lib-vue2/src/sass/vuetify-material/_view.sass b/web-app/packages/lib-vue2/src/sass/vuetify-material/_view.sass
deleted file mode 100644
index 114e8bc1..00000000
--- a/web-app/packages/lib-vue2/src/sass/vuetify-material/_view.sass
+++ /dev/null
@@ -1,37 +0,0 @@
-// =========================================================
-// * Vuetify Material Dashboard - v2.1.0
-// =========================================================
-//
-// * Product Page: https://www.creative-tim.com/product/vuetify-material-dashboard
-// * Copyright 2019 Creative Tim (https://www.creative-tim.com)
-//
-// * Coded by Creative Tim
-//
-// =========================================================
-//
-// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-.v-main__wrap
-  .container--fluid
-    padding-left: 30px
-    padding-right: 30px
-
-.v-application .text-h5
-  font-size: 25px !important
-  padding-bottom: 0
-
-.v-application .black--text
-  color: #333 !important
-
-.v-application .small
-  font-weight: 300
-  line-height: 2rem
-
-  small
-    font-weight: 400
-
-@media(max-width: 960px)
-  .v-main__wrap
-    .container--fluid
-      padding-left: 15px
-      padding-right: 15px
diff --git a/web-app/packages/lib-vue2/src/shims-svg.d.ts b/web-app/packages/lib-vue2/src/shims-svg.d.ts
deleted file mode 100644
index c8a61faf..00000000
--- a/web-app/packages/lib-vue2/src/shims-svg.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-declare module '*.svg' {
-  import Vue, { VueConstructor } from 'vue'
-  const content: VueConstructor<Vue>
-  export default content
-}
diff --git a/web-app/packages/lib-vue2/src/shims-tsx.d.ts b/web-app/packages/lib-vue2/src/shims-tsx.d.ts
deleted file mode 100644
index e73203a2..00000000
--- a/web-app/packages/lib-vue2/src/shims-tsx.d.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import Vue, { VNode } from 'vue'
-
-declare global {
-  namespace JSX {
-    interface Element extends VNode {}
-    interface ElementClass extends Vue {}
-    interface IntrinsicElements {
-      [elem: string]: any
-    }
-  }
-}
diff --git a/web-app/packages/lib-vue2/src/shims-vue.d.ts b/web-app/packages/lib-vue2/src/shims-vue.d.ts
deleted file mode 100644
index 42ada501..00000000
--- a/web-app/packages/lib-vue2/src/shims-vue.d.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import Router from 'vue-router'
-
-declare module '*.vue' {
-  import Vue from 'vue'
-  export default Vue
-}
-
-declare module 'pinia' {
-  export interface Pinia {
-    router: Router
-  }
-}
diff --git a/web-app/packages/lib-vue2/tsconfig.json b/web-app/packages/lib-vue2/tsconfig.json
deleted file mode 100644
index 5dada810..00000000
--- a/web-app/packages/lib-vue2/tsconfig.json
+++ /dev/null
@@ -1,52 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES5",
-    "module": "ESNext",
-    // setting strict to false
-    "strict": true,
-    "noImplicitAny": false,
-    "strictNullChecks": false,
-    "jsx": "preserve",
-    "moduleResolution": "Node",
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowJs": true,
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "useDefineForClassFields": true,
-    "sourceMap": true,
-    "baseUrl": "src",
-    "types": ["node", "vite/client"],
-    "rootDir": "src",
-    "paths": {
-      "@/*": ["*"]
-    },
-    "lib": ["ESNext", "DOM", "DOM.Iterable", "ScriptHost"],
-
-    "declaration": true,
-    "emitDeclarationOnly": true,
-    "composite": true,
-    "declarationDir": "types",
-    // just something for tsc-alias
-    "outDir": "types",
-
-    "resolveJsonModule": true,
-    // Ensure that Babel can safely transpile files in the TypeScript project
-    "isolatedModules": true
-  },
-  "include": [
-    "src/assets/**/*",
-    "src/**/*.js",
-    "src/**/*.jsx",
-    "src/**/*.json",
-    "src/**/*.ts",
-    "src/**/*.d.ts",
-    "src/**/*.tsx",
-    "src/**/*.vue",
-    "tests/**/*.ts",
-    "tests/**/*.tsx",
-    "components.d.ts"
-  ],
-  "exclude": ["node_modules"],
-  "references": [{ "path": "./tsconfig.node.json" }]
-}
diff --git a/web-app/packages/lib-vue2/tsconfig.node.json b/web-app/packages/lib-vue2/tsconfig.node.json
deleted file mode 100644
index 186c12a1..00000000
--- a/web-app/packages/lib-vue2/tsconfig.node.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "allowSyntheticDefaultImports": true,
-    "resolveJsonModule": true
-  },
-  "include": [
-    "vite.config.ts",
-    "package.json"
-  ]
-}
diff --git a/web-app/packages/lib-vue2/vite.config.ts b/web-app/packages/lib-vue2/vite.config.ts
deleted file mode 100644
index 9460c720..00000000
--- a/web-app/packages/lib-vue2/vite.config.ts
+++ /dev/null
@@ -1,104 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill'
-import vue from '@vitejs/plugin-vue2'
-import { resolve } from 'path'
-import rollupNodePolyFill from 'rollup-plugin-node-polyfills'
-import { VuetifyResolver } from 'unplugin-vue-components/resolvers'
-import Components from 'unplugin-vue-components/vite'
-import { defineConfig } from 'vite'
-import { viteStaticCopy } from 'vite-plugin-static-copy'
-// import vuetify from 'vite-plugin-vuetify'
-
-import packageJson from './package.json'
-
-// https://vitejs.dev/config/
-export default defineConfig(({ mode }) => ({
-  plugins: [
-    vue(),
-    Components({
-      resolvers: [VuetifyResolver()]
-    }),
-    viteStaticCopy({
-      // copy sass files to use in other applications
-      targets: [{ src: 'src/sass/**.scss', dest: 'sass' }]
-    })
-  ],
-  publicDir: './src/assets',
-  css: {
-    preprocessorOptions: {
-      scss: {
-        quietDeps: true
-      }
-    }
-  },
-
-  resolve: {
-    alias: {
-      '@': resolve(__dirname, './src'),
-      events: 'rollup-plugin-node-polyfills/polyfills/events',
-      https: 'agent-base',
-      path: 'rollup-plugin-node-polyfills/polyfills/path'
-    },
-    dedupe: ['vue', 'pinia', 'vue-router', 'vuetify']
-  },
-  build: {
-    commonjsOptions: {
-      //   include: [/node_modules/],
-      transformMixedEsModules: true
-    },
-    sourcemap: mode !== 'production',
-    lib: {
-      // Could also be a dictionary or array of multiple entry points
-      entry: resolve(__dirname, 'src/main.ts'),
-      name: 'lib',
-      // the proper extensions will be added
-      fileName: 'lib'
-    },
-    rollupOptions: {
-      // make sure to externalize deps that shouldn't be bundled
-      // into your library
-      external: [
-        'vue',
-        'pinia',
-        ...Object.keys(packageJson.dependencies),
-        '@vue/babel-helper-vue-jsx-merge-props'
-      ],
-      output: {
-        exports: 'named',
-        // Provide global variables to use in the UMD build
-        // for externalized deps
-        globals: {
-          vue: 'Vue',
-          pinia: 'pinia'
-        }
-      },
-      plugins: [
-        // Enable rollup polyfills plugin
-        // used during production bundling
-        rollupNodePolyFill()
-      ]
-    }
-  },
-  optimizeDeps: {
-    exclude: ['vue', '@mergin', 'vue-demi'],
-    esbuildOptions: {
-      define: {
-        global: 'globalThis'
-      },
-      plugins: [
-        NodeGlobalsPolyfillPlugin({
-          process: true,
-          buffer: true
-        })
-      ]
-    }
-  },
-  server: {
-    watch: {
-      ignored: ['!**/node_modules/@mergin/**']
-    }
-  }
-}))
diff --git a/web-app/packages/lib/package.json b/web-app/packages/lib/package.json
index 72b48df1..b65fca77 100644
--- a/web-app/packages/lib/package.json
+++ b/web-app/packages/lib/package.json
@@ -43,6 +43,7 @@
     "date-fns": "^2.28.0",
     "file-saver": "^2.0.5",
     "lodash": "^4.17.21",
+    "pinia": "^2.1.7",
     "primeflex": "^3.3.1",
     "primevue": "3.43.0",
     "vue": "3.3.8",
diff --git a/web-app/yarn.lock b/web-app/yarn.lock
index a2e6424f..92cf5141 100644
--- a/web-app/yarn.lock
+++ b/web-app/yarn.lock
@@ -167,7 +167,7 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.18.4", "@babel/parser@^7.20.7", "@babel/parser@^7.21.0", "@babel/parser@^7.21.2":
+"@babel/parser@^7.20.7", "@babel/parser@^7.21.0", "@babel/parser@^7.21.2":
   version "7.21.2"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.21.2.tgz#dacafadfc6d7654c3051a66d6fe55b6cb2f2a0b3"
   integrity sha512-URpaIJQwEkEC2T9Kn+Ai6Xe/02iNaVCuT/PtoRz3GPVJVDpPd7mLo+VddTbhCRU9TXqW5mSrQfXZyi8kDKOVpQ==
@@ -716,11 +716,6 @@
     "@typescript-eslint/types" "5.61.0"
     eslint-visitor-keys "^3.3.0"
 
-"@vitejs/plugin-vue2@^2.3.1":
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue2/-/plugin-vue2-2.3.1.tgz#53078d3d9d50d9863f1fbb1c1ef7791a5fcd4948"
-  integrity sha512-/ksaaz2SRLN11JQhLdEUhDzOn909WEk99q9t9w+N12GjQCljzv7GyvAbD/p20aBUjHkvpGOoQ+FCOkG+mjDF4A==
-
 "@vitejs/plugin-vue@^4.6.2":
   version "4.6.2"
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-4.6.2.tgz#057d2ded94c4e71b94e9814f92dcd9306317aa46"
@@ -748,11 +743,6 @@
     "@volar/language-core" "1.11.1"
     path-browserify "^1.0.1"
 
-"@vue/babel-helper-vue-jsx-merge-props@^1.4.0":
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz#8d53a1e21347db8edbe54d339902583176de09f2"
-  integrity sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==
-
 "@vue/compiler-core@3.3.8":
   version "3.3.8"
   resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.3.8.tgz#301bb60d0245265a88ed5b30e200fbf223acb313"
@@ -790,15 +780,6 @@
     "@vue/compiler-core" "3.4.37"
     "@vue/shared" "3.4.37"
 
-"@vue/compiler-sfc@2.7.14":
-  version "2.7.14"
-  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz#3446fd2fbb670d709277fc3ffa88efc5e10284fd"
-  integrity sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==
-  dependencies:
-    "@babel/parser" "^7.18.4"
-    postcss "^8.4.14"
-    source-map "^0.6.1"
-
 "@vue/compiler-sfc@3.3.8":
   version "3.3.8"
   resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.3.8.tgz#40b18e48aa00260950964d1d72157668521be0e1"
@@ -1280,11 +1261,6 @@ cssesc@^3.0.0:
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
-csstype@^3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.1.tgz#841b532c45c758ee546a11d5bd7b7b473c8c30b9"
-  integrity sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==
-
 csstype@^3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
@@ -2735,7 +2711,7 @@ postcss-value-parser@^4.2.0:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
   integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
 
-postcss@^8.4.14, postcss@^8.4.21:
+postcss@^8.4.21:
   version "8.4.21"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.21.tgz#c639b719a57efc3187b13a1d765675485f4134f4"
   integrity sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==
@@ -3045,11 +3021,6 @@ source-map-js@^1.0.2:
   resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
   integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
 
-source-map@^0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
-  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
-
 sourcemap-codec@^1.4.8:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
@@ -3402,16 +3373,6 @@ vue-router@4.2.5:
   dependencies:
     "@vue/devtools-api" "^6.5.0"
 
-vue-router@^3.6.5:
-  version "3.6.5"
-  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.6.5.tgz#95847d52b9a7e3f1361cb605c8e6441f202afad8"
-  integrity sha512-VYXZQLtjuvKxxcshuRAwjHnciqZVoXAjTjcqBTz4rKc8qih9g9pI3hbDjmqXaHdgL3v8pV6P8Z335XvHzESxLQ==
-
-vue-tabler-icons@^1.0:
-  version "1.14.0"
-  resolved "https://registry.yarnpkg.com/vue-tabler-icons/-/vue-tabler-icons-1.14.0.tgz#df0027906f225c1501c2d1cfa9d844f8d50bc428"
-  integrity sha512-ZFYo5RWXhp9/Ky8CFWUQ65x2oZy0YkwdfB4b2+tT/hPqGdieQfa303UiiFeNMHFYrNSGouDAN1LvpDxaN/4X2g==
-
 vue-template-compiler@^2.7.14:
   version "2.7.16"
   resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz#c81b2d47753264c77ac03b9966a46637482bb03b"
@@ -3440,19 +3401,6 @@ vue@3.3.8:
     "@vue/server-renderer" "3.3.8"
     "@vue/shared" "3.3.8"
 
-vue@^2.7.14:
-  version "2.7.14"
-  resolved "https://registry.yarnpkg.com/vue/-/vue-2.7.14.tgz#3743dcd248fd3a34d421ae456b864a0246bafb17"
-  integrity sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==
-  dependencies:
-    "@vue/compiler-sfc" "2.7.14"
-    csstype "^3.1.0"
-
-vuetify@^2.6.15:
-  version "2.6.15"
-  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-2.6.15.tgz#058c976f4e6e834076d80ae0c09bd61baa836d26"
-  integrity sha512-2a6sBSHzivXgi9pZMyHuzTgMyInCkj/BrVwTnoCa1Y/Dnfwj7lkWzgKQDScbGVK0q4vJ+YHoBBrLOmnhz1R0YA==
-
 webpack-sources@^3.2.3:
   version "3.2.3"
   resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-3.2.3.tgz#2d4daab8451fd4b240cc27055ff6a0c2ccea0cde"

From b18323a6f487226587292c51b2cda228b9acd11d Mon Sep 17 00:00:00 2001
From: "marcel.kocisek" <marcel.kocisek@lutraconsulting.co.uk>
Date: Fri, 20 Sep 2024 16:59:06 +0200
Subject: [PATCH 5/5] Cleanup unused i18n

---
 web-app/package.json                          |  1 -
 web-app/packages/admin-app/package.json       |  4 +-
 web-app/packages/admin-app/src/app.ts         |  3 --
 web-app/packages/admin-app/src/env.d.ts       |  7 +--
 .../admin-app/src/plugins/i18n/i18n.ts        | 12 -----
 .../admin-app/src/plugins/i18n/locale/en.json | 45 -------------------
 .../src/plugins/i18n/locale/en.json.license   |  3 --
 web-app/packages/admin-app/vite.config.ts     |  1 -
 web-app/packages/admin-lib/src/env.d.ts       |  7 +--
 web-app/packages/app/package.json             |  4 +-
 web-app/packages/app/src/app.ts               |  3 --
 web-app/packages/app/src/plugins/i18n/i18n.ts | 12 -----
 .../app/src/plugins/i18n/locale/en.json       | 45 -------------------
 .../src/plugins/i18n/locale/en.json.license   |  3 --
 web-app/yarn.lock                             | 30 -------------
 15 files changed, 4 insertions(+), 176 deletions(-)
 delete mode 100644 web-app/packages/admin-app/src/plugins/i18n/i18n.ts
 delete mode 100644 web-app/packages/admin-app/src/plugins/i18n/locale/en.json
 delete mode 100644 web-app/packages/admin-app/src/plugins/i18n/locale/en.json.license
 delete mode 100644 web-app/packages/app/src/plugins/i18n/i18n.ts
 delete mode 100644 web-app/packages/app/src/plugins/i18n/locale/en.json
 delete mode 100644 web-app/packages/app/src/plugins/i18n/locale/en.json.license

diff --git a/web-app/package.json b/web-app/package.json
index 184ca149..5d9812e0 100755
--- a/web-app/package.json
+++ b/web-app/package.json
@@ -26,7 +26,6 @@
     "build:admin:dev": "yarn workspace @mergin/admin-app build:dev",
     "clean:libs": "yarn workspace @mergin/lib clean && yarn workspace @mergin/admin-lib clean",
     "clean:libs:noadmin": "yarn workspace @mergin/lib clean",
-    "i18n:report": "yarn workspace @mergin/app 18n:report",
     "link:dependencies": "yarn link:register && yarn link @mergin/lib && yarn link @mergin/admin-lib",
     "link:register": "yarn workspaces run link:register",
     "link:unregister": "yarn workspaces run link:unregister",
diff --git a/web-app/packages/admin-app/package.json b/web-app/packages/admin-app/package.json
index f4c897cb..cf5dc4be 100644
--- a/web-app/packages/admin-app/package.json
+++ b/web-app/packages/admin-app/package.json
@@ -15,8 +15,7 @@
     "clean": "echo 'Nothing to clean.'",
     "link:register": "echo '[@mergin/admin-app] Nothing to register.'",
     "link:unregister": "echo '[@mergin/admin-app] Nothing to unregister.'",
-    "lint": "eslint . --ext .js,.vue,.ts",
-    "i18n:report": "vue-cli-service i18n:report --src './src/admin/**/*.?(js|vue)' --locales './src/admin/locales/**/*.json'"
+    "lint": "eslint . --ext .js,.vue,.ts"
   },
   "dependencies": {
     "@tabler/icons-webfont": "^2.42.0",
@@ -26,7 +25,6 @@
     "primeflex": "^3.3.1",
     "primevue": "3.43.0",
     "vue": "3.3.8",
-    "vue-i18n": "^9.7.1",
     "vue-meta": "^3.0.0-alpha.10",
     "vue-router": "4.2.5"
   }
diff --git a/web-app/packages/admin-app/src/app.ts b/web-app/packages/admin-app/src/app.ts
index e9613118..9a266639 100644
--- a/web-app/packages/admin-app/src/app.ts
+++ b/web-app/packages/admin-app/src/app.ts
@@ -22,8 +22,6 @@ import App from './App.vue'
 import { createRouter } from './router'
 import { addRouterToPinia, getPiniaInstance } from './store'
 
-import i18n from '@/plugins/i18n/i18n'
-
 const createMerginApp = () => {
   const pinia = getPiniaInstance()
   const router = createRouter(pinia)
@@ -37,7 +35,6 @@ const createMerginApp = () => {
     .mixin(MerginComponentUuidMixin)
     .use(pinia)
     .use(router)
-    .use(i18n)
     .use(createMetaManager())
     .use(PrimeVue, { pt: MMTheme })
     .use(ToastService)
diff --git a/web-app/packages/admin-app/src/env.d.ts b/web-app/packages/admin-app/src/env.d.ts
index dab6e2e2..22c908f8 100644
--- a/web-app/packages/admin-app/src/env.d.ts
+++ b/web-app/packages/admin-app/src/env.d.ts
@@ -4,11 +4,6 @@
 
 /// <reference types="vite/client" />
 
-interface ImportMetaEnv {
-  VITE_VUE_APP_I18N_LOCALE: string
-  VITE_VUE_APP_I18N_FALLBACK_LOCALE: string
-}
-
 interface ImportMeta {
-  readonly env: ImportMetaEnv
+  readonly env: unknown
 }
diff --git a/web-app/packages/admin-app/src/plugins/i18n/i18n.ts b/web-app/packages/admin-app/src/plugins/i18n/i18n.ts
deleted file mode 100644
index 0b119bcd..00000000
--- a/web-app/packages/admin-app/src/plugins/i18n/i18n.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { createI18n } from 'vue-i18n'
-
-export default createI18n({
-  legacy: false, // Vuetify does not support the legacy mode of vue-i18n
-  locale: import.meta.env.VITE_VUE_APP_I18N_LOCALE || 'en',
-  allowComposition: true,
-  fallbackLocale: import.meta.env.VITE_VUE_APP_I18N_FALLBACK_LOCALE || 'en'
-})
diff --git a/web-app/packages/admin-app/src/plugins/i18n/locale/en.json b/web-app/packages/admin-app/src/plugins/i18n/locale/en.json
deleted file mode 100644
index 2a8e7309..00000000
--- a/web-app/packages/admin-app/src/plugins/i18n/locale/en.json
+++ /dev/null
@@ -1,45 +0,0 @@
-{
-  "avatar": "Vuetify MD",
-  "buttons": "Buttons",
-  "calendar": "Calendar",
-  "charts": "Charts",
-  "components": "Components",
-  "ct": "CT",
-  "dashboard": "Dashboard",
-  "dtables": "Data Tables",
-  "eforms": "Extended Forms",
-  "error": "Error Page",
-  "etables": "Extended Tables",
-  "example": "Example",
-  "forms": "Forms",
-  "fullscreen": "Full Screen Map",
-  "google": "Google Maps",
-  "grid": "Grid System",
-  "icons": "Icons",
-  "lock": "Lock Screen Page",
-  "login": "Login Page",
-  "maps": "Maps",
-  "multi": "Multi Level Collapse",
-  "notifications": "Notifications",
-  "pages": "Pages",
-  "plan": "Choose Plan",
-  "pricing": "Pricing",
-  "my-profile": "My Profile",
-  "edit-profile": "Edit Profile",
-  "register": "Register Page",
-  "rforms": "Regular Forms",
-  "rtables": "Regular Tables",
-  "rtl": "RTL Support",
-  "search": "Search",
-  "settings": "Settings",
-  "tables": "Tables",
-  "tabs": "Tabs",
-  "tim": "Creative Tim",
-  "timeline": "Timeline",
-  "typography": "Typography",
-  "upgrade": "Upgrade To PRO",
-  "user": "User Profile",
-  "vforms": "Validation Forms",
-  "widgets": "Widgets",
-  "wizard": "Wizard"
-}
diff --git a/web-app/packages/admin-app/src/plugins/i18n/locale/en.json.license b/web-app/packages/admin-app/src/plugins/i18n/locale/en.json.license
deleted file mode 100644
index 1420f4b5..00000000
--- a/web-app/packages/admin-app/src/plugins/i18n/locale/en.json.license
+++ /dev/null
@@ -1,3 +0,0 @@
-Copyright 2019 Creative Tim (https://www.creative-tim.com)
-
-SPDX-License-Identifier: MIT
diff --git a/web-app/packages/admin-app/vite.config.ts b/web-app/packages/admin-app/vite.config.ts
index c390a2a7..d96b4ed8 100644
--- a/web-app/packages/admin-app/vite.config.ts
+++ b/web-app/packages/admin-app/vite.config.ts
@@ -36,7 +36,6 @@ export default defineConfig(({ mode }) => ({
   resolve: {
     alias: {
       '@': resolve(__dirname, './src'),
-      // 'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js',
       url: 'rollup-plugin-node-polyfills/polyfills/url'
     },
     dedupe: [
diff --git a/web-app/packages/admin-lib/src/env.d.ts b/web-app/packages/admin-lib/src/env.d.ts
index dab6e2e2..22c908f8 100644
--- a/web-app/packages/admin-lib/src/env.d.ts
+++ b/web-app/packages/admin-lib/src/env.d.ts
@@ -4,11 +4,6 @@
 
 /// <reference types="vite/client" />
 
-interface ImportMetaEnv {
-  VITE_VUE_APP_I18N_LOCALE: string
-  VITE_VUE_APP_I18N_FALLBACK_LOCALE: string
-}
-
 interface ImportMeta {
-  readonly env: ImportMetaEnv
+  readonly env: unknown
 }
diff --git a/web-app/packages/app/package.json b/web-app/packages/app/package.json
index fbc80aa6..080e50f3 100644
--- a/web-app/packages/app/package.json
+++ b/web-app/packages/app/package.json
@@ -15,8 +15,7 @@
     "clean": "echo 'Nothing to clean.'",
     "link:register": "echo '[@mergin/app] Nothing to register.'",
     "link:unregister": "echo '[@mergin/app] Nothing to unregister.'",
-    "lint": "eslint . --ext .js,.vue,.ts",
-    "i18n:report": "vue-cli-service i18n:report --src './src/admin/**/*.?(js|vue)' --locales './src/admin/locales/**/*.json'"
+    "lint": "eslint . --ext .js,.vue,.ts"
   },
   "dependencies": {
     "@tabler/icons-webfont": "^2.42.0",
@@ -27,7 +26,6 @@
     "primeflex": "^3.3.1",
     "primevue": "3.43.0",
     "vue": "3.3.8",
-    "vue-i18n": "^9.7.1",
     "vue-meta": "^3.0.0-alpha.10",
     "vue-router": "4.2.5"
   }
diff --git a/web-app/packages/app/src/app.ts b/web-app/packages/app/src/app.ts
index 9dfd60fb..878c56b5 100644
--- a/web-app/packages/app/src/app.ts
+++ b/web-app/packages/app/src/app.ts
@@ -22,8 +22,6 @@ import App from './App.vue'
 import { createRouter } from './router'
 import { addRouterToPinia, getPiniaInstance } from './store'
 
-import i18n from '@/plugins/i18n/i18n'
-
 const createMerginApp = () => {
   const pinia = getPiniaInstance()
   const router = createRouter(pinia)
@@ -37,7 +35,6 @@ const createMerginApp = () => {
     .mixin(MerginComponentUuidMixin)
     .use(pinia)
     .use(router)
-    .use(i18n)
     .use(createMetaManager())
     .use(PrimeVue, { pt: MMTheme })
     .use(ToastService)
diff --git a/web-app/packages/app/src/plugins/i18n/i18n.ts b/web-app/packages/app/src/plugins/i18n/i18n.ts
deleted file mode 100644
index 0b119bcd..00000000
--- a/web-app/packages/app/src/plugins/i18n/i18n.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-// Copyright (C) Lutra Consulting Limited
-//
-// SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-MerginMaps-Commercial
-
-import { createI18n } from 'vue-i18n'
-
-export default createI18n({
-  legacy: false, // Vuetify does not support the legacy mode of vue-i18n
-  locale: import.meta.env.VITE_VUE_APP_I18N_LOCALE || 'en',
-  allowComposition: true,
-  fallbackLocale: import.meta.env.VITE_VUE_APP_I18N_FALLBACK_LOCALE || 'en'
-})
diff --git a/web-app/packages/app/src/plugins/i18n/locale/en.json b/web-app/packages/app/src/plugins/i18n/locale/en.json
deleted file mode 100644
index 2a8e7309..00000000
--- a/web-app/packages/app/src/plugins/i18n/locale/en.json
+++ /dev/null
@@ -1,45 +0,0 @@
-{
-  "avatar": "Vuetify MD",
-  "buttons": "Buttons",
-  "calendar": "Calendar",
-  "charts": "Charts",
-  "components": "Components",
-  "ct": "CT",
-  "dashboard": "Dashboard",
-  "dtables": "Data Tables",
-  "eforms": "Extended Forms",
-  "error": "Error Page",
-  "etables": "Extended Tables",
-  "example": "Example",
-  "forms": "Forms",
-  "fullscreen": "Full Screen Map",
-  "google": "Google Maps",
-  "grid": "Grid System",
-  "icons": "Icons",
-  "lock": "Lock Screen Page",
-  "login": "Login Page",
-  "maps": "Maps",
-  "multi": "Multi Level Collapse",
-  "notifications": "Notifications",
-  "pages": "Pages",
-  "plan": "Choose Plan",
-  "pricing": "Pricing",
-  "my-profile": "My Profile",
-  "edit-profile": "Edit Profile",
-  "register": "Register Page",
-  "rforms": "Regular Forms",
-  "rtables": "Regular Tables",
-  "rtl": "RTL Support",
-  "search": "Search",
-  "settings": "Settings",
-  "tables": "Tables",
-  "tabs": "Tabs",
-  "tim": "Creative Tim",
-  "timeline": "Timeline",
-  "typography": "Typography",
-  "upgrade": "Upgrade To PRO",
-  "user": "User Profile",
-  "vforms": "Validation Forms",
-  "widgets": "Widgets",
-  "wizard": "Wizard"
-}
diff --git a/web-app/packages/app/src/plugins/i18n/locale/en.json.license b/web-app/packages/app/src/plugins/i18n/locale/en.json.license
deleted file mode 100644
index 1420f4b5..00000000
--- a/web-app/packages/app/src/plugins/i18n/locale/en.json.license
+++ /dev/null
@@ -1,3 +0,0 @@
-Copyright 2019 Creative Tim (https://www.creative-tim.com)
-
-SPDX-License-Identifier: MIT
diff --git a/web-app/yarn.lock b/web-app/yarn.lock
index 92cf5141..f0a2a35d 100644
--- a/web-app/yarn.lock
+++ b/web-app/yarn.lock
@@ -415,27 +415,6 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
-"@intlify/core-base@9.7.1":
-  version "9.7.1"
-  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.7.1.tgz#d31315a8e9cf027678b65a4155287143ab91b8fd"
-  integrity sha512-jPJTeECEhqQ7g//8g3Fb79j5SzSSRqlFCWD6pcX94uMLXU+L1m07gVZnnvzoJBnaMyJHiiwxOqZVfvu6rQfLvw==
-  dependencies:
-    "@intlify/message-compiler" "9.7.1"
-    "@intlify/shared" "9.7.1"
-
-"@intlify/message-compiler@9.7.1":
-  version "9.7.1"
-  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.7.1.tgz#2cd5f26c6b9f19afffd62e69d192cc4e9e51ba9a"
-  integrity sha512-HfIr2Hn/K7b0Zv4kGqkxAxwtipyxAwhI9a3krN5cuhH/G9gkaik7of1PdzjR3Mix43t2onBiKYQyaU7mo7e0aA==
-  dependencies:
-    "@intlify/shared" "9.7.1"
-    source-map-js "^1.0.2"
-
-"@intlify/shared@9.7.1":
-  version "9.7.1"
-  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.7.1.tgz#a4902421aacda2d716981eb9528aef0163c7bb0a"
-  integrity sha512-CBKnHzlUYGrk5QII9q4nElAQKO5cX1rRx8VmSWXltyOZjbkGHXYQTHULn6KwRi+CypuBCfmPkyPBHMzosypIeg==
-
 "@jridgewell/gen-mapping@^0.1.0":
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz#e5d2e450306a9491e3bd77e323e38d7aff315996"
@@ -3352,15 +3331,6 @@ vue-eslint-parser@^9.0.1:
     lodash "^4.17.21"
     semver "^7.3.6"
 
-vue-i18n@^9.7.1:
-  version "9.7.1"
-  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.7.1.tgz#41393b066f6ff69d9be2ba31a59b043263c77289"
-  integrity sha512-A6DzWqJQMdzBj+392+g3zIgGV0FnFC7o/V+txs5yIALANEZzY6ZV8hM2wvZR3nTbQI7dntAmzBHMeoEteJO0kQ==
-  dependencies:
-    "@intlify/core-base" "9.7.1"
-    "@intlify/shared" "9.7.1"
-    "@vue/devtools-api" "^6.5.0"
-
 vue-meta@^3.0.0-alpha.10:
   version "3.0.0-alpha.10"
   resolved "https://registry.yarnpkg.com/vue-meta/-/vue-meta-3.0.0-alpha.10.tgz#8aa7dee8ef43edda2633d52d2d4ca0ae03352222"