@muskanmeet/invoicing-design-system 0.1.0

package/.local/skills/artifacts/artifacts/automation/files/src/triggers/telegramTriggers.ts

@@ -0,0 +1,94 @@
+/**
+ * Telegram Trigger - Webhook-based Workflow Triggering
+ *
+ * This module provides Telegram bot event handling for Mastra workflows.
+ * When Telegram messages are received, this trigger starts your workflow.
+ *
+ * PATTERN:
+ * 1. Import registerTelegramTrigger and your workflow
+ * 2. Call registerTelegramTrigger with a triggerType and handler
+ * 3. Spread the result into the apiRoutes array in src/mastra/index.ts
+ *
+ * USAGE in src/mastra/index.ts:
+ *
+ * ```typescript
+ * import { registerTelegramTrigger } from "../triggers/telegramTriggers";
+ * import { telegramBotWorkflow } from "./workflows/telegramBotWorkflow";
+ * import { inngest } from "./inngest";
+ *
+ * // In the apiRoutes array:
+ * ...registerTelegramTrigger({
+ *   triggerType: "telegram/message",
+ *   handler: async (mastra, triggerInfo) => {
+ *     const run = await telegramBotWorkflow.createRun();
+ *     return await inngest.send({
+ *       name: `workflow.${telegramBotWorkflow.id}`,
+ *       data: {
+ *         runId: run?.runId,
+ *         inputData: {},
+ *       },
+ *     });
+ *   }
+ * })
+ * ```
+ */
+
+import type { ContentfulStatusCode } from "hono/utils/http-status";
+
+import { registerApiRoute } from "../mastra/inngest";
+import { Mastra } from "@mastra/core";
+
+if (!process.env.TELEGRAM_BOT_TOKEN) {
+  console.warn(
+    "Trying to initialize Telegram triggers without TELEGRAM_BOT_TOKEN. Can you confirm that the Telegram integration is configured correctly?",
+  );
+}
+
+export type TriggerInfoTelegramOnNewMessage = {
+  type: "telegram/message";
+  params: {
+    userName: string;
+    message: string;
+  };
+  payload: any;
+};
+
+export function registerTelegramTrigger({
+  triggerType,
+  handler,
+}: {
+  triggerType: string;
+  handler: (
+    mastra: Mastra,
+    triggerInfo: TriggerInfoTelegramOnNewMessage,
+  ) => Promise<void>;
+}) {
+  return [
+    registerApiRoute("/webhooks/telegram/action", {
+      method: "POST",
+      handler: async (c) => {
+        const mastra = c.get("mastra");
+        const logger = mastra.getLogger();
+        try {
+          const payload = await c.req.json();
+
+          logger?.info("📝 [Telegram] payload", payload);
+
+          await handler(mastra, {
+            type: triggerType,
+            params: {
+              userName: payload.message.from.username,
+              message: payload.message.text,
+            },
+            payload,
+          } as TriggerInfoTelegramOnNewMessage);
+
+          return c.text("OK", 200);
+        } catch (error) {
+          logger?.error("Error handling Telegram webhook:", error);
+          return c.text("Internal Server Error", 500);
+        }
+      },
+    }),
+  ];
+}

package/.local/skills/artifacts/artifacts/automation/files/tests/testCronAutomation.ts

