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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,3 +7,5 @@ export * from "./useGrowApps";
7
7
  export * from "./usePartnerIntegration";
8
8
  export * from "./useFloatingCards";
9
9
  export * from "./useCampaignTracking";
10
+ export * from "./useFloatingCardActions";
11
+ export * from "./useFloatingCardEngine";
@@ -7,3 +7,5 @@ export * from "./useGrowApps";
7
7
  export * from "./usePartnerIntegration";
8
8
  export * from "./useFloatingCards";
9
9
  export * from "./useCampaignTracking";
10
+ export * from "./useFloatingCardActions";
11
+ export * from "./useFloatingCardEngine";
@@ -0,0 +1,17 @@
1
+ import { FloatingCardData } from '../components/FloatingCard';
2
+ export interface FloatingCardActionsConfig {
3
+ navigate: (path: string) => void;
4
+ onOpenPricing?: () => void;
5
+ onDismiss?: (cardId: string | number) => void;
6
+ specialRoutes?: {
7
+ [key: string]: () => void;
8
+ };
9
+ }
10
+ export interface FloatingCardActionsReturn {
11
+ handlePrimaryAction: (card: FloatingCardData) => void;
12
+ handleSecondaryAction: (card: FloatingCardData) => void;
13
+ handleDismiss: (cardId: string | number) => void;
14
+ resolveAction: (action: FloatingCardData['primary_action'] | FloatingCardData['secondary_action']) => void;
15
+ }
16
+ export declare const useFloatingCardActions: (config: FloatingCardActionsConfig) => FloatingCardActionsReturn;
17
+ export default useFloatingCardActions;
@@ -0,0 +1,54 @@
1
+ import { useCallback } from 'react';
2
+ export const useFloatingCardActions = (config) => {
3
+ const { navigate, onOpenPricing, onDismiss, specialRoutes = {} } = config;
4
+ const resolveAction = useCallback((action) => {
5
+ if (!action?.url)
6
+ return;
7
+ const url = action.url;
8
+ // Check for special routes first
9
+ if (url === '/pricing' || url.startsWith('/pricing?')) {
10
+ if (onOpenPricing) {
11
+ onOpenPricing();
12
+ return;
13
+ }
14
+ }
15
+ // Check custom special routes
16
+ for (const [route, handler] of Object.entries(specialRoutes)) {
17
+ if (url === route || url.startsWith(`${route}?`)) {
18
+ handler();
19
+ return;
20
+ }
21
+ }
22
+ // Handle internal routes (starts with /)
23
+ if (url.startsWith('/')) {
24
+ navigate(url);
25
+ return;
26
+ }
27
+ // Handle external links
28
+ if ((url.startsWith('http://') || url.startsWith('https://')) &&
29
+ action.external !== false) {
30
+ window.open(url, '_blank', 'noopener,noreferrer');
31
+ return;
32
+ }
33
+ // Fallback to navigation for relative paths or unknown formats
34
+ navigate(url);
35
+ }, [navigate, onOpenPricing, specialRoutes]);
36
+ const handlePrimaryAction = useCallback((card) => {
37
+ resolveAction(card.primary_action);
38
+ }, [resolveAction]);
39
+ const handleSecondaryAction = useCallback((card) => {
40
+ resolveAction(card.secondary_action);
41
+ }, [resolveAction]);
42
+ const handleDismiss = useCallback((cardId) => {
43
+ if (onDismiss) {
44
+ onDismiss(cardId);
45
+ }
46
+ }, [onDismiss]);
47
+ return {
48
+ handlePrimaryAction,
49
+ handleSecondaryAction,
50
+ handleDismiss,
51
+ resolveAction,
52
+ };
53
+ };
54
+ export default useFloatingCardActions;
@@ -0,0 +1,21 @@
1
+ import { FloatingCardActionsConfig } from './useFloatingCardActions';
2
+ import { FloatingCardData } from '../components/FloatingCard';
3
+ export interface FloatingCardEngineConfig extends Omit<FloatingCardActionsConfig, 'onDismiss'> {
4
+ shopId?: string;
5
+ currentRoute?: string;
6
+ }
7
+ export interface FloatingCardEngineReturn {
8
+ visibleCards: FloatingCardData[];
9
+ loading: boolean;
10
+ error: Error | null;
11
+ handlePrimaryAction: (card: FloatingCardData) => void;
12
+ handleSecondaryAction: (card: FloatingCardData) => void;
13
+ handleDismiss: (cardId: string | number) => void;
14
+ resolveAction: (action: FloatingCardData['primary_action'] | FloatingCardData['secondary_action']) => void;
15
+ }
16
+ /**
17
+ * Comprehensive hook that combines floating card data fetching with action handling.
18
+ * This provides a complete solution for floating card functionality.
19
+ */
20
+ export declare const useFloatingCardEngine: (config: FloatingCardEngineConfig) => FloatingCardEngineReturn;
21
+ export default useFloatingCardEngine;
@@ -0,0 +1,39 @@
1
+ import { useVisibleFloatingCards } from './useFloatingCards';
2
+ import { useFloatingCardActions } from './useFloatingCardActions';
3
+ /**
4
+ * Comprehensive hook that combines floating card data fetching with action handling.
5
+ * This provides a complete solution for floating card functionality.
6
+ */
7
+ export const useFloatingCardEngine = (config) => {
8
+ const { shopId, currentRoute, navigate, onOpenPricing, specialRoutes } = config;
9
+ // Fetch visible floating cards
10
+ const { visibleCards, dismissCard, loading, error } = useVisibleFloatingCards({
11
+ shopId,
12
+ currentRoute,
13
+ });
14
+ // Set up action handlers with dismiss integrated
15
+ const actions = useFloatingCardActions({
16
+ navigate,
17
+ onOpenPricing,
18
+ specialRoutes,
19
+ onDismiss: (cardId) => {
20
+ // Convert to number if needed for compatibility
21
+ const id = typeof cardId === 'string' ? parseInt(cardId, 10) : cardId;
22
+ if (!isNaN(id)) {
23
+ dismissCard(id);
24
+ }
25
+ },
26
+ });
27
+ return {
28
+ // Data
29
+ visibleCards,
30
+ loading,
31
+ error,
32
+ // Actions
33
+ handlePrimaryAction: actions.handlePrimaryAction,
34
+ handleSecondaryAction: actions.handleSecondaryAction,
35
+ handleDismiss: actions.handleDismiss,
36
+ resolveAction: actions.resolveAction,
37
+ };
38
+ };
39
+ export default useFloatingCardEngine;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@datlv-trustshop/shopify-inapp-components",
3
- "version": "0.2.3",
3
+ "version": "0.2.4",
4
4
  "private": false,
5
5
  "description": "React TypeScript components for Shopify in-app dashboard content",
6
6
  "main": "dist/index.js",