@vendure/dashboard 3.3.2 → 3.3.3

package/src/lib/providers/channel-provider.tsx

@@ -1,7 +1,7 @@
 import { api } from '@/graphql/api.js';
 import { ResultOf, graphql } from '@/graphql/graphql.js';
-import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useAuth } from '@/hooks/use-auth.js';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
 import * as React from 'react';
 
 // Define the channel fragment for reuse
@@ -63,10 +63,11 @@ export const ChannelContext = React.createContext<ChannelContext | undefined>(un
 
 // Local storage key for the selected channel
 const SELECTED_CHANNEL_KEY = 'vendure-selected-channel';
+const SELECTED_CHANNEL_TOKEN_KEY = 'vendure-selected-channel-token';
 
 export function ChannelProvider({ children }: { children: React.ReactNode }) {
-    const { isAuthenticated } = useAuth();
     const queryClient = useQueryClient();
+    const { channels: userChannels, isAuthenticated } = useAuth();
     const [selectedChannelId, setSelectedChannelId] = React.useState<string | undefined>(() => {
         // Initialize from localStorage if available
         try {
@@ -79,44 +80,83 @@ export function ChannelProvider({ children }: { children: React.ReactNode }) {
     });
 
     // Fetch all available channels
-    const { data: channelsData, isLoading: isChannelsLoading, refetch: refetchChannels } = useQuery({
-        queryKey: ['channels'],
+    const { data: channelsData, isLoading: isChannelsLoading } = useQuery({
+        queryKey: ['channels', isAuthenticated],
         queryFn: () => api.query(ChannelsQuery),
         retry: false,
+        enabled: isAuthenticated,
     });
 
-    React.useEffect(() => {
-        if (isAuthenticated) {
-            // Refetch channels when authenticated
-            refetchChannels();
+    // Filter channels based on user permissions
+    const channels = React.useMemo(() => {
+        // If user has specific channels assigned (non-superadmin), use those
+        if (userChannels && userChannels.length > 0) {
+            // Map user channels to match the Channel type structure
+            return userChannels.map(ch => ({
+                id: ch.id,
+                code: ch.code,
+                token: ch.token,
+                defaultLanguageCode:
+                    channelsData?.channels.items.find(c => c.id === ch.id)?.defaultLanguageCode || 'en',
+                defaultCurrencyCode:
+                    channelsData?.channels.items.find(c => c.id === ch.id)?.defaultCurrencyCode || 'USD',
+                pricesIncludeTax:
+                    channelsData?.channels.items.find(c => c.id === ch.id)?.pricesIncludeTax || false,
+            }));
         }
-    }, [isAuthenticated, refetchChannels])
+        // Otherwise use all channels (superadmin)
+        return channelsData?.channels.items || [];
+    }, [userChannels, channelsData?.channels.items]);
 
     // Set the selected channel and update localStorage
-    const setSelectedChannel = React.useCallback((channelId: string) => {
-        try {
-            // Store in localStorage
-            localStorage.setItem(SELECTED_CHANNEL_KEY, channelId);
-            setSelectedChannelId(channelId);
-            queryClient.invalidateQueries();
-        } catch (e) {
-            console.error('Failed to set selected channel', e);
-        }
-    }, []);
+    const setSelectedChannel = React.useCallback(
+        (channelId: string) => {
+            try {
+                // Find the channel to get its token
+                const channel = channels.find(c => c.id === channelId);
+                if (channel) {
+                    // Store channel ID and token in localStorage
+                    localStorage.setItem(SELECTED_CHANNEL_KEY, channelId);
+                    localStorage.setItem(SELECTED_CHANNEL_TOKEN_KEY, channel.token);
+                    setSelectedChannelId(channelId);
+                    queryClient.invalidateQueries();
+                }
+            } catch (e) {
+                console.error('Failed to set selected channel', e);
+            }
+        },
+        [queryClient, channels],
+    );
 
     // If no selected channel is set but we have an active channel, use that
+    // Also validate that the selected channel is accessible to the user
     React.useEffect(() => {
-        if (!selectedChannelId && channelsData?.activeChannel?.id) {
-            setSelectedChannelId(channelsData.activeChannel.id);
+        const validChannelIds = channels.map(c => c.id);
+
+        // If selected channel is not valid for this user, reset it
+        if (selectedChannelId && !validChannelIds.includes(selectedChannelId)) {
+            setSelectedChannelId(undefined);
+            try {
+                localStorage.removeItem(SELECTED_CHANNEL_KEY);
+                localStorage.removeItem(SELECTED_CHANNEL_TOKEN_KEY);
+            } catch (e) {
+                console.error('Failed to remove selected channel from localStorage', e);
+            }
+        }
+
+        // If no selected channel is set, use the first available channel
+        if (!selectedChannelId && channels.length > 0) {
+            const defaultChannel = channels[0];
+            setSelectedChannelId(defaultChannel.id);
             try {
-                localStorage.setItem(SELECTED_CHANNEL_KEY, channelsData.activeChannel.id);
+                localStorage.setItem(SELECTED_CHANNEL_KEY, defaultChannel.id);
+                localStorage.setItem(SELECTED_CHANNEL_TOKEN_KEY, defaultChannel.token);
             } catch (e) {
                 console.error('Failed to store selected channel in localStorage', e);
             }
         }
-    }, [selectedChannelId, channelsData]);
+    }, [selectedChannelId, channels]);
 
-    const channels = channelsData?.channels.items || [];
     const activeChannel = channelsData?.activeChannel;
     const isLoading = isChannelsLoading;
 

package/src/lib/providers/server-config.tsx

@@ -270,14 +270,14 @@ export const ServerConfigProvider = ({ children }: { children: React.ReactNode }
         enabled: !!user?.id,
         staleTime: 1000,
     });
-    const value: ServerConfig = {
+    const value: ServerConfig | null = data?.globalSettings ? {
         availableLanguages: data?.globalSettings.availableLanguages ?? [],
         moneyStrategyPrecision: data?.globalSettings.serverConfig.moneyStrategyPrecision ?? 2,
         orderProcess: data?.globalSettings.serverConfig.orderProcess ?? [],
         permittedAssetTypes: data?.globalSettings.serverConfig.permittedAssetTypes ?? [],
         permissions: data?.globalSettings.serverConfig.permissions ?? [],
         entityCustomFields: data?.globalSettings.serverConfig.entityCustomFields ?? [],
-    };
+    } : null;
 
     return <ServerConfigContext.Provider value={value}>{children}</ServerConfigContext.Provider>;
 };

package/vite/utils/config-loader.ts

@@ -36,6 +36,7 @@ export interface ConfigLoaderOptions {
     tempDir: string;
     vendureConfigExport?: string;
     logger?: Logger;
+    reportCompilationErrors?: boolean;
 }
 
 export interface LoadVendureConfigResult {
@@ -67,7 +68,12 @@ export async function loadVendureConfig(options: ConfigLoaderOptions): Promise<L
     const configFileName = path.basename(vendureConfigPath);
     const inputRootDir = path.dirname(vendureConfigPath);
     await fs.remove(outputPath);
-    const pluginInfo = await compileFile(inputRootDir, vendureConfigPath, outputPath, logger);
+    const pluginInfo = await compileFile({
+        inputRootDir,
+        inputPath: vendureConfigPath,
+        outputDir: outputPath,
+        logger,
+    });
     const compiledConfigFilePath = pathToFileURL(path.join(outputPath, configFileName)).href.replace(
         /.ts$/,
         '.js',
@@ -147,7 +153,14 @@ async function findTsConfigPaths(
                             );
                         }
                         logger.debug(
-                            `Found tsconfig paths in ${tsConfigPath}: ${JSON.stringify({ baseUrl: tsConfigBaseUrl, paths }, null, 2)}`,
+                            `Found tsconfig paths in ${tsConfigPath}: ${JSON.stringify(
+                                {
+                                    baseUrl: tsConfigBaseUrl,
+                                    paths,
+                                },
+                                null,
+                                2,
+                            )}`,
                         );
                         return { baseUrl: tsConfigBaseUrl, paths };
                     }
@@ -167,15 +180,27 @@ async function findTsConfigPaths(
     return undefined;
 }
 
-export async function compileFile(
-    inputRootDir: string,
-    inputPath: string,
-    outputDir: string,
-    logger: Logger = defaultLogger,
+type CompileFileOptions = {
+    inputRootDir: string;
+    inputPath: string;
+    outputDir: string;
+    logger?: Logger;
+    compiledFiles?: Set<string>;
+    isRoot?: boolean;
+    pluginInfo?: PluginInfo[];
+    reportCompilationErrors?: boolean;
+};
+
+export async function compileFile({
+    inputRootDir,
+    inputPath,
+    outputDir,
+    logger = defaultLogger,
     compiledFiles = new Set<string>(),
     isRoot = true,
-    pluginInfo: PluginInfo[] = [],
-): Promise<PluginInfo[]> {
+    pluginInfo = [],
+    reportCompilationErrors = false,
+}: CompileFileOptions): Promise<PluginInfo[]> {
     const absoluteInputPath = path.resolve(inputPath);
     if (compiledFiles.has(absoluteInputPath)) {
         return pluginInfo;
@@ -325,7 +350,15 @@ export async function compileFile(
     // Recursively collect all files that need to be compiled
     for (const importPath of importPaths) {
         // Pass rootTsConfigInfo down, but set isRoot to false
-        await compileFile(inputRootDir, importPath, outputDir, logger, compiledFiles, false, pluginInfo);
+        await compileFile({
+            inputRootDir,
+            inputPath: importPath,
+            outputDir,
+            logger,
+            compiledFiles,
+            isRoot: false,
+            pluginInfo,
+        });
     }
 
     // If this is the root file (the one that started the compilation),
@@ -370,10 +403,12 @@ export async function compileFile(
         logger.info(`Emitting compiled files to ${outputDir}`);
         const emitResult = program.emit();
 
-        const hasEmitErrors = reportDiagnostics(program, emitResult, logger);
+        if (reportCompilationErrors) {
+            const hasEmitErrors = reportDiagnostics(program, emitResult, logger);
 
-        if (hasEmitErrors) {
-            throw new Error('TypeScript compilation failed with errors.');
+            if (hasEmitErrors) {
+                throw new Error('TypeScript compilation failed with errors.');
+            }
         }
 
         logger.info(`Successfully compiled ${allFiles.length} files to ${outputDir}`);

package/vite/vite-plugin-vendure-dashboard.ts

@@ -1,4 +1,3 @@
-import { lingui } from '@lingui/vite-plugin';
 import tailwindcss from '@tailwindcss/vite';
 import { TanStackRouterVite } from '@tanstack/router-plugin/vite';
 import react from '@vitejs/plugin-react';
@@ -10,8 +9,7 @@ import { configLoaderPlugin } from './vite-plugin-config-loader.js';
 import { viteConfigPlugin } from './vite-plugin-config.js';
 import { dashboardMetadataPlugin } from './vite-plugin-dashboard-metadata.js';
 import { gqlTadaPlugin } from './vite-plugin-gql-tada.js';
-import { themeVariablesPlugin } from './vite-plugin-theme.js';
-import { ThemeVariablesPluginOptions } from './vite-plugin-theme.js';
+import { ThemeVariablesPluginOptions, themeVariablesPlugin } from './vite-plugin-theme.js';
 import { UiConfigPluginOptions, uiConfigPlugin } from './vite-plugin-ui-config.js';
 
 /**
@@ -37,6 +35,14 @@ export type VitePluginVendureDashboardOptions = {
     gqlTadaOutputPath?: string;
     tempCompilationDir?: string;
     disableTansStackRouterPlugin?: boolean;
+    /**
+     * @description
+     * If set to `true`, compilation errors during the build process will be reported and
+     * the build will fail.
+     *
+     * @default false
+     */
+    reportCompilationErrors?: boolean;
 } & UiConfigPluginOptions &
     ThemeVariablesPluginOptions;
 
@@ -74,7 +80,11 @@ export function vendureDashboardPlugin(options: VitePluginVendureDashboardOption
         }),
         themeVariablesPlugin({ theme: options.theme }),
         tailwindcss(),
-        configLoaderPlugin({ vendureConfigPath: normalizedVendureConfigPath, tempDir }),
+        configLoaderPlugin({
+            vendureConfigPath: normalizedVendureConfigPath,
+            tempDir,
+            reportCompilationErrors: options.reportCompilationErrors,
+        }),
         viteConfigPlugin({ packageRoot }),
         adminApiSchemaPlugin(),
         dashboardMetadataPlugin({ rootDir: tempDir }),