@@ -0,0 +1,86 @@
+/**
+ * Test Script for Time-Based (Cron) Workflows
+ *
+ * This script demonstrates the CORRECT way to test time-based workflows
+ * that use Inngest for orchestration. It simulates a cron schedule firing.
+ *
+ * WHAT THIS TESTS:
+ * - Manual trigger of cron workflow (replit/cron.trigger event)
+ * - Workflow execution without waiting for schedule
+ * - Complete Inngest step-by-step orchestration
+ * - Fast feedback loop for cron automation development
+ *
+ * PREREQUISITES:
+ * 1. Start your Mastra server on the configured automation port
+ * 2. Start Inngest dev server on the configured Inngest port
+ *
+ * HOW TO RUN:
+ * npx tsx tests/testCronAutomation.ts
+ *
+ * VERIFICATION:
+ * - Check console output for success messages
+ * - Visit the local Inngest dashboard to see the execution
+ */
+
+import { inngest } from "../src/mastra/inngest/client";
+
+const AUTOMATION_PORT = process.env.PORT ?? "5000";
+const INNGEST_PORT = process.env.INNGEST_PORT ?? "3000";
+
+// ============================================================================
+// TEST FUNCTION
+// ============================================================================
+
+async function testCronTrigger() {
+  console.log(`\n${"=".repeat(70)}`);
+  console.log(`🚀 CRON AUTOMATION TEST`);
+  console.log(`${"=".repeat(70)}`);
+  console.log(`Trigger Type: Time-Based (Cron)\n`);
+
+  try {
+    /**
+     * Send an Inngest event that simulates a cron schedule firing.
+     *
+     * In production, the flow is:
+     * 1. Inngest Cloud evaluates cron expression and fires at scheduled time
+     * 2. Inngest Cloud → triggers the cron function (id: "cron-trigger")
+     * 3. Cron function → starts workflow with empty inputData
+     * 4. Workflow → orchestrated by Inngest step-by-step
+     *
+     * This test simulates step 1-2, allowing you to test your cron workflow
+     * immediately without waiting for the actual schedule.
+     *
+     * Note: The cron function also listens to this manual trigger event,
+     * so you can test at any time during development.
+     */
+    await inngest.send({
+      // Event name that cron triggers listen for (see registerCronWorkflow)
+      name: "replit/cron.trigger",
+
+      // Cron workflows don't receive external input, so data is empty
+      data: {},
+    });
+
+    console.log(`✅ Cron trigger event sent successfully!`);
+    console.log(`\n📊 Check execution at: http://localhost:${INNGEST_PORT}`);
+    console.log(`   - Functions tab: Look for "cron-trigger"`);
+    console.log(`   - Runs tab: See the complete execution trace`);
+    console.log(
+      `\n💡 TIP: Your workflow will execute immediately, no need to wait for the schedule!\n`,
+    );
+  } catch (error) {
+    console.error("❌ Error sending Inngest event:", error);
+    console.error("\nTroubleshooting:");
+    console.error(`  1. Is your Mastra server running? (npm start)`);
+    console.error(
+      `  2. Is Inngest dev server running? (inngest dev -u http://localhost:${AUTOMATION_PORT}/api/inngest --port ${INNGEST_PORT})`,
+    );
+    console.error(
+      "  3. Is registerCronTrigger called in src/mastra/index.ts?\n",
+    );
+    process.exit(1);
+  }
+}
+
+// Run the test
+testCronTrigger();

package/.local/skills/artifacts/artifacts/automation/files/tests/testWebhookAutomation.ts

