@bagelink/vue 1.4.184 → 1.4.188

package/src/components/form/inputs/Upload/upload.ts

@@ -1,32 +1,47 @@
 import type { AxiosResponse } from 'axios'
 import type { BglFile, BglFilePatch, UploadOptions } from './upload.types.d.ts'
 import axios from 'axios'
+import { getBagelInstance } from '../../../../composables/useBagel'
+
+// Helper to get file version from config
+const getFileVersion = () => getBagelInstance()?.fileVersion ?? 'files_v2'
 
 export const files = {
 	setBaseUrl: (baseUrl?: string) => {
-		if (!baseUrl) return
+		if (baseUrl === undefined || baseUrl === '') return
 		baseUrl = baseUrl.replace(/\/$/, '')
 		axios.defaults.baseURL = baseUrl
 	},
 
-	get: async (pathKey?: string): Promise<AxiosResponse<BglFile>> => { return axios.get('/files_v2/', { params: { path_key: pathKey } }) },
+	get: async (pathKey?: string): Promise<AxiosResponse<BglFile>> => {
+		return axios.get(`/${getFileVersion()}/`, { params: { path_key: pathKey } })
+	},
 
-	put: async (bglFilePatch: BglFilePatch, pathKey?: string): Promise<AxiosResponse<BglFile>> => { return axios.put('/files_v2/', bglFilePatch, { params: { path_key: pathKey } }) },
+	put: async (
+		bglFilePatch: BglFilePatch,
+		pathKey?: string
+	): Promise<AxiosResponse<BglFile>> => {
+		return axios.put(`/${getFileVersion()}/`, bglFilePatch, { params: { path_key: pathKey } })
+	},
 
-	delete: async (pathKey?: string) => { return axios.delete('/files_v2/', { params: { path_key: pathKey } }) },
+	delete: async (pathKey?: string) => {
+		return axios.delete(`/${getFileVersion()}/`, { params: { path_key: pathKey } })
+	},
 
-	upload: async (file: File, options?: UploadOptions & { dirPath?: string, tags?: string[] }): Promise<AxiosResponse<BglFile>> => {
+	upload: async (
+		file: File,
+		options?: UploadOptions & { dirPath?: string, tags?: string[] }
+	): Promise<AxiosResponse<BglFile>> => {
 		const formData = new FormData()
 		formData.append('upload', file)
-		return axios.post('/files_v2/upload', formData, {
+		return axios.post(`/${getFileVersion()}/upload`, formData, {
 			headers: { 'Content-Type': 'multipart/form-data' },
-
 			onUploadProgress: options?.onUploadProgress,
 			params: { dir_path: options?.dirPath, tags: options?.tags },
-
-		}) },
+		})
+	},
 
 	list: async (dirPath?: string): Promise<AxiosResponse<BglFile[]>> => {
-		return axios.get('/files_v2/list', { params: { dir_path: dirPath } })
+		return axios.get(`/${getFileVersion()}/list`, { params: { dir_path: dirPath } })
 	}
 }

package/src/components/layout/AppSidebar.vue

@@ -4,14 +4,14 @@ import { Btn, Icon } from '@bagelink/vue'
 import { inject, computed, ref, watch } from 'vue'
 import { useRoute } from 'vue-router'
 
-// Extended interface for footer links that can have actions
-interface FooterLink extends NavLink {
+// Extended interface for links that can have actions
+interface LinkWithAction extends NavLink {
 	action?: () => void
 }
 
 interface Props {
-	navLinks: NavLink[]
-	footerLinks?: FooterLink[]
+	navLinks: LinkWithAction[]
+	footerLinks?: LinkWithAction[]
 	logo?: string
 	logoAlt?: string
 	card?: boolean
@@ -73,47 +73,34 @@ const sidebarStyles = computed(() => {
 		width,
 	}
 })
-
-function logout() {
-	console.log('Logging out...')
-	// Add your logout logic here
-}
 </script>
 
 <template>
-	<aside
-		class="app-sidebar transition-400 fixed start top bottom h-100vh z-99" :class="{
-			'sidebar-mobile-open': menuState.isMobile.value && menuState.isOpen.value,
-			'sidebar-mobile-closed':
-				menuState.isMobile.value && !menuState.isOpen.value,
-			'transitioning': isTransitioning,
-			'p-05': props.card,
-			'sidebar-collapsed': !menuState.isMobile.value && !menuState.isOpen.value,
-		}" :style="sidebarStyles"
-	>
-		<div
-			:style="{
-				backgroundColor: props.bgColor,
-				color: props.textColor,
-				...(props.card && { borderRadius: 'var(--card-border-radius)' }),
-			}" :class="{
+	<aside class="app-sidebar transition-400 fixed start top bottom h-100vh z-99" :class="{
+		'sidebar-mobile-open': menuState.isMobile.value && menuState.isOpen.value,
+		'sidebar-mobile-closed':
+			menuState.isMobile.value && !menuState.isOpen.value,
+		'transitioning': isTransitioning,
+		'p-05': props.card,
+		'sidebar-collapsed': !menuState.isMobile.value && !menuState.isOpen.value,
+	}" :style="sidebarStyles">
+		<div :style="{
+			backgroundColor: props.bgColor,
+			color: props.textColor,
+			...(props.card && { borderRadius: 'var(--card-border-radius)' }),
+		}" :class="{
 				'card cardWrapSide': props.card,
 				'ps-05': !menuState.isOpen.value,
 				'scrollbar-gutter-both': menuState.isOpen.value,
 				'aside_frame': props.frame,
-			}" class="overflow-hidden flex column flex-stretch gap-1 w100p pt-1 pb-05 h-100p"
-		>
+			}" class="overflow-hidden flex column flex-stretch gap-1 w100p pt-1 pb-05 h-100p">
 			<!-- Logo/Brand -->
