Reorganzied frontend code

nitro_repo/src/repository/npm/mod.rs

@@ -27,9 +27,7 @@ use crate::{
 
 pub use super::prelude::*;
 mod configs;
-use super::{
-    DynRepository, NewRepository, RepositoryFactoryError, RepositoryType, RepositoryTypeDescription,
-};
+use super::{DynRepository, NewRepository, RepositoryType, RepositoryTypeDescription};
 pub use configs::*;
 
 #[derive(Debug, Clone, DynRepositoryHandler)]

nitro_repo/src/repository/repo_http.rs

@@ -26,7 +26,6 @@ use http_body_util::BodyExt;
 use nr_core::storage::{InvalidStoragePath, StoragePath};
 use nr_storage::{StorageFile, StorageFileMeta, StorageFileReader};
 use serde::Deserialize;
-use thiserror::Error;
 use tracing::{debug, error, instrument, span, Level};
 mod header;
 mod repo_auth;
@@ -53,6 +52,7 @@ impl RepositoryRequestBody {
         let body = self.body_as_bytes().await?;
         serde_json::from_slice(&body).map_err(RepositoryHandlerError::from)
     }
+    /// In Debug mode we convert to a string so we can debug it
     #[cfg(debug_assertions)]
     #[instrument]
     pub async fn body_as_json<T: for<'a> Deserialize<'a>>(

site/package.json

@@ -32,20 +32,20 @@
     "@milkdown/utils": "^7.5.0",
     "@milkdown/vue": "^7.5.0",
     "@types/highlightjs": "^9.12.6",
-    "axios": "^1.7.5",
+    "axios": "^1.7.7",
     "highlight.js": "^11.10.0",
     "nitro-jsf": "0.0.1",
     "pinia": "^2.2.2",
-    "pinia-plugin-persistedstate": "^3.2.1",
-    "vue": "^3.4.38",
+    "pinia-plugin-persistedstate": "^4.0.0",
+    "vue": "^3.5.3",
     "vue-final-modal": "^4.5.4",
     "vue-markdown-render": "^2.2.1",
     "vue-meta": "3.0.0-alpha.10",
     "vue-router": "^4.4.3",
     "vue3-simple-icons": "^13.2.0"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^1.7.0",
+    "@chromatic-com/storybook": "^1.9.0",
     "@rushstack/eslint-patch": "^1.10.4",
     "@storybook/addon-essentials": "^8.2.9",
     "@storybook/addon-interactions": "^8.2.9",
@@ -57,21 +57,21 @@
     "@storybook/vue3-vite": "^8.2.9",
     "@tsconfig/node20": "^20.1.4",
     "@types/node": "22.*",
-    "@vitejs/plugin-vue": "^5.1.2",
+    "@vitejs/plugin-vue": "^5.1.3",
     "@vitejs/plugin-vue-jsx": "^4.0.1",
     "@vue/eslint-config-prettier": "^9.0.0",
     "@vue/eslint-config-typescript": "^13.0.0",
     "@vue/tsconfig": "^0.5.1",
     "eslint": "^8.57.0",
     "eslint-plugin-storybook": "^0.8.0",
-    "eslint-plugin-vue": "^9.27.0",
+    "eslint-plugin-vue": "^9.28.0",
     "npm-run-all2": "^6.2.2",
     "prettier": "^3.3.3",
-    "sass": "^1.77",
+    "sass": "^1.78",
     "storybook": "^8.2.9",
     "typescript": "~5.5.4",
-    "vite": "^5.4.2",
-    "vite-plugin-vue-devtools": "^7.3.9",
-    "vue-tsc": "^2.0.29"
+    "vite": "^5.4.3",
+    "vite-plugin-vue-devtools": "^7.4.4",
+    "vue-tsc": "^2.1.6"
   }
 }

site/src/components/admin/repository/RepositoryListInner.vue

@@ -51,7 +51,6 @@
 import router from '@/router'
 import type { UserResponseType } from '@/types/base'
 import type { RepositoryWithStorageName } from '@/types/repository'