@@ -0,0 +1,118 @@
+/**
+ * Test Script for Webhook-Triggered Workflows
+ *
+ * This script demonstrates the CORRECT way to test webhook-triggered workflows
+ * that use Inngest for orchestration. It simulates the complete production flow.
+ *
+ * WHAT THIS TESTS:
+ * - Inngest event routing (event/api.webhooks.{provider}.action)
+ *   Note: Slack/Telegram use event/api.webhooks.webhooks.action due to /webhooks/{provider}/action path
+ * - The forwarding function created by registerApiRoute
+ * - HTTP forwarding to your webhook handler (e.g., /linear/webhook)
+ * - Webhook payload validation in your handler
+ * - Workflow triggering via workflow.start()
+ * - Complete Inngest step-by-step orchestration
+ *
+ * PREREQUISITES:
+ * 1. Start your Mastra server with restart_workflow tool
+ * 2. Start Inngest dev server with restart_workflow tool
+ *
+ * HOW TO RUN:
+ * npx tsx tests/testWebhookAutomation.ts
+ *
+ * VERIFICATION:
+ * - Check console output for success messages
+ * - Visit the local Inngest dashboard to see execution
+ */
+
+import { inngest } from "../src/mastra/inngest/client";
+
+const AUTOMATION_PORT = process.env.PORT ?? "5000";
+const INNGEST_PORT = process.env.INNGEST_PORT ?? "3000";
+
+// ============================================================================
+// CONFIGURATION - Update these based on your webhook automation
+// ============================================================================
+
+// Change this to match your connector name
+const PROVIDER: string = "linear"; // e.g., "linear", "github", etc
+
+// Mock webhook payload - This **must** match your connector's webhook schema.
+// Keep data obviously fake (use "MOCK:" prefixes, fake IDs like "mock-123")
+const mockWebhookPayload = {
+  action: "create", // Linear webhook action (create/update/remove)
+  type: "Issue", // Linear webhook type (Issue/Comment/Project)
+  data: {
+    id: "mock-issue-999",
+    title: "MOCK: Test Issue for Validation",
+    description: "MOCK: This is test data to validate the webhook flow",
+    number: 999,
+    priority: 1,
+    createdAt: "2025-01-01T00:00:00Z",
+    updatedAt: "2025-01-01T00:00:00Z",
+  },
+  createdAt: "2025-01-01T00:00:00Z",
+  organizationId: "mock-org-123",
+};
+
+// ============================================================================
+// TEST FUNCTION
+// ============================================================================
+
+async function testWebhookTrigger() {
+  console.log(`\n${"=".repeat(70)}`);
+  console.log(`🚀 WEBHOOK AUTOMATION TEST`);
+  console.log(`${"=".repeat(70)}`);
+  console.log(`Provider: ${PROVIDER}\n`);
+
+  try {
+    /**
+     * Send an Inngest event that simulates what Replit Webhook Service sends in production.
+     *
+     * In production, the flow is:
+     * 1. External webhook → Replit Webhook Service
+     * 2. Replit transforms it → Inngest Cloud (sends event/api.webhooks.{provider}.action)
+     * 3. Inngest Cloud → triggers the forwarding function (id: "api-{provider}")
+     * 4. Forwarding function → POSTs to your webhook handler (/{provider}/webhook)
+     * 5. Webhook handler → validates payload and starts workflow
+     * 6. Workflow → orchestrated by Inngest step-by-step
+     *
+     * This test simulates step 2, exercising the complete flow from there.
+     */
+
+    const eventName = `event/api.webhooks.${PROVIDER}.action`;
+
+    await inngest.send({
+      // Event name must match what registerApiRoute creates an Inngest function to listen for
+      name: eventName,
+
+      // Data structure matches what Replit Webhook Service sends to Inngest
+      data: {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify(mockWebhookPayload),
+      },
+    });
+
+    console.log(`✅ Event sent successfully for ${PROVIDER}!`);
+    console.log(`\n📊 Check execution at: http://localhost:${INNGEST_PORT}`);
+    console.log(
+      `   - Functions tab: Look for "api-${PROVIDER}" (the forwarding function)`,
+    );
+    console.log(`   - Runs tab: See the complete execution trace\n`);
+  } catch (error) {
+    console.error("❌ Error sending Inngest event:", error);
+    console.error("\nTroubleshooting:");
+    console.error("  1. Is your Mastra server running? (npm start)");
+    console.error(
+      `  2. Is Inngest dev server running? (inngest dev -u http://localhost:${AUTOMATION_PORT}/api/inngest --port ${INNGEST_PORT})`,
+    );
+    console.error(
+      "  3. Is the webhook handler registered in src/mastra/index.ts?\n",
+    );
+    process.exit(1);
+  }
+}
+
+// Run the test
+testWebhookTrigger();

package/.local/skills/artifacts/artifacts/automation/files/tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "include": [
+    "src/**/*",
+    "tests/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "build",
+    "dist",
+    "**/*.test.ts"
+  ],
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ES2022",
+    "moduleResolution": "bundler",
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "skipLibCheck": true,
+    "noEmit": true,
+    "types": [
+      "node"
+    ]
+  }
+}

package/.local/skills/artifacts/artifacts/data-visualization/artifact.yaml

@@ -0,0 +1,48 @@
+name: data-visualization
+description: "data visualization scaffold (dashboards, analysis reports, dataset explorers) with chart/table defaults"
+kind: data-app
+priority: 10
+
+access:
+  type: all_of
+  conditions:
+    - type: any_of
+      conditions:
+        - type: stack
+          name: PNPM_WORKSPACE
+        - type: dot_replit_version
+          version: "2.0.0"
+    - type: not
+      condition:
+        type: deployment_target
+        name: databricks_app
+
+service_configs:
+  - name: web
+    development:
+      run: pnpm --filter @workspace/__SLUG__ run dev
+    production:
+      serve: static
+      build:
+        - pnpm
+        - --filter
+        - "@workspace/__SLUG__"
+        - run
+        - build
+      publicDir: artifacts/__SLUG__/dist/public
+      rewrites:
+        - from: "/*"
+          to: /index.html
+
+initial_open_files:
+  - src/main.tsx
+  - src/App.tsx
+  - src/index.css
+  - /lib/api-spec/openapi.yaml
+  - /lib/db/src/index.ts
+  - /lib/db/src/schema/index.ts
+  - /artifacts/api-server/src/index.ts
+  - /artifacts/api-server/package.json
+
+additional_skills:
+  - database

package/.local/skills/artifacts/artifacts/expo/OWNERS

@@ -0,0 +1,2 @@
+@replit/ai-infra-reviewers-agent
+@replit/mobile

package/.local/skills/artifacts/artifacts/expo/artifact.yaml

