@datlv-trustshop/shopify-inapp-components 0.2.2 → 0.2.4

package/dist/components/GrowApps.js

@@ -51,7 +51,7 @@ export const GrowApps = ({ className = "", onAppClick, onDismiss, dismissKey = D
         }
     }, [dismissKey, dismissDuration]);
     const handleGetAppClick = (app) => {
-        const url = app.app_url || app.get_app || "#";
+        const url = app.button_install_link || app.app_url || app.get_app || "#";
         if (url && url !== "#") {
             window.open(url, "_blank");
         }
@@ -190,7 +190,8 @@ export const GrowApps = ({ className = "", onAppClick, onDismiss, dismissKey = D
                                     transform: "translateX(0px)",
                                 }, children: growApps.map((app, index) => {
                                     const iconUrl = app.icon_url || app.imageUrl || "";
-                                    const buttonText = app.button_text ||
+                                    const buttonText = app.button_install_text ||
+                                        app.button_text ||
                                         app.button_get_app ||
                                         growAppsTranslations?.install ||
                                         "Get app";

package/dist/hooks/index.d.ts

@@ -7,3 +7,5 @@ export * from "./useGrowApps";
 export * from "./usePartnerIntegration";
 export * from "./useFloatingCards";
 export * from "./useCampaignTracking";
+export * from "./useFloatingCardActions";
+export * from "./useFloatingCardEngine";

package/dist/hooks/index.js

@@ -7,3 +7,5 @@ export * from "./useGrowApps";
 export * from "./usePartnerIntegration";
 export * from "./useFloatingCards";
 export * from "./useCampaignTracking";
+export * from "./useFloatingCardActions";
+export * from "./useFloatingCardEngine";

package/dist/hooks/useFloatingCardActions.d.ts

@@ -0,0 +1,17 @@
+import { FloatingCardData } from '../components/FloatingCard';
+export interface FloatingCardActionsConfig {
+    navigate: (path: string) => void;
+    onOpenPricing?: () => void;
+    onDismiss?: (cardId: string | number) => void;
+    specialRoutes?: {
+        [key: string]: () => void;
+    };
+}
+export interface FloatingCardActionsReturn {
+    handlePrimaryAction: (card: FloatingCardData) => void;
+    handleSecondaryAction: (card: FloatingCardData) => void;
+    handleDismiss: (cardId: string | number) => void;
+    resolveAction: (action: FloatingCardData['primary_action'] | FloatingCardData['secondary_action']) => void;
+}
+export declare const useFloatingCardActions: (config: FloatingCardActionsConfig) => FloatingCardActionsReturn;
+export default useFloatingCardActions;

package/dist/hooks/useFloatingCardActions.js

@@ -0,0 +1,54 @@
+import { useCallback } from 'react';
+export const useFloatingCardActions = (config) => {
+    const { navigate, onOpenPricing, onDismiss, specialRoutes = {} } = config;
+    const resolveAction = useCallback((action) => {
+        if (!action?.url)
+            return;
+        const url = action.url;
+        // Check for special routes first
+        if (url === '/pricing' || url.startsWith('/pricing?')) {
+            if (onOpenPricing) {
+                onOpenPricing();
+                return;
+            }
+        }
+        // Check custom special routes
+        for (const [route, handler] of Object.entries(specialRoutes)) {
+            if (url === route || url.startsWith(`${route}?`)) {
+                handler();
+                return;
+            }
+        }
+        // Handle internal routes (starts with /)
+        if (url.startsWith('/')) {
+            navigate(url);
+            return;
+        }
+        // Handle external links
+        if ((url.startsWith('http://') || url.startsWith('https://')) &&
+            action.external !== false) {
+            window.open(url, '_blank', 'noopener,noreferrer');
+            return;
+        }
+        // Fallback to navigation for relative paths or unknown formats
+        navigate(url);
+    }, [navigate, onOpenPricing, specialRoutes]);
+    const handlePrimaryAction = useCallback((card) => {
+        resolveAction(card.primary_action);
+    }, [resolveAction]);
+    const handleSecondaryAction = useCallback((card) => {
+        resolveAction(card.secondary_action);
+    }, [resolveAction]);
+    const handleDismiss = useCallback((cardId) => {
+        if (onDismiss) {
+            onDismiss(cardId);
+        }
+    }, [onDismiss]);
+    return {
+        handlePrimaryAction,
+        handleSecondaryAction,
+        handleDismiss,
+        resolveAction,
+    };
+};
+export default useFloatingCardActions;

package/dist/hooks/useFloatingCardEngine.d.ts

@@ -0,0 +1,21 @@
+import { FloatingCardActionsConfig } from './useFloatingCardActions';
+import { FloatingCardData } from '../components/FloatingCard';
+export interface FloatingCardEngineConfig extends Omit<FloatingCardActionsConfig, 'onDismiss'> {
+    shopId?: string;
+    currentRoute?: string;
+}
+export interface FloatingCardEngineReturn {
+    visibleCards: FloatingCardData[];
+    loading: boolean;
+    error: Error | null;
+    handlePrimaryAction: (card: FloatingCardData) => void;
+    handleSecondaryAction: (card: FloatingCardData) => void;
+    handleDismiss: (cardId: string | number) => void;
+    resolveAction: (action: FloatingCardData['primary_action'] | FloatingCardData['secondary_action']) => void;
+}
+/**
+ * Comprehensive hook that combines floating card data fetching with action handling.
+ * This provides a complete solution for floating card functionality.
+ */
+export declare const useFloatingCardEngine: (config: FloatingCardEngineConfig) => FloatingCardEngineReturn;
+export default useFloatingCardEngine;

package/dist/hooks/useFloatingCardEngine.js

@@ -0,0 +1,39 @@
+import { useVisibleFloatingCards } from './useFloatingCards';
+import { useFloatingCardActions } from './useFloatingCardActions';
+/**
+ * Comprehensive hook that combines floating card data fetching with action handling.
+ * This provides a complete solution for floating card functionality.
+ */
+export const useFloatingCardEngine = (config) => {
+    const { shopId, currentRoute, navigate, onOpenPricing, specialRoutes } = config;
+    // Fetch visible floating cards
+    const { visibleCards, dismissCard, loading, error } = useVisibleFloatingCards({
+        shopId,
+        currentRoute,
+    });
+    // Set up action handlers with dismiss integrated
+    const actions = useFloatingCardActions({
+        navigate,
+        onOpenPricing,
+        specialRoutes,
+        onDismiss: (cardId) => {
+            // Convert to number if needed for compatibility
+            const id = typeof cardId === 'string' ? parseInt(cardId, 10) : cardId;
+            if (!isNaN(id)) {
+                dismissCard(id);
+            }
+        },
+    });
+    return {
+        // Data
+        visibleCards,
+        loading,
+        error,
+        // Actions
+        handlePrimaryAction: actions.handlePrimaryAction,
+        handleSecondaryAction: actions.handleSecondaryAction,
+        handleDismiss: actions.handleDismiss,
+        resolveAction: actions.resolveAction,
+    };
+};
+export default useFloatingCardEngine;

package/dist/types/dashboard.d.ts

@@ -11,6 +11,8 @@ export interface GrowApp {
     imageUrl?: string;
     button_text?: string;
     button_get_app?: string;
+    button_install_text?: string;
+    button_install_link?: string;
     app_url?: string;
     get_app?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datlv-trustshop/shopify-inapp-components",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "private": false,
   "description": "React TypeScript components for Shopify in-app dashboard content",
   "main": "dist/index.js",