create-auto-app 0.9.11 → 0.9.13

package/templates/finance-app/.context/shadcn-filter.ts

@@ -0,0 +1,29 @@
+export function filter(components) {
+  const seen = new Set<string>();
+
+  return components
+    .map((comp) => {
+      if (!comp?.name) return null;
+
+      let str = comp.name.trim();
+
+      // Normalize the name
+      str = str.includes('/') ? str.split('/')[0].trim() : str.split(' ')[0].trim();
+
+      if (!str) return null;
+
+      // Capitalize first letter
+      str = str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
+
+      return {
+        ...comp,
+        name: str.toLowerCase(),
+      };
+    })
+    .filter((c) => {
+      if (!c) return false;
+      if (seen.has(c.name)) return false;
+      seen.add(c.name);
+      return true;
+    });
+}

package/templates/finance-app/auto.config.ts

@@ -0,0 +1,180 @@
+import { autoConfig, on, dispatch, fold } from '@auto-engineer/cli';
+import type { ExportSchemaCommand, ExportSchemaEvents } from '@auto-engineer/flow';
+import type { GenerateServerCommand, GenerateServerEvents } from '@auto-engineer/server-generator-apollo-emmett';
+import type { ImplementServerCommand, ImplementServerEvents } from '@auto-engineer/server-implementer';
+import type {
+  CheckTestsCommand,
+  CheckTestsEvents,
+  CheckTypesCommand,
+  CheckTypesEvents,
+  CheckLintCommand,
+  CheckLintEvents,
+  TestsCheckFailedEvent,
+} from '@auto-engineer/server-checks';
+import type { GenerateIACommand, GenerateIAEvents } from '@auto-engineer/information-architect';
+import type { ImplementClientCommand, ImplementClientEvents } from '@auto-engineer/frontend-implementer';
+import type { GenerateClientCommand, GenerateClientEvents } from '@auto-engineer/frontend-generator-react-graphql';
+
+export default autoConfig({
+  fileId: 'test33333', // unique 9-character base62 canvas file id where all flows in this project will be shown
+
+  plugins: [
+    '@auto-engineer/server-checks',
+    '@auto-engineer/design-system-importer',
+    '@auto-engineer/server-generator-apollo-emmett',
+    '@auto-engineer/flow',
+    '@auto-engineer/frontend-checks',
+    '@auto-engineer/frontend-implementer',
+    '@auto-engineer/information-architect',
+    '@auto-engineer/frontend-generator-react-graphql',
+    '@auto-engineer/server-implementer',
+  ],
+  aliases: {
+    // Resolve command name conflicts between packages
+    // 'test:types': checkTypesCommandHandler,
+  },
+  pipeline: () => {
+    on<ExportSchemaEvents>('SchemaExported', () =>
+      dispatch<GenerateIACommand>({
+        type: 'GenerateIA',
+        data: {
+          outputDir: './.context',
+          flowFiles: ['./flows/finance-app.flow.ts', './flows/finance-app-landing.flow.ts'],
+        },
+      }),
+    );
+
+    // on<GenerateServerEvents>('ServerGenerated', () =>
+    //   dispatch<GenerateIACommand>({
+    //     type: 'GenerateIA',
+    //     data: {
+    //       outputDir: './.context',
+    //       flowFiles: ['./flows/finance-app.flow.ts', './flows/finance-app-landing.flow.ts'],
+    //     },
+    //   }),
+    // );
+
+    on<GenerateIAEvents>('IAGenerated', () =>
+      dispatch<GenerateClientCommand>({
+        type: 'GenerateClient',
+        data: {
+          starterDir: '../../packages/frontend-generator-react-graphql/shadcn-starter',
+          targetDir: './client',
+          iaSchemaPath: './.context/auto-ia-scheme.json',
+          gqlSchemaPath: './.context/schema.graphql',
+          figmaVariablesPath: './.context/figma-variables.json',
+        },
+      }),
+    );
+
+    on<GenerateClientEvents>('ClientGenerated', () =>
+      dispatch<ImplementClientCommand>({
+        type: 'ImplementClient',
+        data: {
+          projectDir: './client',
+          iaSchemeDir: './.context',
+          designSystemPath: './.context/design-system.md',
+        },
+      }),
+    );
+
+    // on<ImplementServerEvents>('SliceImplemented', () => {
+    //   dispatch<CheckTestsCommand>({
+    //     type: 'CheckTests',
+    //     data: {
+    //       targetDirectory: 'sds',
+    //       scope: 'slice',
+    //     },
+    //   });
+    // });
+
+    // on<ImplementServerEvents>('SliceImplemented', () => {
+    //   dispatch<CheckTypesCommand>({
+    //     type: 'CheckTypes',
+    //     data: {
+    //       targetDirectory: 'sds',
+    //       scope: 'slice',
+    //     },
+    //   });
+    // });
+
+    // on<ImplementServerEvents>('SliceImplemented', () => {
+    //   dispatch<CheckLintCommand>({
+    //     type: 'CheckLint',
+    //     data: {
+    //       targetDirectory: 'sds',
+    //       scope: 'slice',
+    //       fix: true,
+    //     },
+    //   });
+    // });
+
+    // on.settled<CheckTestsCommand, CheckTypesCommand, CheckLintCommand>(
+    //   ['CheckTests', 'CheckTypes', 'CheckLint'],
+    //   (events) => {
+    //     const hasFailures =
+    //       events.CheckTests.some((e: CheckTestsEvents) => e.type === 'TestsCheckFailed') ||
+    //       events.CheckTypes.some((e: CheckTypesEvents) => e.type === 'TypeCheckFailed') ||
+    //       events.CheckLint.some((e: CheckLintEvents) => e.type === 'LintCheckFailed');
+
+    //     if (hasFailures) {
+    //       dispatch<ImplementClientCommand>({
+    //         type: 'ImplementClient',
+    //         data: {
+    //           projectDir: 'some/where',
+    //           iaSchemeDir: '/',
+    //           designSystemPath: '',
+    //           failures: [],
+    //         },
+    //       });
+    //     }
+    //   },
+    // );
+  },
+});
+
+/*
+
+rm -rf server client .context/schema.json .context/schema.graphql .context/auto-ia-scheme.json 
+pnpm auto export:schema
+pnpm auto generate:ia --output-dir=./.context --flow-files=./flows/questionnaires.flow.ts
+pnpm auto generate:server --schema-path=./.context/schema.json --destination=.
+pnpm auto generate:client --starter-dir=../../packages/frontend-generator-react-graphql/shadcn-starter --target-dir=./client  --ia-schema-path=./.context/auto-ia-scheme.json  --gql-schema-path=./.context/schema.graphql  --figma-variables-path=./.context/figma-variables.json
+pnpm auto implement:client --project-dir=./questionnaires/client --ia-scheme-dir=./questionnaires/.context --design-system-path=./questionnaires/.context/design-system.md
+
+
+// make this emit one slice at a time
+pnpm auto generate:server --schema-path=./.context/schema.json --destination=.
+
+// TODO remove the AI part and make it mathematical
+pnpm auto generate:client --starter-dir=/Users/sam/WebstormProjects/top/auto-engineer/packages/frontend-generator-react-graphql/shadcn-starter  --target-dir=./client  --ia-schema-path=./.context/auto-ia-scheme.json  --gql-schema-path=./.context/schema.graphql  --figma-variables-path=./.context/figma-variables.json
+
+// run this per slice in parallel
+pnpm auto implement:slice --slice-path=./questionnaires/server/src/domain/flows/questionnaires/submits-the-questionnaire
+// add checks
+// add retry logic tore-implement failed slices with a retry count
+
+// slice these up
+pnpm auto implement:client --project-dir=./questionnaires/client --ia-scheme-dir=./questionnaires/.context --design-system-path=./questionnaires/.context/design-system.md
+
+
+// implement atoms in parallel - how do I know all atoms are done?
+// implement molecules in parallel - how do I know all molecules are done?
+// implement organisms in parallel - how do I know all organisms are done?
+// implement pages in parallel - how do I know all pages are done?
+
+
+// generate slice > implement slice > check slice > retry failure 3 times > 
+// generate slice > implement slice > check slice > retry failure 3 times > 
+// generate slice > implement slice > check slice > retry failure 3 times > 
+
+cd ~/WebstormProjects/top/auto-engineer/examples/questionnaires &&\
+pnpm -w build &&\
+rm -rf server client .context/schema.json .context/schema.graphql .context/auto-ia-scheme.json &&\
+DEBUG=* pnpm auto export:schema &&\
+DEBUG=* pnpm auto generate:server --schema-path=./.context/schema.json --destination=. &&\
+DEBUG=* pnpm auto generate:ia --output-dir=./.context --flow-files=./flows/questionnaires.flow.ts &&\
+DEBUG=* pnpm auto generate:client --starter-dir=../../packages/frontend-generator-react-graphql/shadcn-starter --target-dir=./client  --ia-schema-path=./.context/auto-ia-scheme.json  --gql-schema-path=./.context/schema.graphql  --figma-variables-path=./.context/figma-variables.json
+
+
+*/