@@ -0,0 +1,47 @@
+name: expo
+description: "mobile app"
+kind: mobile
+priority: 2
+
+access:
+  type: stack
+  name: PNPM_WORKSPACE
+
+bootstrap_constraints: |
+  ### Mobile bootstrap rules (`artifact: "expo"`)
+
+  - Expo now uses the shared Express API server in the monorepo. Add backend routes in `artifacts/api-server`.
+  - The generated package owns its Expo dependencies; keep them in `files/package.json.template` so `pnpm install` produces a runnable app.
+
+service_configs:
+  - name: expo
+    ensurePreviewReachable: /status
+    development:
+      run: pnpm --filter @workspace/__SLUG__ run dev
+    production:
+      build:
+        - pnpm
+        - --filter
+        - '@workspace/__SLUG__'
+        - run
+        - build
+      run:
+        - pnpm
+        - --filter
+        - '@workspace/__SLUG__'
+        - run
+        - serve
+
+initial_open_files:
+  - app.json
+  - constants/colors.ts
+  - app/_layout.tsx
+  - app/(tabs)/_layout.tsx
+  - app/(tabs)/index.tsx
+  - /lib/api-spec/openapi.yaml
+  - /artifacts/api-server/src/index.ts
+  - /artifacts/api-server/package.json
+
+additional_skills:
+  - media-generation
+  - references/first_build.md

package/.local/skills/artifacts/artifacts/expo/files/app/(tabs)/_layout.tsx

@@ -0,0 +1,86 @@
+import { BlurView } from "expo-blur";
+import { isLiquidGlassAvailable } from "expo-glass-effect";
+import { Tabs } from "expo-router";
+import { Icon, Label, NativeTabs } from "expo-router/unstable-native-tabs";
+import { SymbolView } from "expo-symbols";
+import { Feather } from "@expo/vector-icons";
+import React from "react";
+import { Platform, StyleSheet, View, useColorScheme } from "react-native";
+
+import { useColors } from "@/hooks/useColors";
+
+// IMPORTANT: iOS 26 uses NativeTabs for native tabs with liquid glass support.
+// NativeTabs intentionally does NOT use custom design tokens — liquid glass
+// is a system-level appearance provided by iOS and cannot be overridden.
+// Custom brand colors are applied only on the ClassicTabLayout path (older iOS / Android / web).
+function NativeTabLayout() {
+  return (
+    <NativeTabs>
+      <NativeTabs.Trigger name="index">
+        <Icon sf={{ default: "house", selected: "house.fill" }} />
+        <Label>Home</Label>
+      </NativeTabs.Trigger>
+    </NativeTabs>
+  );
+}
+
+function ClassicTabLayout() {
+  const colors = useColors();
+  const colorScheme = useColorScheme();
+  const isDark = colorScheme === "dark";
+  const isIOS = Platform.OS === "ios";
+  const isWeb = Platform.OS === "web";
+
+  return (
+    <Tabs
+      screenOptions={{
+        tabBarActiveTintColor: colors.primary,
+        tabBarInactiveTintColor: colors.mutedForeground,
+        headerShown: true,
+        tabBarStyle: {
+          position: "absolute",
+          backgroundColor: isIOS ? "transparent" : colors.background,
+          borderTopWidth: isWeb ? 1 : 0,
+          borderTopColor: colors.border,
+          elevation: 0,
+          ...(isWeb ? { height: 84 } : {}),
+        },
+        tabBarBackground: () =>
+          isIOS ? (
+            <BlurView
+              intensity={100}
+              tint={isDark ? "dark" : "light"}
+              style={StyleSheet.absoluteFill}
+            />
+          ) : isWeb ? (
+            <View
+              style={[
+                StyleSheet.absoluteFill,
+                { backgroundColor: colors.background },
+              ]}
+            />
+          ) : null,
+      }}
+    >
+      <Tabs.Screen
+        name="index"
+        options={{
+          title: "Home",
+          tabBarIcon: ({ color }) =>
+            isIOS ? (
+              <SymbolView name="house" tintColor={color} size={24} />
+            ) : (
+              <Feather name="home" size={22} color={color} />
+            ),
+        }}
+      />
+    </Tabs>
+  );
+}
+
+export default function TabLayout() {
+  if (isLiquidGlassAvailable()) {
+    return <NativeTabLayout />;
+  }
+  return <ClassicTabLayout />;
+}

package/.local/skills/artifacts/artifacts/expo/files/app/(tabs)/index.tsx