-			<router-link
-				to="/" class="decoration-none flex px-05" :class="{
-					'gap-05': menuState.isOpen.value,
-					'gap-0': !menuState.isOpen.value,
-				}"
-			>
-				<img
-					v-if="props.logo" :src="props.logo" :alt="props.logoAlt" class="contain"
-					:style="{ height: props.logoHeight }"
-				>
+			<router-link to="/" class="decoration-none flex px-05" :class="{
+				'gap-05': menuState.isOpen.value,
+				'gap-0': !menuState.isOpen.value,
+			}">
+				<img v-if="props.logo" :src="props.logo" :alt="props.logoAlt" class="contain"
+					:style="{ height: props.logoHeight }">
 				<span class="nav-text">
 					{{ props.name }}
 				</span>
@@ -121,17 +108,15 @@ function logout() {
 
 			<!-- Navigation Links -->
 			<nav class="sidebar-nav flex column flex-stretch gap-025 align-items-start scrollbar-gutter-stable">
-				<Btn
-					v-for="link in props.navLinks" :key="link.to" :title="!menuState.isOpen.value && !menuState.isMobile.value
-						? link.label
-						: ''
+				<Btn v-for="link in props.navLinks" :key="link.to" :title="!menuState.isOpen.value && !menuState.isMobile.value
+					? link.label
+					: ''
 					" fullWidth alignTxt="start" class="flex-shrink-0 px-1" :class="{ 'nav-btn-active': route.path === link.to }"
 					:style="{
 						backgroundColor:
 							route.path === link.to ? props.activeColor : props.bgColor,
 						color: route.path === link.to ? 'white' : props.textColor,
-					}" :to="link.to || '/'"
-				>
+					}" :to="link.to || '/'" @click="link.action">
 					<Icon :name="link.icon" size="1.2" />
 					<span class="nav-text">
 						{{ link.label }}
@@ -140,28 +125,16 @@ function logout() {
 			</nav>
 			<!-- Footer -->
 			<div
-				class="sidebar-footer flex column flex-stretch gap-025 align-items-start mt-auto scrollbar-gutter-stable"
-			>
+				class="sidebar-footer flex column flex-stretch gap-025 align-items-start mt-auto scrollbar-gutter-stable">
 				<!-- Footer Links -->
-				<Btn
-					v-for="link in props.footerLinks" :key="link.to || link.label" :title="!menuState.isOpen.value && !menuState.isMobile.value
-						? link.label
-						: ''
-					" alignTxt="start" fullWidth flat :icon="link.icon" class="flex-shrink-0 px-1" :to="link.to" @click="link.action"
-				>
+				<Btn v-for="link in props.footerLinks" :key="link.to || link.label" :title="!menuState.isOpen.value && !menuState.isMobile.value
+					? link.label
+					: ''
+					" alignTxt="start" fullWidth flat :icon="link.icon" class="flex-shrink-0 px-1" :to="link.to" @click="link.action">
 					<span class="nav-text">
 						{{ link.label }}
 					</span>
 				</Btn>
-
-				<!-- Default Logout Button if no footer links provided -->
-				<Btn
-					v-if="props.footerLinks.length === 0" :title="!menuState.isOpen.value && !menuState.isMobile.value ? 'Logout' : ''
-					" alignTxt="start" fullWidth flat icon="logout" class="flex-shrink-0 px-1" @click="logout"
-				>
-					<span class="nav-text"> Logout </span>
-				</Btn>
-
 				<!-- Custom Footer Content Slot -->
 				<slot name="footer" />
 			</div>
@@ -189,6 +162,7 @@ function logout() {
 	overflow-y: auto;
 	flex: 1;
 }
+
 /* הסתרת גלילה בזמן שינוי גודל */
 .app-sidebar.transitioning .sidebar-nav {
 	scrollbar-width: none;
@@ -267,8 +241,8 @@ function logout() {
 		transform: translateX(-100%);
 	}
 
-				[dir="rtl"] .sidebar-mobile-closed,
-				.rtl .sidebar-mobile-closed {
+	[dir="rtl"] .sidebar-mobile-closed,
+	.rtl .sidebar-mobile-closed {
 		transform: translateX(100%);
 	}
 }

package/src/plugins/bagel.ts

@@ -24,13 +24,19 @@ export interface BagelOptions {
 	language?: string
 	host?: string
 	fileBaseUrl?: string
+	fileVersion?: string
 	onError?: (err: Error) => void
 
 	i18nT?: (key: string) => string
 }
 export const BagelVue: Plugin<BagelOptions> = {
 	install: (app, options) => {
-		const bagel = new Bagel({ host: options.host, fileBaseUrl: options.fileBaseUrl, onError: options.onError })
+		const bagel = new Bagel({
+			host: options.host,
+			fileBaseUrl: options.fileBaseUrl,
+			fileVersion: options.fileVersion,
+			onError: options.onError
+		})
 
 		// Set global Bagel instance for the composable
 		setBagelInstance(bagel)