package/templates/finance-app/flows/app-homepage.flow.ts

@@ -0,0 +1,84 @@
+import { experience, flow, specs, should } from '@auto-engineer/flow';
+
+flow('Micro Personal Finance App', () => {
+  // Main App Shell with sidebar layout
+  experience('App Structure').client(() => {
+    specs(() => {
+      should('display persistent sidebar on left for navigation');
+      should('sidebar includes links: Home, Add Expense, Charts, Subscriptions, Savings Jar, Budget, Expense History');
+      should('highlight current active link in sidebar');
+      should('sidebar collapsible for smaller screens');
+      should('top bar includes app logo, profile menu, and notifications icon');
+      should(
+        'bottom or top persistent bar shows global widgets: total spending, remaining budget, savings jar progress',
+      );
+      should('content area changes dynamically based on selected navigation link');
+      should('maintain layout consistency across all screens');
+      should('support responsive design with sidebar collapsing into hamburger menu on mobile');
+    });
+  });
+
+  // Experiences under App Shell
+  experience('Home Screen').client(() => {
+    specs(() => {
+      should('show today’s spending summary and remaining budget');
+      should('display recent expenses list');
+      should('show visual progress of savings jar goal');
+      should('quick access buttons for Add Expense, Charts, Subscriptions');
+    });
+  });
+
+  experience('Add Expense').client(() => {
+    specs(() => {
+      should('allow entering expense amount, category, and note');
+      should('show recent/frequent categories for quick selection');
+      should('display confirmation toast after adding expense');
+      should('update budget bar and charts in real-time');
+    });
+  });
+
+  experience('Spending Charts').client(() => {
+    specs(() => {
+      should('show daily and weekly spending charts');
+      should('highlight categories with highest spend');
+      should('allow filtering by category or date range');
+      should('update dynamically when new expenses are added');
+    });
+  });
+
+  experience('Manage Subscriptions').client(() => {
+    specs(() => {
+      should('list all active subscriptions with amount and renewal date');
+      should('allow adding, editing, and removing subscriptions');
+      should('show monthly summary of subscription spending');
+      should('highlight upcoming renewals');
+    });
+  });
+
+  experience('Round-Up Savings Jar').client(() => {
+    specs(() => {
+      should('show current total and goal progress');
+      should('allow changing the savings goal');
+      should('automatically round up new expenses');
+      should('display visual progress bar consistently in shell');
+    });
+  });
+
+  experience('Budget Tracker').client(() => {
+    specs(() => {
+      should('allow setting monthly/weekly budget');
+      should('show remaining budget as a progress bar');
+      should('highlight overspending');
+      should('update in real-time when expenses are added');
+    });
+  });
+
+  experience('Expense Detail').client(() => {
+    specs(() => {
+      should('allow viewing full expense history');
+      should('filter by category, date, or amount');
+      should('edit or delete individual expenses');
+      should('show contribution of each expense to daily/weekly/monthly totals');
+    });
+  });
+});