@@ -0,0 +1,28 @@
+import { StyleSheet, Text, View } from "react-native";
+
+export default function TabOneScreen() {
+  return (
+    <View style={styles.container}>
+      <Text style={styles.title}>Replit Agent is building...</Text>
+      <Text style={styles.text}>Your app will appear here once it's ready.</Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 8,
+  },
+  title: {
+    fontSize: 20,
+    fontWeight: "bold",
+  },
+  text: {
+    fontSize: 16,
+    textAlign: "center",
+    paddingHorizontal: 20,
+  },
+});

package/.local/skills/artifacts/artifacts/expo/files/app/+not-found.tsx

@@ -0,0 +1,45 @@
+import { Link, Stack } from "expo-router";
+import { StyleSheet, Text, View } from "react-native";
+
+import { useColors } from "@/hooks/useColors";
+
+export default function NotFoundScreen() {
+  const colors = useColors();
+
+  return (
+    <>
+      <Stack.Screen options={{ title: "Oops!" }} />
+      <View style={[styles.container, { backgroundColor: colors.background }]}>
+        <Text style={[styles.title, { color: colors.foreground }]}>
+          This screen doesn&apos;t exist.
+        </Text>
+
+        <Link href="/" style={styles.link}>
+          <Text style={[styles.linkText, { color: colors.primary }]}>
+            Go to home screen!
+          </Text>
+        </Link>
+      </View>
+    </>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    padding: 20,
+  },
+  title: {
+    fontSize: 20,
+    fontWeight: "bold",
+  },
+  link: {
+    marginTop: 15,
+    paddingVertical: 15,
+  },
+  linkText: {
+    fontSize: 14,
+  },
+});

package/.local/skills/artifacts/artifacts/expo/files/app/_layout.tsx

@@ -0,0 +1,60 @@
+import {
+  Inter_400Regular,
+  Inter_500Medium,
+  Inter_600SemiBold,
+  Inter_700Bold,
+  useFonts,
+} from "@expo-google-fonts/inter";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { Stack } from "expo-router";
+import * as SplashScreen from "expo-splash-screen";
+import React, { useEffect } from "react";
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+import { KeyboardProvider } from "react-native-keyboard-controller";
+import { SafeAreaProvider } from "react-native-safe-area-context";
+
+import { ErrorBoundary } from "@/components/ErrorBoundary";
+
+// Prevent the splash screen from auto-hiding before asset loading is complete.
+SplashScreen.preventAutoHideAsync();
+
+const queryClient = new QueryClient();
+
+function RootLayoutNav() {
+  return (
+    <Stack screenOptions={{ headerBackTitle: "Back" }}>
+      <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
+    </Stack>
+  );
+}
+
+export default function RootLayout() {
+  const [fontsLoaded, fontError] = useFonts({
+    Inter_400Regular,
+    Inter_500Medium,
+    Inter_600SemiBold,
+    Inter_700Bold,
+  });
+
+  useEffect(() => {
+    if (fontsLoaded || fontError) {
+      SplashScreen.hideAsync();
+    }
+  }, [fontsLoaded, fontError]);
+
+  if (!fontsLoaded && !fontError) return null;
+
+  return (
+    <SafeAreaProvider>
+      <ErrorBoundary>
+        <QueryClientProvider client={queryClient}>
+          <GestureHandlerRootView>
+            <KeyboardProvider>
+              <RootLayoutNav />
+            </KeyboardProvider>
+          </GestureHandlerRootView>
+        </QueryClientProvider>
+      </ErrorBoundary>
+    </SafeAreaProvider>
+  );
+}

package/.local/skills/artifacts/artifacts/expo/files/app.json.template

@@ -0,0 +1,38 @@
+{
+  "expo": {
+    "name": "__REPLIT_ARTIFACT_TITLE__",
+    "slug": "__REPLIT_ARTIFACT_SLUG__",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/images/icon.png",
+    "scheme": "__REPLIT_ARTIFACT_SLUG__",
+    "userInterfaceStyle": "automatic",
+    "newArchEnabled": true,
+    "splash": {
+      "image": "./assets/images/icon.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": false
+    },
+    "android": {},
+    "web": {
+      "favicon": "./assets/images/icon.png"
+    },
+    "plugins": [
+      [
+        "expo-router",
+        {
+          "origin": "https://replit.com/"
+        }
+      ],
+      "expo-font",
+      "expo-web-browser"
+    ],
+    "experiments": {
+      "typedRoutes": true,
+      "reactCompiler": true
+    }
+  }
+}