@datlv-trustshop/shopify-inapp-components 0.1.15 → 0.1.17
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.
|
@@ -9,9 +9,7 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
9
9
|
const handleManage = (item) => {
|
|
10
10
|
const url = item.button_manage_url;
|
|
11
11
|
if (url) {
|
|
12
|
-
// Check if it's an internal route (starts with /)
|
|
13
12
|
if (url.startsWith("/")) {
|
|
14
|
-
// Let the parent handle internal navigation
|
|
15
13
|
onManage?.(item);
|
|
16
14
|
}
|
|
17
15
|
else {
|
|
@@ -43,11 +41,8 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
43
41
|
},
|
|
44
42
|
});
|
|
45
43
|
}
|
|
46
|
-
// Get status from provider or use defaults
|
|
47
44
|
const status = statusProvider?.(item);
|
|
48
|
-
// Determine badge based on status or integration key
|
|
49
45
|
const getBadgeInfo = () => {
|
|
50
|
-
// Use external status if provided
|
|
51
46
|
if (status) {
|
|
52
47
|
if (status.isConnected) {
|
|
53
48
|
return {
|
|
@@ -61,19 +56,12 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
61
56
|
tone: "success",
|
|
62
57
|
};
|
|
63
58
|
}
|
|
64
|
-
if (status.isInstalled) {
|
|
65
|
-
return {
|
|
66
|
-
text: translations.partnerIntegration?.installed || "Installed",
|
|
67
|
-
tone: "info",
|
|
68
|
-
};
|
|
69
|
-
}
|
|
70
59
|
if (status.isPending) {
|
|
71
60
|
return {
|
|
72
61
|
text: "Pending",
|
|
73
62
|
tone: "warning",
|
|
74
63
|
};
|
|
75
64
|
}
|
|
76
|
-
// If status explicitly says inactive
|
|
77
65
|
if (status.isActive === false) {
|
|
78
66
|
return {
|
|
79
67
|
text: translations.partnerIntegration?.inactive || "Inactive",
|
|
@@ -81,7 +69,6 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
81
69
|
};
|
|
82
70
|
}
|
|
83
71
|
}
|
|
84
|
-
// Fallback to default logic based on key
|
|
85
72
|
if (item.key === "google_reviews") {
|
|
86
73
|
return {
|
|
87
74
|
text: translations.partnerIntegration?.connected || "Connected",
|
|
@@ -89,21 +76,17 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
89
76
|
};
|
|
90
77
|
}
|
|
91
78
|
if (item.key === "after_ship") {
|
|
92
|
-
// AfterShip shows both buttons, so it's likely installed but inactive by default
|
|
93
79
|
return {
|
|
94
80
|
text: translations.partnerIntegration?.inactive || "Inactive",
|
|
95
81
|
tone: undefined,
|
|
96
82
|
};
|
|
97
83
|
}
|
|
98
|
-
// Check if installed based on having both manage and install buttons
|
|
99
|
-
// Items with both buttons are typically installed but may be inactive
|
|
100
84
|
if (item.button_manage_text && item.button_install_text) {
|
|
101
85
|
return {
|
|
102
86
|
text: translations.partnerIntegration?.inactive || "Inactive",
|
|
103
87
|
tone: undefined,
|
|
104
88
|
};
|
|
105
89
|
}
|
|
106
|
-
// Only manage button = installed and active
|
|
107
90
|
if (item.button_manage_text && !item.button_install_text) {
|
|
108
91
|
return {
|
|
109
92
|
text: translations.partnerIntegration?.active || "Active",
|
|
@@ -135,31 +118,12 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
135
118
|
}, title: status.upgradeBadgeTooltip, children: [status.upgradeBadgeIcon && (_jsx("span", { style: {
|
|
136
119
|
display: "inline-flex",
|
|
137
120
|
alignItems: "center",
|
|
138
|
-
}, children: status.upgradeBadgeIcon })), _jsx("span", { children: status.upgradeBadgeText || "Upgrade" })] }))] }), item.content && (_jsx(Text, { as: "p", variant: "bodyMd", tone: "subdued", children: item.content }))] }), _jsx(InlineStack, { gap: "200", children: status ? (
|
|
139
|
-
// Status provider exists, use it for button logic
|
|
140
|
-
status.isConnected ? (
|
|
141
|
-
// Connected: show manage button
|
|
142
|
-
_jsx(Button, { onClick: () => handleManage(item), children: item.button_manage_text ||
|
|
143
|
-
translations.partnerIntegration?.manage ||
|
|
144
|
-
"Manage" })) : status.isInstalled ? (
|
|
145
|
-
// Installed but not connected
|
|
146
|
-
_jsxs(_Fragment, { children: [item.button_manage_text && (_jsx(Button, { onClick: () => handleManage(item), children: item.button_manage_text })), item.button_install_text && (_jsx(Button, { icon: ExternalIcon, onClick: () => handleInstall(item), children: item.button_install_text }))] })) : (
|
|
147
|
-
// Not installed: show install button
|
|
148
|
-
item.button_install_text && (_jsx(Button, { icon: ExternalIcon, onClick: () => handleInstall(item), children: item.button_install_text })))) : (
|
|
149
|
-
// No status provider, show all available buttons from API
|
|
150
|
-
_jsxs(_Fragment, { children: [item.button_manage_text && (_jsx(Button, { onClick: () => handleManage(item), children: item.button_manage_text })), item.button_install_text && (_jsx(Button, { icon: ExternalIcon, onClick: () => handleInstall(item), children: item.button_install_text }))] })) })] }) })] }) }) }, `integration--${item.id || item.key}`));
|
|
121
|
+
}, children: status.upgradeBadgeIcon })), _jsx("span", { children: status.upgradeBadgeText || "Upgrade" })] }))] }), item.content && (_jsx(Text, { as: "p", variant: "bodyMd", tone: "subdued", children: item.content }))] }), _jsx(InlineStack, { gap: "200", children: status ? (_jsxs(_Fragment, { children: [item.button_install_text && (_jsx(Button, { icon: ExternalIcon, onClick: () => handleInstall(item), children: item.button_install_text })), item.button_manage_text && (_jsx(Button, { onClick: () => handleManage(item), disabled: status.isActive === false, children: item.button_manage_text }))] })) : (_jsxs(_Fragment, { children: [item.button_manage_text && (_jsx(Button, { onClick: () => handleManage(item), children: item.button_manage_text })), item.button_install_text && (_jsx(Button, { icon: ExternalIcon, onClick: () => handleInstall(item), children: item.button_install_text }))] })) })] }) })] }) }) }, `integration--${item.id || item.key}`));
|
|
151
122
|
};
|
|
152
123
|
// Loading state
|
|
153
124
|
if (loading) {
|
|
154
|
-
return (_jsx("div", { className: className, children: _jsx(BlockStack, { gap: "600", children: [1, 2, 3].map((groupIndex) => (_jsxs(BlockStack, { gap: "400", children: [_jsx(Box, { paddingInlineStart: { xs: "200", md: "0" }, children: _jsx(SkeletonBodyText, { lines: 1 }) }), _jsx(Grid, { children: [1, 2].map((cardIndex) => (_jsx(Grid.Cell, {
|
|
155
|
-
xs: 6,
|
|
156
|
-
sm: 6,
|
|
157
|
-
md: 3,
|
|
158
|
-
lg: 3,
|
|
159
|
-
xl: 3,
|
|
160
|
-
}, children: _jsx(Card, { children: _jsx(BlockStack, { gap: "300", children: _jsx(SkeletonBodyText, { lines: 3 }) }) }) }, `skeleton-card-${groupIndex}-${cardIndex}`))) })] }, `skeleton-group-${groupIndex}`))) }) }));
|
|
125
|
+
return (_jsx("div", { className: className, children: _jsx(BlockStack, { gap: "600", children: [1, 2, 3].map((groupIndex) => (_jsxs(BlockStack, { gap: "400", children: [_jsx(Box, { paddingInlineStart: { xs: "200", md: "0" }, children: _jsx(SkeletonBodyText, { lines: 1 }) }), _jsx(Grid, { columns: { xs: 1, sm: 1, md: 2, lg: 2, xl: 2 }, children: [1, 2].map((cardIndex) => (_jsx(Grid.Cell, { children: _jsx(Card, { children: _jsx(BlockStack, { gap: "300", children: _jsx(SkeletonBodyText, { lines: 3 }) }) }) }, `skeleton-card-${groupIndex}-${cardIndex}`))) })] }, `skeleton-group-${groupIndex}`))) }) }));
|
|
161
126
|
}
|
|
162
|
-
// Error state
|
|
163
127
|
if (error) {
|
|
164
128
|
return (_jsx("div", { className: className, children: _jsx(Card, { children: _jsx(EmptyState, { heading: translations.partnerIntegration?.errorTitle ||
|
|
165
129
|
"Unable to load integrations", image: "", children: _jsx("p", { children: translations.partnerIntegration?.errorMessage ||
|
|
@@ -174,12 +138,6 @@ export const PartnerIntegration = ({ className = "", onManage, onInstall, onOpen
|
|
|
174
138
|
"Check back later for available integrations" }) }) }) }));
|
|
175
139
|
}
|
|
176
140
|
// Render groups
|
|
177
|
-
return (_jsx("div", { className: className, children: _jsx(BlockStack, { gap: "600", children: groups.map((group) => (_jsxs(BlockStack, { gap: "400", children: [_jsx(Box, { paddingInlineStart: { xs: "200", md: "0" }, children: _jsx(Text, { as: "h3", variant: "headingMd", fontWeight: "semibold", children: group.title }) }), _jsx(Grid, { children: group.items.map((item) => (_jsx(Grid.Cell, {
|
|
178
|
-
xs: 6,
|
|
179
|
-
sm: 6,
|
|
180
|
-
md: 3,
|
|
181
|
-
lg: 3,
|
|
182
|
-
xl: 3,
|
|
183
|
-
}, children: renderIntegrationCard(item) }, `integration-cell--${item.id || item.key}`))) })] }, `integration-group--${group.key}`))) }) }));
|
|
141
|
+
return (_jsx("div", { className: className, children: _jsx(BlockStack, { gap: "600", children: groups.map((group) => (_jsxs(BlockStack, { gap: "400", children: [_jsx(Box, { paddingInlineStart: { xs: "200", md: "0" }, children: _jsx(Text, { as: "h3", variant: "headingMd", fontWeight: "semibold", children: group.title }) }), _jsx(Grid, { columns: { xs: 1, sm: 1, md: 2, lg: 2, xl: 2 }, children: group.items.map((item) => (_jsx(Grid.Cell, { children: renderIntegrationCard(item) }, `integration-cell--${item.id || item.key}`))) })] }, `integration-group--${group.key}`))) }) }));
|
|
184
142
|
};
|
|
185
143
|
export default PartnerIntegration;
|