package/templates/finance-app/flows/landing-page.flow.ts

@@ -0,0 +1,34 @@
+import { experience, flow, should, specs } from '@auto-engineer/flow';
+flow('Micro Personal Finance App - Landing', 'AUTO-z8hpgv8UU', () => {
+  experience('Landing Page', 'AUTO-Ke1xAjRsI').client(() => {
+    specs('', () => {
+      should('display app name and tagline prominently at top of page');
+      should('show a hero image or illustration representing personal finance');
+      should('include a primary call-to-action button to "Get Started" or "Sign Up"');
+      should('include a secondary CTA to "Learn More"');
+      should(
+        'list core features with icons: expense tracking, subscriptions, round-up savings, budget tracking, charts',
+      );
+      should('display brief descriptions under each feature');
+      should('support horizontal scrolling or 3-column layout for desktop, stacked for mobile');
+      should('show 2-3 user testimonials with names, photos, and quotes');
+      should('highlight real benefits users have gained using the app');
+      should('display simple pricing plans: Free, Premium');
+      should('show plan features in a table or card layout');
+      should('include CTA buttons for each plan: "Start Free" or "Upgrade"');
+      should('include links to About, FAQ, Terms of Service, Privacy Policy, and Contact');
+      should('display social media icons for Twitter, LinkedIn, etc.');
+      should('support smooth scrolling to sections when clicking navigation links');
+      should('be fully responsive for desktop, tablet, and mobile');
+    });
+  });
+  experience('Onboarding', 'AUTO-krmQIPP30').client(() => {
+    specs('', () => {
+      should('allow user to set initial monthly budget');
+      should('allow adding first expense');
+      should('allow setting initial savings jar goal');
+      should('show visual progress indicators as steps are completed');
+      should('allow skipping onboarding to go directly to main app');
+    });
+  });
+});

package/templates/finance-app/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "personal-finance-app",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "auto": "node ../../packages/cli/dist/bin/auto.js",
+    "auto:debug": "DEBUG=flow:*,cli:*,auto*,ai*,-*file-syncer,-*flow* node ../../packages/cli/dist/bin/auto.js",
+    "start": "dotenv -e .env -- pnpm --parallel start"
+  },
+  "dependencies": {
+    "@auto-engineer/cli": "workspace:*",
+    "@auto-engineer/design-system-importer": "workspace:*",
+    "@auto-engineer/flow": "workspace:*",
+    "@auto-engineer/frontend-checks": "workspace:*",
+    "@auto-engineer/frontend-generator-react-graphql": "workspace:*",
+    "@auto-engineer/frontend-implementer": "workspace:*",
+    "@auto-engineer/information-architect": "workspace:*",
+    "@auto-engineer/message-bus": "workspace:*",
+    "@auto-engineer/server-checks": "workspace:*",
+    "@auto-engineer/server-generator-apollo-emmett": "workspace:*",
+    "@auto-engineer/server-implementer": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/node": "^24.3.1",
+    "chokidar": "^3.6.0",
+    "dotenv": "^16.4.5",
+    "dotenv-cli": "^9.0.0",
+    "tsx": "^3.12.7"
+  }
+}