-import type { StorageItem } from '@/types/storage'
 import { notify } from '@kyvg/vue3-notification'
 import { computed, ref, type PropType } from 'vue'
 const searchValue = ref<string>('')

site/src/components/code/CodeMenu.vue → site/src/components/core/code/CodeMenu.vue

@@ -16,10 +16,11 @@
 <script setup lang="ts">
 import type { PropType } from 'vue'
 import type { CodeSnippet } from './code'
-import TabElement from '../core/tabs/TabElement.vue'
-import TabsElement from '../core/tabs/TabsElement.vue'
-import TabContent from '../core/tabs/TabContent.vue'
+
 import CodeCard from './CodeCard.vue'
+import TabContent from '../tabs/TabContent.vue'
+import TabsElement from '../tabs/TabsElement.vue'
+import TabElement from '../tabs/TabElement.vue'
 
 defineProps({
   snippets: {

site/src/components/repository/PublicRepositoryList.vue → site/src/components/nr/repository/PublicRepositoryList.vue

@@ -49,10 +49,7 @@
 
 <script setup lang="ts">
 import router from '@/router'
-import type { UserResponseType } from '@/types/base'
 import type { RepositoryWithStorageName } from '@/types/repository'
-import type { StorageItem } from '@/types/storage'
-import { notify } from '@kyvg/vue3-notification'
 import { computed, ref, type PropType } from 'vue'
 const searchValue = ref<string>('')
 

site/src/components/repository/types/maven/MavenProjectHelper.vue → site/src/components/nr/repository/types/maven/MavenProjectHelper.vue

@@ -25,9 +25,9 @@ import type { Project, ProjectVersion } from '@/types/project'
 import type { RepositoryWithStorageName } from '@/types/repository'
 import { computed, type PropType } from 'vue'
 import { createProjectSnippets } from './MavenRepositoryHelpers'
-import CodeMenu from '@/components/code/CodeMenu.vue'
+import CodeMenu from '@/components/core/code/CodeMenu.vue'
 import KeyAndValue from '@/components/form/KeyAndValue.vue'
-import CopyCode from '@/components/code/CopyCode.vue'
+import CopyCode from '@/components/core/code/CopyCode.vue'
 
 const props = defineProps({
   project: {

site/src/components/repository/types/maven/MavenRepositoryHelper.vue → site/src/components/nr/repository/types/maven/MavenRepositoryHelper.vue

@@ -12,7 +12,7 @@ import { createRepositoryRoute, type RepositoryWithStorageName } from '@/types/r
 import { computed, type PropType } from 'vue'
 import { createSnippetsForPulling } from './MavenRepositoryHelpers'
 
-import CodeMenu from '@/components/code/CodeMenu.vue'
+import CodeMenu from '@/components/core/code/CodeMenu.vue'
 
 const props = defineProps({
   repository: {

site/src/components/repository/types/maven/MavenRepositoryHelpers.ts → site/src/components/nr/repository/types/maven/MavenRepositoryHelpers.ts

@@ -1,4 +1,4 @@
-import type { CodeSnippet } from '@/components/code/code'
+import type { CodeSnippet } from '@/components/core/code/code'
 import { apiURL } from '@/config'
 import type { Project } from '@/types/project'
 import { createRepositoryRoute, type RepositoryWithStorageName } from '@/types/repository'

site/src/components/storage/StorageList.vue → site/src/components/nr/storage/StorageList.vue

@@ -7,8 +7,8 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import StorageListInner from './StorageListInner.vue'
-import type { StorageItem } from '@/types/storage'
 import { repositoriesStore } from '@/stores/repositories'
+import type { StorageItem } from './storageTypes'
 
 const storages = ref<StorageItem[]>([])
 const error = ref<string | null>(null)

site/src/components/storage/StorageListInner.vue → site/src/components/nr/storage/StorageListInner.vue

@@ -48,9 +48,9 @@
 <script setup lang="ts">
 import router from '@/router'
 import type { UserResponseType } from '@/types/base'
-import type { StorageItem } from '@/types/storage'
 import { notify } from '@kyvg/vue3-notification'
 import { computed, ref, type PropType } from 'vue'
+import type { StorageItem } from './storageTypes'
 const searchValue = ref<string>('')
 
 const props = defineProps({

site/src/components/nr/storage/local/local.ts

@@ -0,0 +1,3 @@
+interface LocalStorageConfig{
+
+}

site/src/components/nr/storage/storageTypes.ts

@@ -0,0 +1,41 @@
+import LocalStorageConfig from '@/components/nr/storage/local/LocalStorageConfig.vue'
+import UpdateLocalStorageConfig from '@/components/nr/storage/local/UpdateLocalStorageConfig.vue'
+
+interface StorageType {
+  label: string
+  value: string
+  title: string
+  description: string
+  component: any
+  updateComponent: any
+}
+export const storageTypes: Array<StorageType> = [
+  {
+    label: 'Local',
+    value: 'Local',
+    title: 'Local Storage Configuration',
+    description: 'Local storage configuration allows you to store data on your local machine.',
+    component: LocalStorageConfig,
+    updateComponent: UpdateLocalStorageConfig
+  }
+]
+
+export function getStorageType(value: string): StorageType | undefined {
+  return storageTypes.find((type) => type.value === value)
+}
+
+export interface LocalConfig {
+  path: string
+}
+export type StorageTypeConfig = {
+  type: 'Local'
+  settings: LocalConfig
+}
+export interface StorageItem {
+  id: string
+  name: string
+  storage_type: string
+  config: StorageTypeConfig
+  active: boolean
+  created_at: Date
+}

site/src/stores/repositories.ts

@@ -1,4 +1,3 @@
-import { type StorageItem } from './../types/storage'
 import { defineStore } from 'pinia'
 import { type Ref, ref } from 'vue'
 import http from '@/http'
@@ -8,6 +7,7 @@ import type {
   RepositoryWithStorageName
 } from '@/types/repository'
 import type { RootSchema } from 'nitro-jsf'
+import type { StorageItem } from '@/components/nr/storage/storageTypes'
 export const repositoriesStore = defineStore(
   'repositories',
   () => {

site/src/types/project.ts

@@ -1,4 +1,4 @@
-import MavenProjectHelper from '@/components/repository/types/maven/MavenProjectHelper.vue'
+import MavenProjectHelper from '@/components/nr/repository/types/maven/MavenProjectHelper.vue'
 
 export interface RawProject {
   id: string

site/src/types/repository.ts

@@ -1,12 +1,12 @@
 import http from '@/http'
-import MavenConfig from '@/components/repository/types/maven/MavenConfig.vue'
+import MavenConfig from '@/components/nr/repository/types/maven/MavenConfig.vue'
 
 import type { Component } from 'vue'
 import RepositoryPageEditor from '@/components/admin/repository/configs/RepositoryPageEditor.vue'
 import { apiURL } from '@/config'
 
-import { MavenFrontendDefinition } from '@/components/repository/types/maven/maven'
-import NPMConfig from '@/components/repository/types/npm/NPMConfig.vue'
+import { MavenFrontendDefinition } from '@/components/nr/repository/types/maven/maven'
+import NPMConfig from '@/components/nr/repository/types/npm/NPMConfig.vue'
 import type { RepositoryActionsType } from './user'
 
 export interface RepositoryTypeDescription {

site/src/views/BrowseView.vue

@@ -12,9 +12,9 @@
   </main>
 </template>
 <script setup lang="ts">
-import BrowseHeader from '@/components/repository/browse/BrowseHeader.vue'
-import BrowseList from '@/components/repository/browse/BrowseList.vue'
-import BrowseProject from '@/components/repository/project/BrowseProject.vue'
+import BrowseHeader from '@/components/nr/repository/browse/BrowseHeader.vue'
+import BrowseList from '@/components/nr/repository/browse/BrowseList.vue'
+import BrowseProject from '@/components/nr/repository/project/BrowseProject.vue'
 import http from '@/http'
 import router from '@/router'
 import { repositoriesStore } from '@/stores/repositories'

site/src/views/HomeView.vue

@@ -7,7 +7,7 @@
 
 <script setup lang="ts">
 import ErrorOnRequest from '@/components/ErrorOnRequest.vue'
-import PublicRepositoryList from '@/components/repository/PublicRepositoryList.vue'
+import PublicRepositoryList from '@/components/nr/repository/PublicRepositoryList.vue'
 import { repositoriesStore } from '@/stores/repositories'
 import type { RepositoryWithStorageName } from '@/types/repository'
 import { ref } from 'vue'

site/src/views/RepositoriesView.vue

@@ -7,8 +7,8 @@
 
 <script setup lang="ts">
 import ErrorOnRequest from '@/components/ErrorOnRequest.vue'
-import PublicRepositoryList from '@/components/repository/PublicRepositoryList.vue'
-import RepositoryPageViewer from '@/components/repository/RepositoryPageViewer.vue'
+import PublicRepositoryList from '@/components/nr/repository/PublicRepositoryList.vue'
+import RepositoryPageViewer from '@/components/nr/repository/RepositoryPageViewer.vue'
 import { repositoriesStore } from '@/stores/repositories'
 import type { RepositoryWithStorageName } from '@/types/repository'
 import { ref } from 'vue'

site/src/views/RepositoryPageView.vue

@@ -37,11 +37,11 @@
 
 <script setup lang="ts">
 import AdminUserPage from '@/components/admin/user/AdminUserPage.vue'
-import CopyURL from '@/components/code/CopyCode.vue'
+import CopyURL from '@/components/core/code/CopyCode.vue'
 import ErrorOnRequest from '@/components/ErrorOnRequest.vue'
-import RepositoryHelper from '@/components/repository/RepositoryHelper.vue'
-import RepositoryIcon from '@/components/repository/RepositoryIcon.vue'
-import RepositoryPageViewer from '@/components/repository/RepositoryPageViewer.vue'
+import RepositoryHelper from '@/components/nr/repository/RepositoryHelper.vue'
+import RepositoryIcon from '@/components/nr/repository/RepositoryIcon.vue'
+import RepositoryPageViewer from '@/components/nr/repository/RepositoryPageViewer.vue'
 import http from '@/http'
 
 import router from '@/router'

site/src/views/admin/repository/CreateRepositoryView.vue

@@ -33,11 +33,11 @@ import DropDown from '@/components/form/dropdown/DropDown.vue'
 import SubmitButton from '@/components/form/SubmitButton.vue'
 import TextInput from '@/components/form/text/TextInput.vue'
 import TwoByFormBox from '@/components/form/TwoByFormBox.vue'
+import type { StorageItem } from '@/components/nr/storage/storageTypes'
 import http from '@/http'
 import router from '@/router'
 import { repositoriesStore } from '@/stores/repositories'
 import { getConfigType, type RepositoryTypeDescription } from '@/types/repository'
-import { type StorageItem } from '@/types/storage'
 import { notify } from '@kyvg/vue3-notification'
 import { computed, ref, watch, type Component } from 'vue'
 const input = ref({

site/src/views/admin/repository/RepositoryListView.vue

@@ -1,10 +1,31 @@
 <template>
   <main>
-    <RepositoryList />
+    <div v-if="!error && repositories.length >= 1">
+      <RepositoryListInner :repositories="repositories" />
+    </div>
   </main>
 </template>
 
 <script setup lang="ts">
-import RepositoryList from '@/components/admin/repository/RepositoryList.vue'
-import StorageList from '@/components/storage/StorageList.vue'
+import http from '@/http'
+import { ref } from 'vue'
+
+import type { RepositoryWithStorageName } from '@/types/repository'
+import RepositoryListInner from '@/components/admin/repository/RepositoryListInner.vue'
+
+const repositories = ref<RepositoryWithStorageName[]>([])
+const error = ref<string | null>(null)
+
+async function fetchRepositories() {
+  await http
+    .get<RepositoryWithStorageName[]>('/api/repository/list')
+    .then((response) => {
+      repositories.value = response.data
+    })
+    .catch((error) => {
+      console.error(error)
+      error.value = 'Failed to fetch repositories'
+    })
+}
+fetchRepositories()
 </script>