update ui changes

src/features/settings/components/IntegrationsGrid.tsx

@@ -10,6 +10,7 @@ import {Button} from '@astryxdesign/core/Button';
 import {TextInput} from '@astryxdesign/core/TextInput';
 import {useToast} from '@astryxdesign/core/Toast';
 import {StaticPanel} from '@/shared/components/patterns/PanelCard';
+import {SAMPLE_INTEGRATIONS} from '@/shared/mocks/sampleData';
 
 export interface IntegrationApp {
   id: string;
@@ -21,69 +22,9 @@ export interface IntegrationApp {
   lastSync?: string;
 }
 
-const INITIAL_APPS: IntegrationApp[] = [
-  {
-    id: 'shopify',
-    name: 'Shopify Storefront',
-    category: 'E-commerce POS',
-    description: 'Sync online customer orders, cart totals and auto-issue LYT points.',
-    status: 'connected',
-    apiKeyLabel: 'myshopify-store.myshopify.com',
-    lastSync: '5 mins ago',
-  },
-  {
-    id: 'woocommerce',
-    name: 'WooCommerce',
-    category: 'E-commerce POS',
-    description: 'WordPress store integration for online checkout redemption.',
-    status: 'disconnected',
-  },
-  {
-    id: 'razorpay',
-    name: 'Razorpay PG',
-    category: 'Payment Gateway',
-    description: 'Automated settlement reconciliation and online UPI payment sync.',
-    status: 'connected',
-    apiKeyLabel: 'rzp_live_••••••••8841',
-    lastSync: 'Just now',
-  },
-  {
-    id: 'stripe',
-    name: 'Stripe Billing',
-    category: 'Payment Gateway',
-    description: 'International cards and subscription recurring billing handler.',
-    status: 'disconnected',
-  },
-  {
-    id: 'whatsapp',
-    name: 'WhatsApp Business API',
-    category: 'Messaging Channel',
-    description: 'Send instant transaction receipts, reward expiry notices and OTPs.',
-    status: 'connected',
-    apiKeyLabel: '+91 98450 12345 (Verified)',
-    lastSync: '2 mins ago',
-  },
-  {
-    id: 'google',
-    name: 'Google Business Profile',
-    category: 'Local Search & Maps',
-    description: 'Sync branch operating hours, store locations and customer reviews.',
-    status: 'connected',
-    apiKeyLabel: '5 locations synced',
-    lastSync: '1 hour ago',
-  },
-  {
-    id: 'meta',
-    name: 'Meta Ads & Conversions',
-    category: 'Marketing & Ads',
-    description: 'Track ad attribution, return on ad spend (ROAS) and retargeting.',
-    status: 'disconnected',
-  },
-];
-
 export function IntegrationsGrid() {
   const toast = useToast();
-  const [apps, setApps] = useState<IntegrationApp[]>(INITIAL_APPS);
+  const [apps, setApps] = useState<IntegrationApp[]>(SAMPLE_INTEGRATIONS);
   const [selectedApp, setSelectedApp] = useState<IntegrationApp | null>(null);
   const [apiKeyInput, setApiKeyInput] = useState('');