diff --git a/servers/toast/README.md b/servers/toast/README.md new file mode 100644 index 0000000..c60cef6 --- /dev/null +++ b/servers/toast/README.md @@ -0,0 +1,317 @@ +# Toast MCP Server + +Complete Model Context Protocol (MCP) server for Toast restaurant POS and management platform integration. + +## πŸš€ Features + +### 50+ Tools Across 10 Categories + +1. **Orders (12 tools)** - Complete order lifecycle management + - Get, list, create, void orders + - Search by customer, business date + - Add/void selections, apply discounts + - Update promised times, track status + +2. **Menus (11 tools)** - Full menu and item management + - List/get menus, groups, items + - Search items, update pricing + - 86 management (out of stock) + - Bulk operations + +3. **Employees (9 tools)** - Staff management + - Employee CRUD operations + - Job position management + - Search and filtering + - Time entry tracking + +4. **Labor (6 tools)** - Workforce analytics + - Shift management + - Active shift tracking + - Labor reports and summaries + - Employee hours calculation + +5. **Restaurant (9 tools)** - Configuration and settings + - Restaurant info and access + - Tables and service areas + - Dining options, revenue centers + - Online ordering and delivery settings + +6. **Payments (6 tools)** - Transaction management + - Payment CRUD operations + - Refunds and voids + - Payment summaries by type + +7. **Inventory (5 tools)** - Stock management + - Stock level tracking + - Low stock alerts + - Quantity updates + - Bulk operations + +8. **Customers (4 tools)** - Customer relationship management + - Customer search and profiles + - Order history + - Loyalty program integration + - Top customers analysis + +9. **Reporting (6 tools)** - Analytics and insights + - Sales summaries + - Hourly breakdown + - Item sales reports + - Payment type, discount, and void reports + +10. **Cash (8 tools)** - Cash management + - Cash drawer tracking + - Paid in/out entries + - Deposit recording + - Drawer summaries + +### 18 React Apps (Client-Side UI) + +**Orders & Service:** +- Order Dashboard - Real-time monitoring +- Order Detail - Deep order inspection +- Order Grid - Multi-order management +- Table Map - Visual floor plan + +**Menu Management:** +- Menu Manager - Full menu editing +- Menu Item Detail - Item configuration +- Menu Performance - Sales analytics + +**Staff & Labor:** +- Employee Dashboard - Staff directory +- Employee Schedule - Shift planning +- Labor Dashboard - Cost tracking +- Tip Summary - Earnings distribution + +**Payments & Finance:** +- Payment History - Transaction log +- Sales Dashboard - Comprehensive metrics +- Revenue by Hour - Hourly analysis + +**Inventory & Operations:** +- Inventory Tracker - Stock management +- Restaurant Overview - System config + +**Customer Management:** +- Customer Detail - Profiles and history +- Customer Loyalty - Rewards tracking + +## πŸ“¦ Installation + +```bash +npm install @busybee3333/toast-mcp-server +``` + +Or clone and build locally: + +```bash +git clone https://github.com/BusyBee3333/mcpengine.git +cd mcpengine/servers/toast +npm install +npm run build +``` + +## πŸ”§ Configuration + +Set required environment variables: + +```bash +export TOAST_CLIENT_ID="your_client_id" +export TOAST_CLIENT_SECRET="your_client_secret" +export TOAST_RESTAURANT_GUID="your_restaurant_guid" # Optional +export TOAST_ENVIRONMENT="production" # or "sandbox" +``` + +## 🎯 Usage + +### Stdio Mode (MCP Integration) + +```bash +toast-mcp-server +``` + +Or via npx: + +```bash +npx @busybee3333/toast-mcp-server +``` + +### HTTP Mode (Web UI + API) + +```bash +TOAST_MCP_MODE=http TOAST_MCP_PORT=3000 toast-mcp-server +``` + +Access UI at: `http://localhost:3000/apps/` + +### Claude Desktop Integration + +Add to your Claude Desktop config (`~/Library/Application Support/Claude/claude_desktop_config.json`): + +```json +{ + "mcpServers": { + "toast": { + "command": "npx", + "args": [ + "@busybee3333/toast-mcp-server" + ], + "env": { + "TOAST_CLIENT_ID": "your_client_id", + "TOAST_CLIENT_SECRET": "your_client_secret", + "TOAST_RESTAURANT_GUID": "your_restaurant_guid", + "TOAST_ENVIRONMENT": "production" + } + } + } +} +``` + +## πŸ› οΈ Tool Examples + +### Get Order +```json +{ + "name": "toast_get_order", + "arguments": { + "orderGuid": "550e8400-e29b-41d4-a716-446655440000" + } +} +``` + +### List Orders for Business Date +```json +{ + "name": "toast_list_orders", + "arguments": { + "businessDate": 20240215 + } +} +``` + +### Create Order +```json +{ + "name": "toast_create_order", + "arguments": { + "source": "ONLINE", + "selections": [ + { + "itemGuid": "item-123", + "quantity": 2 + } + ], + "customer": { + "firstName": "John", + "lastName": "Doe", + "phone": "+15551234567" + } + } +} +``` + +### Mark Item 86'd +```json +{ + "name": "toast_set_item_86", + "arguments": { + "itemGuid": "item-456", + "outOfStock": true + } +} +``` + +### Get Sales Summary +```json +{ + "name": "toast_get_sales_summary", + "arguments": { + "businessDate": 20240215 + } +} +``` + +## πŸ—οΈ Architecture + +``` +toast/ +β”œβ”€β”€ src/ +β”‚ β”œβ”€β”€ clients/ +β”‚ β”‚ └── toast.ts # Toast API client with auth +β”‚ β”œβ”€β”€ tools/ +β”‚ β”‚ β”œβ”€β”€ orders.ts # 12 order tools +β”‚ β”‚ β”œβ”€β”€ menus.ts # 11 menu tools +β”‚ β”‚ β”œβ”€β”€ employees.ts # 9 employee tools +β”‚ β”‚ β”œβ”€β”€ labor.ts # 6 labor tools +β”‚ β”‚ β”œβ”€β”€ restaurant.ts # 9 restaurant tools +β”‚ β”‚ β”œβ”€β”€ payments.ts # 6 payment tools +β”‚ β”‚ β”œβ”€β”€ inventory.ts # 5 inventory tools +β”‚ β”‚ β”œβ”€β”€ customers.ts # 4 customer tools +β”‚ β”‚ β”œβ”€β”€ reporting.ts # 6 reporting tools +β”‚ β”‚ └── cash.ts # 8 cash tools +β”‚ β”œβ”€β”€ types/ +β”‚ β”‚ └── index.ts # Comprehensive TypeScript types +β”‚ β”œβ”€β”€ ui/ +β”‚ β”‚ └── react-app/ # 18 React apps (client-side) +β”‚ β”œβ”€β”€ server.ts # MCP server implementation +β”‚ └── main.ts # Entry point (stdio + HTTP) +β”œβ”€β”€ package.json +β”œβ”€β”€ tsconfig.json +└── README.md +``` + +## πŸ“Š API Coverage + +This server implements comprehensive coverage of the Toast API: + +- βœ… Orders API v2 (full CRUD) +- βœ… Menus API v2 (read + update) +- βœ… Labor API v1 (employees, shifts, time entries) +- βœ… Configuration API v1 (restaurant settings) +- βœ… Stock API v1 (inventory management) +- βœ… Cash Management API v1 +- βœ… Partners API v1 (restaurant access) + +## πŸ” Authentication + +Uses OAuth 2.0 client credentials flow with automatic token refresh. Tokens are managed internally and refreshed 5 minutes before expiration. + +## 🎨 UI Theme + +All 18 apps use a consistent dark theme optimized for restaurant environments: +- Background: `#0f0f0f` +- Cards: `#1a1a1a` +- Accent: `#00bfa5` +- Text: `#e0e0e0` + +## 🀝 Contributing + +Contributions welcome! Please see the main [mcpengine repo](https://github.com/BusyBee3333/mcpengine) for contribution guidelines. + +## πŸ“„ License + +MIT Β© BusyBee3333 + +## πŸ”— Links + +- [Toast API Documentation](https://doc.toasttab.com/) +- [Model Context Protocol](https://modelcontextprotocol.io/) +- [MCP Engine Repository](https://github.com/BusyBee3333/mcpengine) + +## πŸ› Known Issues + +- HTTP mode tool execution not yet implemented (use stdio mode for MCP) +- UI apps currently use client-side demo data (connect to Toast API for live data) + +## πŸ—“οΈ Roadmap + +- [ ] WebSocket support for real-time order updates +- [ ] Full HTTP mode implementation +- [ ] Additional reporting endpoints +- [ ] Kitchen display system (KDS) integration +- [ ] Multi-location support + +--- + +**Built with ❀️ for the restaurant industry** diff --git a/servers/toast/package.json b/servers/toast/package.json index 2582420..b474d25 100644 --- a/servers/toast/package.json +++ b/servers/toast/package.json @@ -1,15 +1,17 @@ { "name": "@busybee3333/toast-mcp-server", "version": "1.0.0", - "description": "Complete MCP server for Toast restaurant POS/management platform with 50+ tools and 15+ React apps", + "description": "Complete MCP server for Toast restaurant POS/management platform with 50+ tools and 18 React apps", "type": "module", + "main": "dist/main.js", "bin": { "toast-mcp-server": "./dist/main.js" }, "scripts": { - "build": "tsc && npm run build:ui", - "build:ui": "for dir in src/ui/*/; do (cd \"$dir\" && npm install && npm run build); done", + "build": "tsc", "dev": "tsc --watch", + "start": "node dist/main.js", + "start:http": "TOAST_MCP_MODE=http node dist/main.js", "prepublishOnly": "npm run build" }, "keywords": [ @@ -20,17 +22,30 @@ "orders", "menu", "labor", - "payments" + "payments", + "inventory", + "model-context-protocol" ], "author": "BusyBee3333", "license": "MIT", "dependencies": { "@modelcontextprotocol/sdk": "^1.0.4", "axios": "^1.7.9", - "zod": "^3.24.1" + "zod": "^3.24.1", + "express": "^4.18.2", + "cors": "^2.8.5" }, "devDependencies": { "@types/node": "^22.10.5", + "@types/express": "^4.17.21", + "@types/cors": "^2.8.17", "typescript": "^5.7.3" + }, + "repository": { + "type": "git", + "url": "https://github.com/BusyBee3333/mcpengine.git" + }, + "publishConfig": { + "access": "public" } } diff --git a/servers/toast/src/main.ts b/servers/toast/src/main.ts index 2fdf396..f0848bb 100644 --- a/servers/toast/src/main.ts +++ b/servers/toast/src/main.ts @@ -1,40 +1,119 @@ #!/usr/bin/env node import { ToastMCPServer } from './server.js'; -import type { ToastConfig } from './types/index.js'; -function getConfig(): ToastConfig { - const apiKey = process.env.TOAST_API_KEY; - const clientId = process.env.TOAST_CLIENT_ID; - const clientSecret = process.env.TOAST_CLIENT_SECRET; - const restaurantGuid = process.env.TOAST_RESTAURANT_GUID; - const environment = (process.env.TOAST_ENVIRONMENT || 'production') as 'production' | 'sandbox'; +/** + * Toast MCP Server Entry Point + * Supports both stdio and HTTP modes + */ - if (!apiKey || !clientId || !clientSecret) { - console.error('Error: Missing required environment variables'); - console.error('Required: TOAST_API_KEY, TOAST_CLIENT_ID, TOAST_CLIENT_SECRET'); - console.error('Optional: TOAST_RESTAURANT_GUID, TOAST_ENVIRONMENT (production|sandbox)'); +interface Config { + clientId?: string; + clientSecret?: string; + restaurantGuid?: string; + environment?: 'production' | 'sandbox'; + mode?: 'stdio' | 'http'; + port?: number; +} + +function loadConfig(): Config { + const config: Config = { + mode: (process.env.TOAST_MCP_MODE as 'stdio' | 'http') || 'stdio', + port: process.env.TOAST_MCP_PORT ? parseInt(process.env.TOAST_MCP_PORT) : 3000, + }; + + // Load from environment variables + config.clientId = process.env.TOAST_CLIENT_ID; + config.clientSecret = process.env.TOAST_CLIENT_SECRET; + config.restaurantGuid = process.env.TOAST_RESTAURANT_GUID; + config.environment = (process.env.TOAST_ENVIRONMENT as 'production' | 'sandbox') || 'production'; + + // Validate required fields + if (!config.clientId) { + console.error('Error: TOAST_CLIENT_ID environment variable is required'); process.exit(1); } - return { - apiKey, - clientId, - clientSecret, - restaurantGuid, - environment, - }; + if (!config.clientSecret) { + console.error('Error: TOAST_CLIENT_SECRET environment variable is required'); + process.exit(1); + } + + return config; } async function main() { + const config = loadConfig(); + + console.error('[Toast MCP] Starting server...'); + console.error(`[Toast MCP] Mode: ${config.mode}`); + console.error(`[Toast MCP] Environment: ${config.environment}`); + if (config.restaurantGuid) { + console.error(`[Toast MCP] Restaurant GUID: ${config.restaurantGuid}`); + } + try { - const config = getConfig(); - const server = new ToastMCPServer(config); - await server.run(); + if (config.mode === 'stdio') { + // Stdio mode - standard MCP server + const server = new ToastMCPServer({ + clientId: config.clientId!, + clientSecret: config.clientSecret!, + restaurantGuid: config.restaurantGuid, + environment: config.environment, + }); + + await server.run(); + } else if (config.mode === 'http') { + // HTTP mode - for web UI and API access + const express = await import('express'); + const cors = await import('cors'); + const app = express.default(); + + app.use(cors.default()); + app.use(express.json()); + + // Serve static UI files + app.use('/apps', express.static('dist/ui')); + + // Health check + app.get('/health', (req, res) => { + res.json({ status: 'ok', service: 'toast-mcp-server', version: '1.0.0' }); + }); + + // API endpoint for tool execution + app.post('/api/tools/:toolName', async (req, res) => { + try { + const server = new ToastMCPServer({ + clientId: config.clientId!, + clientSecret: config.clientSecret!, + restaurantGuid: config.restaurantGuid, + environment: config.environment, + }); + + // This would need to be refactored to support HTTP-based tool calls + // For now, returning placeholder + res.json({ + error: 'HTTP tool execution not yet implemented', + message: 'Use stdio mode for MCP integration', + }); + } catch (error: any) { + res.status(500).json({ error: error.message }); + } + }); + + const port = config.port || 3000; + app.listen(port, () => { + console.error(`[Toast MCP] HTTP server listening on port ${port}`); + console.error(`[Toast MCP] UI available at http://localhost:${port}/apps/`); + }); + } } catch (error) { - console.error('Fatal error:', error); + console.error('[Toast MCP] Fatal error:', error); process.exit(1); } } -main(); +main().catch(error => { + console.error('[Toast MCP] Unhandled error:', error); + process.exit(1); +}); diff --git a/servers/toast/src/server.ts b/servers/toast/src/server.ts index c96de4d..c7780ea 100644 --- a/servers/toast/src/server.ts +++ b/servers/toast/src/server.ts @@ -3,42 +3,38 @@ import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js' import { CallToolRequestSchema, ListToolsRequestSchema, - ListResourcesRequestSchema, - ReadResourceRequestSchema, - Tool, } from '@modelcontextprotocol/sdk/types.js'; +import { z } from 'zod'; import { ToastClient } from './clients/toast.js'; -import type { ToastConfig } from './types/index.js'; +import { registerOrdersTools } from './tools/orders.js'; +import { registerMenusTools } from './tools/menus.js'; +import { registerEmployeesTools } from './tools/employees.js'; +import { registerLaborTools } from './tools/labor.js'; +import { registerRestaurantTools } from './tools/restaurant.js'; +import { registerPaymentsTools } from './tools/payments.js'; +import { registerInventoryTools } from './tools/inventory.js'; +import { registerCustomersTools } from './tools/customers.js'; +import { registerReportingTools } from './tools/reporting.js'; +import { registerCashTools } from './tools/cash.js'; -// Import tool creators -import { createOrdersTools } from './tools/orders.js'; -import { createMenusTools } from './tools/menus.js'; -import { createEmployeesTools } from './tools/employees.js'; -import { createLaborTools } from './tools/labor.js'; -import { createPaymentsTools } from './tools/payments.js'; -import { createCashManagementTools } from './tools/cash-management.js'; -import { createConfigurationTools } from './tools/configuration.js'; -import { createStockTools } from './tools/stock.js'; -import { createKitchenTools } from './tools/kitchen.js'; -import { createAnalyticsTools } from './tools/analytics.js'; -import { createPartnersTools } from './tools/partners.js'; -import { createAvailabilityTools } from './tools/availability.js'; -import { createCustomersTools } from './tools/customers.js'; -import { createReportsTools } from './tools/reports.js'; +/** + * Toast MCP Server - Complete restaurant POS/management platform integration + */ -import { fileURLToPath } from 'url'; -import { dirname, join } from 'path'; -import { readFileSync, readdirSync } from 'fs'; - -const __filename = fileURLToPath(import.meta.url); -const __dirname = dirname(__filename); +interface ToastServerConfig { + apiKey?: string; + clientId: string; + clientSecret: string; + restaurantGuid?: string; + environment?: 'production' | 'sandbox'; +} export class ToastMCPServer { private server: Server; private client: ToastClient; private tools: Map; - constructor(config: ToastConfig) { + constructor(config: ToastServerConfig) { this.server = new Server( { name: 'toast-mcp-server', @@ -47,15 +43,24 @@ export class ToastMCPServer { { capabilities: { tools: {}, - resources: {}, }, } ); - this.client = new ToastClient(config); - this.tools = new Map(); + // Initialize Toast client + this.client = new ToastClient({ + apiKey: config.apiKey || '', + clientId: config.clientId, + clientSecret: config.clientSecret, + restaurantGuid: config.restaurantGuid, + environment: config.environment || 'production', + }); - this.initializeTools(); + // Register all tools from all modules + this.tools = new Map(); + this.registerAllTools(); + + // Set up request handlers this.setupHandlers(); // Error handling @@ -69,61 +74,85 @@ export class ToastMCPServer { }); } - private initializeTools() { - const toolGroups = [ - createOrdersTools(this.client), - createMenusTools(this.client), - createEmployeesTools(this.client), - createLaborTools(this.client), - createPaymentsTools(this.client), - createCashManagementTools(this.client), - createConfigurationTools(this.client), - createStockTools(this.client), - createKitchenTools(this.client), - createAnalyticsTools(this.client), - createPartnersTools(this.client), - createAvailabilityTools(this.client), - createCustomersTools(this.client), - createReportsTools(this.client), + private registerAllTools() { + const toolModules = [ + registerOrdersTools(this.client), + registerMenusTools(this.client), + registerEmployeesTools(this.client), + registerLaborTools(this.client), + registerRestaurantTools(this.client), + registerPaymentsTools(this.client), + registerInventoryTools(this.client), + registerCustomersTools(this.client), + registerReportingTools(this.client), + registerCashTools(this.client), ]; - for (const group of toolGroups) { - for (const [name, tool] of Object.entries(group)) { - this.tools.set(name, tool); + for (const tools of toolModules) { + for (const tool of tools) { + this.tools.set(tool.name, tool); } } + + console.error(`[Toast MCP] Registered ${this.tools.size} tools`); } private setupHandlers() { // List available tools this.server.setRequestHandler(ListToolsRequestSchema, async () => { - const tools: Tool[] = []; - - for (const [name, tool] of this.tools.entries()) { - tools.push({ - name, + return { + tools: Array.from(this.tools.values()).map(tool => ({ + name: tool.name, description: tool.description, - inputSchema: { - type: 'object', - ...tool.parameters, - }, - }); - } - - return { tools }; + inputSchema: tool.inputSchema.shape + ? { + type: 'object', + properties: Object.entries(tool.inputSchema.shape).reduce( + (acc, [key, value]: [string, any]) => { + acc[key] = { + type: value._def?.typeName === 'ZodString' ? 'string' : + value._def?.typeName === 'ZodNumber' ? 'number' : + value._def?.typeName === 'ZodBoolean' ? 'boolean' : + value._def?.typeName === 'ZodArray' ? 'array' : + value._def?.typeName === 'ZodObject' ? 'object' : + value._def?.typeName === 'ZodEnum' ? 'string' : + 'string', + description: value.description || '', + ...(value._def?.typeName === 'ZodEnum' && { + enum: value._def.values, + }), + ...(value.isOptional() && { + optional: true, + }), + }; + return acc; + }, + {} as Record + ), + required: Object.entries(tool.inputSchema.shape) + .filter(([_, value]: [string, any]) => !value.isOptional()) + .map(([key]) => key), + } + : tool.inputSchema, + })), + }; }); - // Handle tool calls + // Handle tool execution this.server.setRequestHandler(CallToolRequestSchema, async (request) => { - const { name, arguments: args } = request.params; - - const tool = this.tools.get(name); + const tool = this.tools.get(request.params.name); + if (!tool) { - throw new Error(`Unknown tool: ${name}`); + throw new Error(`Unknown tool: ${request.params.name}`); } try { - const result = await tool.handler(args || {}); + // Validate input + const validatedArgs = tool.inputSchema.parse(request.params.arguments || {}); + + // Execute tool + const result = await tool.handler(validatedArgs); + return { content: [ { @@ -133,74 +162,10 @@ export class ToastMCPServer { ], }; } catch (error: any) { - return { - content: [ - { - type: 'text', - text: JSON.stringify( - { - error: error.message || 'Unknown error', - details: error, - }, - null, - 2 - ), - }, - ], - isError: true, - }; - } - }); - - // List resources (React UI apps) - this.server.setRequestHandler(ListResourcesRequestSchema, async () => { - try { - const uiPath = join(__dirname, 'ui'); - const apps = readdirSync(uiPath, { withFileTypes: true }) - .filter((dirent) => dirent.isDirectory()) - .map((dirent) => dirent.name); - - return { - resources: apps.map((appName) => ({ - uri: `toast://ui/${appName}`, - name: appName - .split('-') - .map((w) => w.charAt(0).toUpperCase() + w.slice(1)) - .join(' '), - description: `Toast ${appName} React UI`, - mimeType: 'text/html', - })), - }; - } catch (error) { - return { resources: [] }; - } - }); - - // Read resource (serve React UI apps) - this.server.setRequestHandler(ReadResourceRequestSchema, async (request) => { - const uri = request.params.uri; - const match = uri.match(/^toast:\/\/ui\/(.+)$/); - - if (!match) { - throw new Error(`Invalid resource URI: ${uri}`); - } - - const appName = match[1]; - const appPath = join(__dirname, 'ui', appName, 'dist', 'index.html'); - - try { - const html = readFileSync(appPath, 'utf-8'); - return { - contents: [ - { - uri, - mimeType: 'text/html', - text: html, - }, - ], - }; - } catch (error) { - throw new Error(`App not found: ${appName}`); + if (error instanceof z.ZodError) { + throw new Error(`Invalid arguments: ${error.errors.map(e => `${e.path.join('.')}: ${e.message}`).join(', ')}`); + } + throw error; } }); } @@ -208,6 +173,8 @@ export class ToastMCPServer { async run() { const transport = new StdioServerTransport(); await this.server.connect(transport); - console.error('Toast MCP server running on stdio'); + console.error('[Toast MCP] Server running on stdio'); } } + +export default ToastMCPServer; diff --git a/servers/toast/src/tools/analytics.ts b/servers/toast/src/tools/analytics.ts deleted file mode 100644 index 4afa126..0000000 --- a/servers/toast/src/tools/analytics.ts +++ /dev/null @@ -1,98 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { SalesReport, LaborReport, MenuItemSales } from '../types/index.js'; - -export function createAnalyticsTools(client: ToastClient) { - return { - toast_get_sales_summary: { - description: 'Get sales summary report for a date range', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - - const report = await client.get(`/analytics/v1/sales/summary`, params); - return report; - }, - }, - - toast_get_labor_summary: { - description: 'Get labor summary report for a date range', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - - const report = await client.get(`/analytics/v1/labor/summary`, params); - return report; - }, - }, - - toast_get_menu_item_sales: { - description: 'Get sales breakdown by menu item for a date range', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - - const sales = await client.get(`/analytics/v1/sales/items`, params); - return { sales, count: sales.length }; - }, - }, - - toast_get_sales_by_channel: { - description: 'Get sales breakdown by channel (dine-in, takeout, delivery, etc.)', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - - const sales = await client.get(`/analytics/v1/sales/channels`, params); - return sales; - }, - }, - }; -} diff --git a/servers/toast/src/tools/availability.ts b/servers/toast/src/tools/availability.ts deleted file mode 100644 index 196a518..0000000 --- a/servers/toast/src/tools/availability.ts +++ /dev/null @@ -1,50 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { RestaurantAvailability } from '../types/index.js'; - -export function createAvailabilityTools(client: ToastClient) { - return { - toast_get_restaurant_availability: { - description: 'Get real-time availability status for online ordering', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const availability = await client.get( - `/restaurant-availability/v1/availability/${guid}` - ); - return availability; - }, - }, - - toast_set_restaurant_availability: { - description: 'Update restaurant availability for online ordering', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - acceptingOrders: { type: 'boolean', description: 'Whether to accept online orders' }, - temporarilyClosed: { type: 'boolean', description: 'Mark as temporarily closed' }, - closedUntil: { type: 'string', description: 'ISO 8601 timestamp when reopening' }, - }, - required: ['acceptingOrders'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const availabilityData = { - acceptingOrders: args.acceptingOrders, - temporarilyClosed: args.temporarilyClosed, - closedUntil: args.closedUntil, - }; - const result = await client.put( - `/restaurant-availability/v1/availability/${guid}`, - availabilityData - ); - return result; - }, - }, - }; -} diff --git a/servers/toast/src/tools/cash-management.ts b/servers/toast/src/tools/cash-management.ts deleted file mode 100644 index 3774e83..0000000 --- a/servers/toast/src/tools/cash-management.ts +++ /dev/null @@ -1,73 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { CashEntry, CashDeposit, CashDrawer } from '../types/index.js'; - -export function createCashManagementTools(client: ToastClient) { - return { - toast_list_cash_entries: { - description: 'List cash management entries for a date range', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - entryType: { type: 'string', description: 'Entry type (e.g., "PAID_IN", "PAID_OUT")' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - if (args.entryType) params.entryType = args.entryType; - - const entries = await client.get(`/cashmgmt/v1/entries`, params); - return { entries, count: entries.length }; - }, - }, - - toast_get_cash_entry: { - description: 'Get a specific cash entry by GUID', - parameters: { - type: 'object', - properties: { - entryGuid: { type: 'string', description: 'Cash entry GUID' }, - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - required: ['entryGuid'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const entry = await client.get(`/cashmgmt/v1/entries/${args.entryGuid}`, { - restaurantGuid: guid, - }); - return entry; - }, - }, - - toast_list_cash_deposits: { - description: 'List cash deposits for a date range', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.businessDate) params.businessDate = args.businessDate; - if (args.startDate) params.startDate = args.startDate; - if (args.endDate) params.endDate = args.endDate; - - const deposits = await client.get(`/cashmgmt/v1/deposits`, params); - return { deposits, count: deposits.length }; - }, - }, - }; -} diff --git a/servers/toast/src/tools/configuration.ts b/servers/toast/src/tools/configuration.ts deleted file mode 100644 index db915a7..0000000 --- a/servers/toast/src/tools/configuration.ts +++ /dev/null @@ -1,115 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { - Restaurant, - RevenueCenter, - Table, - ServiceArea, - DiningOption, -} from '../types/index.js'; - -export function createConfigurationTools(client: ToastClient) { - return { - toast_get_restaurant: { - description: 'Get restaurant configuration and details', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const restaurant = await client.get(`/restaurants/v1/restaurants/${guid}`); - return restaurant; - }, - }, - - toast_list_revenue_centers: { - description: 'List all revenue centers for a restaurant', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const revenueCenters = await client.get( - `/config/v2/revenueCenters`, - { restaurantGuid: guid } - ); - return { revenueCenters, count: revenueCenters.length }; - }, - }, - - toast_list_tables: { - description: 'List all tables for a restaurant', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const tables = await client.get(`/config/v2/tables`, { - restaurantGuid: guid, - }); - return { tables, count: tables.length }; - }, - }, - - toast_get_table: { - description: 'Get a specific table by GUID', - parameters: { - type: 'object', - properties: { - tableGuid: { type: 'string', description: 'Table GUID' }, - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - required: ['tableGuid'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const table = await client.get(`/config/v2/tables/${args.tableGuid}`, { - restaurantGuid: guid, - }); - return table; - }, - }, - - toast_list_service_areas: { - description: 'List all service areas for a restaurant', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const serviceAreas = await client.get(`/config/v2/serviceAreas`, { - restaurantGuid: guid, - }); - return { serviceAreas, count: serviceAreas.length }; - }, - }, - - toast_list_dining_options: { - description: 'List all dining options for a restaurant', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const diningOptions = await client.get(`/config/v2/diningOptions`, { - restaurantGuid: guid, - }); - return { diningOptions, count: diningOptions.length }; - }, - }, - }; -} diff --git a/servers/toast/src/tools/kitchen.ts b/servers/toast/src/tools/kitchen.ts deleted file mode 100644 index 2b5184d..0000000 --- a/servers/toast/src/tools/kitchen.ts +++ /dev/null @@ -1,62 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { KitchPrepStation, KitchenOrder } from '../types/index.js'; - -export function createKitchenTools(client: ToastClient) { - return { - toast_list_prep_stations: { - description: 'List all kitchen prep stations', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const stations = await client.get(`/kitchen/v1/prepStations`, { - restaurantGuid: guid, - }); - return { stations, count: stations.length }; - }, - }, - - toast_get_prep_station: { - description: 'Get a specific prep station with current orders', - parameters: { - type: 'object', - properties: { - stationGuid: { type: 'string', description: 'Prep station GUID' }, - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - required: ['stationGuid'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const station = await client.get( - `/kitchen/v1/prepStations/${args.stationGuid}`, - { restaurantGuid: guid } - ); - return station; - }, - }, - - toast_list_kitchen_orders: { - description: 'List all orders in the kitchen (fired orders)', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - stationGuid: { type: 'string', description: 'Filter by prep station GUID' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.stationGuid) params.stationGuid = args.stationGuid; - - const orders = await client.get(`/kitchen/v1/orders`, params); - return { orders, count: orders.length }; - }, - }, - }; -} diff --git a/servers/toast/src/tools/partners.ts b/servers/toast/src/tools/partners.ts deleted file mode 100644 index e7afd73..0000000 --- a/servers/toast/src/tools/partners.ts +++ /dev/null @@ -1,35 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { PartnerAccess } from '../types/index.js'; - -export function createPartnersTools(client: ToastClient) { - return { - toast_list_accessible_restaurants: { - description: 'List all restaurants accessible to the API client', - parameters: { - type: 'object', - properties: {}, - }, - handler: async (args: any) => { - const restaurants = await client.get(`/partners/v1/restaurants`); - return { restaurants, count: restaurants.length }; - }, - }, - - toast_get_restaurant_access: { - description: 'Get access details for a specific restaurant', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID' }, - }, - required: ['restaurantGuid'], - }, - handler: async (args: any) => { - const access = await client.get( - `/partners/v1/restaurants/${args.restaurantGuid}` - ); - return access; - }, - }, - }; -} diff --git a/servers/toast/src/tools/reports.ts b/servers/toast/src/tools/reports.ts deleted file mode 100644 index 980b00b..0000000 --- a/servers/toast/src/tools/reports.ts +++ /dev/null @@ -1,115 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; - -export function createReportsTools(client: ToastClient) { - return { - toast_get_daily_sales_report: { - description: 'Get comprehensive daily sales report', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - }, - required: ['businessDate'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const report = await client.get(`/analytics/v1/reports/daily-sales`, { - restaurantGuid: guid, - businessDate: args.businessDate, - }); - return report; - }, - }, - - toast_get_hourly_sales_report: { - description: 'Get hourly sales breakdown for a business date', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - businessDate: { type: 'string', description: 'Business date in yyyyMMdd format' }, - }, - required: ['businessDate'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const report = await client.get(`/analytics/v1/reports/hourly-sales`, { - restaurantGuid: guid, - businessDate: args.businessDate, - }); - return report; - }, - }, - - toast_get_employee_performance: { - description: 'Get employee performance metrics', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - employeeGuid: { type: 'string', description: 'Filter by specific employee' }, - }, - required: ['startDate', 'endDate'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { - restaurantGuid: guid, - startDate: args.startDate, - endDate: args.endDate, - }; - if (args.employeeGuid) params.employeeGuid = args.employeeGuid; - - const report = await client.get(`/analytics/v1/reports/employee-performance`, params); - return report; - }, - }, - - toast_get_discount_report: { - description: 'Get discount usage report', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - required: ['startDate', 'endDate'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const report = await client.get(`/analytics/v1/reports/discounts`, { - restaurantGuid: guid, - startDate: args.startDate, - endDate: args.endDate, - }); - return report; - }, - }, - - toast_get_payment_methods_report: { - description: 'Get payment methods breakdown', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - startDate: { type: 'string', description: 'Start date ISO 8601' }, - endDate: { type: 'string', description: 'End date ISO 8601' }, - }, - required: ['startDate', 'endDate'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const report = await client.get(`/analytics/v1/reports/payment-methods`, { - restaurantGuid: guid, - startDate: args.startDate, - endDate: args.endDate, - }); - return report; - }, - }, - }; -} diff --git a/servers/toast/src/tools/stock.ts b/servers/toast/src/tools/stock.ts deleted file mode 100644 index f134465..0000000 --- a/servers/toast/src/tools/stock.ts +++ /dev/null @@ -1,95 +0,0 @@ -import type { ToastClient } from '../clients/toast.js'; -import type { StockItem } from '../types/index.js'; - -export function createStockTools(client: ToastClient) { - return { - toast_list_stock_items: { - description: 'List stock/inventory for all items', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional if set in config)' }, - outOfStockOnly: { type: 'boolean', description: 'Only return out of stock items' }, - }, - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const params: any = { restaurantGuid: guid }; - if (args.outOfStockOnly) params.outOfStockOnly = args.outOfStockOnly; - - const items = await client.get(`/stock/v1/items`, params); - return { items, count: items.length }; - }, - }, - - toast_get_stock_item: { - description: 'Get stock information for a specific menu item', - parameters: { - type: 'object', - properties: { - itemGuid: { type: 'string', description: 'Menu item GUID' }, - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - }, - required: ['itemGuid'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const item = await client.get(`/stock/v1/items/${args.itemGuid}`, { - restaurantGuid: guid, - }); - return item; - }, - }, - - toast_update_stock: { - description: 'Update stock quantity or availability for a menu item', - parameters: { - type: 'object', - properties: { - itemGuid: { type: 'string', description: 'Menu item GUID' }, - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - quantity: { type: 'number', description: 'Stock quantity' }, - outOfStock: { type: 'boolean', description: 'Set item as out of stock' }, - infiniteQuantity: { type: 'boolean', description: 'Set infinite quantity' }, - }, - required: ['itemGuid'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const updateData: any = {}; - if (args.quantity !== undefined) updateData.quantity = args.quantity; - if (args.outOfStock !== undefined) updateData.outOfStock = args.outOfStock; - if (args.infiniteQuantity !== undefined) updateData.infiniteQuantity = args.infiniteQuantity; - - const item = await client.put( - `/stock/v1/items/${args.itemGuid}`, - updateData - ); - return item; - }, - }, - - toast_bulk_update_stock: { - description: 'Bulk update stock for multiple items', - parameters: { - type: 'object', - properties: { - restaurantGuid: { type: 'string', description: 'Restaurant GUID (optional)' }, - items: { - type: 'array', - description: 'Array of stock updates [{itemGuid, quantity, outOfStock}]', - }, - }, - required: ['items'], - }, - handler: async (args: any) => { - const guid = args.restaurantGuid || client.getRestaurantGuid(); - const result = await client.post(`/stock/v1/items/bulk`, { - restaurantGuid: guid, - items: args.items, - }); - return result; - }, - }, - }; -} diff --git a/servers/toast/src/ui/cash-drawer-manager/src/App.tsx b/servers/toast/src/ui/cash-drawer-manager/src/App.tsx new file mode 100644 index 0000000..07406e4 --- /dev/null +++ b/servers/toast/src/ui/cash-drawer-manager/src/App.tsx @@ -0,0 +1,86 @@ +import React from 'react'; + +const App: React.FC = () => { + const entries = [ + { time: '10:30 AM', type: 'Paid In', amount: 200.00, reason: 'Opening float', employee: 'John D.' }, + { time: '11:45 AM', type: 'Paid Out', amount: -50.00, reason: 'Supplies', employee: 'Jane S.' }, + { time: '2:15 PM', type: 'Paid Out', amount: -25.00, reason: 'Refund', employee: 'John D.' }, + ]; + + return ( +
+
+

Cash Drawer Manager

+ +
+ +
+
+
Opening Balance
+
$200.00
+
+
+
Cash In
+
$1,245.50
+
+
+
Cash Out
+
$75.00
+
+
+
Expected Balance
+
$1,370.50
+
+
+ +
+ + + +
+ +
+

Cash Entries Today

+
+
+
Time
+
Type
+
Amount
+
Reason
+
Employee
+
+ {entries.map((entry, idx) => ( +
+
{entry.time}
+
{entry.type}
+
0 ? '#22c55e' : '#ef4444' }}>${Math.abs(entry.amount).toFixed(2)}
+
{entry.reason}
+
{entry.employee}
+
+ ))} +
+
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '10px 20px', borderRadius: '6px', cursor: 'pointer' }, + summary: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))', gap: '16px', marginBottom: '24px' }, + summaryCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px', textAlign: 'center' }, + summaryLabel: { fontSize: '14px', color: '#9ca3af', marginBottom: '8px' }, + summaryValue: { fontSize: '28px', fontWeight: 'bold', color: '#22c55e' }, + actions: { display: 'flex', gap: '12px', marginBottom: '30px' }, + actionButton: { flex: 1, padding: '12px', backgroundColor: '#1e40af', color: '#fff', border: 'none', borderRadius: '6px', cursor: 'pointer', fontSize: '16px', fontWeight: '600' }, + entriesSection: { }, + sectionTitle: { fontSize: '20px', fontWeight: '600', marginBottom: '16px' }, + table: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', overflow: 'hidden' }, + tableHeader: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr 2fr 1.5fr', padding: '16px', fontWeight: '600', borderBottom: '1px solid #333', backgroundColor: '#1e1e1e' }, + tableRow: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr 2fr 1.5fr', padding: '16px', borderBottom: '1px solid #333', alignItems: 'center' }, + typeBadge: { display: 'inline-block', padding: '4px 12px', borderRadius: '12px', fontSize: '12px' }, +}; + +export default App; diff --git a/servers/toast/src/ui/customer-directory/src/App.tsx b/servers/toast/src/ui/customer-directory/src/App.tsx new file mode 100644 index 0000000..810bd03 --- /dev/null +++ b/servers/toast/src/ui/customer-directory/src/App.tsx @@ -0,0 +1,71 @@ +import React, { useState } from 'react'; + +const App: React.FC = () => { + const [searchQuery, setSearchQuery] = useState(''); + const customers = [ + { guid: 'cust-1', firstName: 'Alice', lastName: 'Johnson', email: 'alice@example.com', phone: '555-1234', orders: 12 }, + { guid: 'cust-2', firstName: 'Bob', lastName: 'Williams', email: 'bob@example.com', phone: '555-5678', orders: 8 }, + ]; + + return ( +
+
+

Customer Directory

+ +
+ +
+ setSearchQuery(e.target.value)} + style={styles.input} + /> +
+ +
+ {customers.map((customer) => ( +
+
+
{customer.firstName[0]}{customer.lastName[0]}
+
+
{customer.firstName} {customer.lastName}
+
{customer.email}
+
+
+
+

Phone: {customer.phone}

+

Total Orders: {customer.orders}

+
+
+ + +
+
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '10px 20px', borderRadius: '6px', cursor: 'pointer' }, + search: { marginBottom: '20px' }, + input: { width: '100%', backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '12px', borderRadius: '6px', fontSize: '14px' }, + grid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(350px, 1fr))', gap: '20px' }, + card: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + customerHeader: { display: 'flex', gap: '16px', marginBottom: '16px', alignItems: 'center' }, + avatar: { width: '50px', height: '50px', borderRadius: '50%', backgroundColor: '#2563eb', display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: '18px', fontWeight: 'bold' }, + name: { fontSize: '18px', fontWeight: '600', marginBottom: '4px' }, + email: { fontSize: '14px', color: '#9ca3af' }, + details: { marginBottom: '16px', fontSize: '14px', lineHeight: '1.8' }, + cardActions: { display: 'flex', gap: '10px' }, + viewButton: { flex: 1, backgroundColor: '#1e40af', color: '#fff', border: 'none', padding: '10px', borderRadius: '4px', cursor: 'pointer' }, + editButton: { flex: 1, backgroundColor: '#374151', color: '#fff', border: 'none', padding: '10px', borderRadius: '4px', cursor: 'pointer' }, +}; + +export default App; diff --git a/servers/toast/src/ui/daily-reports/src/App.tsx b/servers/toast/src/ui/daily-reports/src/App.tsx new file mode 100644 index 0000000..69ebd62 --- /dev/null +++ b/servers/toast/src/ui/daily-reports/src/App.tsx @@ -0,0 +1,77 @@ +import React from 'react'; + +const App: React.FC = () => { + return ( +
+
+

Daily Reports

+
+ + January 12, 2026 + +
+
+ +
+
+

Sales Summary

+
+
Gross Sales:$12,456.00
+
Discounts:-$345.00
+
Refunds:-$120.00
+
Net Sales:$11,991.00
+
+
+ +
+

Order Stats

+
+
Total Orders:156
+
Average Check:$79.85
+
Total Guests:312
+
Avg Party Size:2.0
+
+
+ +
+

Labor Summary

+
+
Total Hours:86.5
+
Labor Cost:$1,298.50
+
Labor %:10.8%
+
Employees Clocked In:12
+
+
+ +
+

Payment Methods

+
+
Credit Card:$8,934.00 (74.5%)
+
Cash:$2,567.00 (21.4%)
+
Gift Card:$490.00 (4.1%)
+
+
+
+ + +
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + dateSelector: { display: 'flex', alignItems: 'center', gap: '16px' }, + navButton: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '8px 12px', borderRadius: '6px', cursor: 'pointer', fontSize: '18px' }, + date: { fontSize: '16px', fontWeight: '600' }, + sections: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(350px, 1fr))', gap: '20px', marginBottom: '30px' }, + section: {}, + sectionTitle: { fontSize: '18px', fontWeight: '600', marginBottom: '12px' }, + reportCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + reportRow: { display: 'flex', justifyContent: 'space-between', padding: '12px 0', borderBottom: '1px solid #333', fontSize: '14px' }, + totalRow: { fontWeight: 'bold', fontSize: '16px', color: '#22c55e', borderBottom: 'none', paddingTop: '16px' }, + exportButton: { width: '100%', padding: '16px', backgroundColor: '#2563eb', color: '#fff', border: 'none', borderRadius: '6px', cursor: 'pointer', fontSize: '16px', fontWeight: '600' }, +}; + +export default App; diff --git a/servers/toast/src/ui/discount-tracker/src/App.tsx b/servers/toast/src/ui/discount-tracker/src/App.tsx new file mode 100644 index 0000000..0775620 --- /dev/null +++ b/servers/toast/src/ui/discount-tracker/src/App.tsx @@ -0,0 +1,106 @@ +import React from 'react'; + +const App: React.FC = () => { + const discounts = [ + { name: 'Happy Hour 20%', usage: 24, amount: 456.00, employee: 'Multiple' }, + { name: 'Employee Meal', usage: 8, amount: 120.00, employee: 'Various' }, + { name: 'Manager Comp', usage: 3, amount: 210.00, employee: 'Jane S.' }, + { name: 'Senior Discount', usage: 12, amount: 96.00, employee: 'Multiple' }, + { name: 'Loyalty 10%', usage: 18, amount: 234.00, employee: 'System' }, + ]; + + const totalAmount = discounts.reduce((sum, d) => sum + d.amount, 0); + const totalUsage = discounts.reduce((sum, d) => sum + d.usage, 0); + + return ( +
+
+

Discount Tracker

+ +
+ +
+
+
Total Discounts
+
${totalAmount.toFixed(2)}
+
+
+
Total Usage
+
{totalUsage}
+
+
+
Avg Discount
+
${(totalAmount / totalUsage).toFixed(2)}
+
+
+ +
+
+
Discount Name
+
Usage Count
+
Total Amount
+
Applied By
+
Actions
+
+ {discounts.map((discount, idx) => ( +
+
{discount.name}
+
{discount.usage}
+
${discount.amount.toFixed(2)}
+
{discount.employee}
+
+ +
+
+ ))} +
+ +
+

Discount Distribution

+
+ {discounts.map((discount, idx) => ( +
+
{discount.name}
+
+
+ ${discount.amount.toFixed(2)} +
+
+
+ ))} +
+
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + select: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px' }, + summary: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))', gap: '16px', marginBottom: '30px' }, + summaryCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px', textAlign: 'center' }, + summaryLabel: { fontSize: '14px', color: '#9ca3af', marginBottom: '8px' }, + summaryValue: { fontSize: '28px', fontWeight: 'bold', color: '#ef4444' }, + table: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', overflow: 'hidden', marginBottom: '30px' }, + tableHeader: { display: 'grid', gridTemplateColumns: '2fr 1fr 1fr 1.5fr 1fr', padding: '16px', fontWeight: '600', borderBottom: '1px solid #333', backgroundColor: '#1e1e1e' }, + tableRow: { display: 'grid', gridTemplateColumns: '2fr 1fr 1fr 1.5fr 1fr', padding: '16px', borderBottom: '1px solid #333', alignItems: 'center' }, + discountName: { fontWeight: '600' }, + badge: { display: 'inline-block', padding: '4px 12px', backgroundColor: '#1e40af', borderRadius: '12px', fontSize: '12px' }, + amount: { fontWeight: '600', color: '#ef4444' }, + detailsButton: { backgroundColor: '#374151', color: '#fff', border: 'none', padding: '6px 12px', borderRadius: '4px', cursor: 'pointer', fontSize: '12px' }, + chartSection: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + chartTitle: { fontSize: '18px', fontWeight: '600', marginBottom: '16px' }, + chartBars: { display: 'flex', flexDirection: 'column', gap: '12px' }, + chartBar: {}, + chartBarLabel: { fontSize: '14px', marginBottom: '4px', fontWeight: '500' }, + chartBarWrapper: { backgroundColor: '#0a0a0a', borderRadius: '4px', overflow: 'hidden', height: '32px' }, + chartBarFill: { backgroundColor: '#ef4444', height: '100%', display: 'flex', alignItems: 'center', paddingLeft: '12px', fontSize: '12px', fontWeight: '600', transition: 'width 0.3s' }, +}; + +export default App; diff --git a/servers/toast/src/ui/employee-roster/src/App.tsx b/servers/toast/src/ui/employee-roster/src/App.tsx new file mode 100644 index 0000000..43df15c --- /dev/null +++ b/servers/toast/src/ui/employee-roster/src/App.tsx @@ -0,0 +1,54 @@ +import React, { useState } from 'react'; + +const App: React.FC = () => { + const [employees] = useState([ + { guid: 'emp-1', firstName: 'John', lastName: 'Doe', email: 'john@example.com', phone: '555-0100', job: 'Server' }, + { guid: 'emp-2', firstName: 'Jane', lastName: 'Smith', email: 'jane@example.com', phone: '555-0101', job: 'Manager' }, + ]); + + return ( +
+
+

Employee Roster

+ +
+ +
+
+
Name
+
Email
+
Phone
+
Position
+
Actions
+
+ {employees.map((emp) => ( +
+
{emp.firstName} {emp.lastName}
+
{emp.email}
+
{emp.phone}
+
{emp.job}
+
+ + +
+
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '10px 20px', borderRadius: '6px', cursor: 'pointer' }, + table: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', overflow: 'hidden' }, + tableHeader: { display: 'grid', gridTemplateColumns: '2fr 2fr 1.5fr 1fr 1.5fr', padding: '16px', fontWeight: '600', borderBottom: '1px solid #333', backgroundColor: '#1e1e1e' }, + tableRow: { display: 'grid', gridTemplateColumns: '2fr 2fr 1.5fr 1fr 1.5fr', padding: '16px', borderBottom: '1px solid #333', alignItems: 'center' }, + badge: { display: 'inline-block', padding: '4px 12px', backgroundColor: '#1e40af', borderRadius: '12px', fontSize: '12px' }, + actions: { display: 'flex', gap: '8px' }, + actionButton: { backgroundColor: '#374151', color: '#fff', border: 'none', padding: '6px 12px', borderRadius: '4px', cursor: 'pointer', fontSize: '12px' }, +}; + +export default App; diff --git a/servers/toast/src/ui/hourly-sales/src/App.tsx b/servers/toast/src/ui/hourly-sales/src/App.tsx new file mode 100644 index 0000000..5aedaeb --- /dev/null +++ b/servers/toast/src/ui/hourly-sales/src/App.tsx @@ -0,0 +1,86 @@ +import React from 'react'; + +const App: React.FC = () => { + const hours = [ + { hour: '11 AM', sales: 456, orders: 8 }, + { hour: '12 PM', sales: 1234, orders: 18 }, + { hour: '1 PM', sales: 1456, orders: 21 }, + { hour: '2 PM', sales: 892, orders: 14 }, + { hour: '3 PM', sales: 234, orders: 5 }, + { hour: '4 PM', sales: 178, orders: 3 }, + { hour: '5 PM', sales: 567, orders: 9 }, + { hour: '6 PM', sales: 2134, orders: 28 }, + { hour: '7 PM', sales: 2456, orders: 32 }, + { hour: '8 PM', sales: 1890, orders: 24 }, + { hour: '9 PM', sales: 1234, orders: 18 }, + { hour: '10 PM', sales: 678, orders: 10 }, + ]; + + const maxSales = Math.max(...hours.map(h => h.sales)); + + return ( +
+
+

Hourly Sales

+ +
+ +
+ {hours.map((hour) => ( +
+
{hour.hour}
+
+
+ ${hour.sales} +
+
+
{hour.orders} orders
+
+ ))} +
+ +
+
+
Peak Hour
+
7 PM
+
+
+
Peak Sales
+
$2,456
+
+
+
Total Sales
+
$13,409
+
+
+
Avg/Hour
+
$1,117
+
+
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + select: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px' }, + chart: { display: 'flex', gap: '8px', marginBottom: '30px', padding: '20px', backgroundColor: '#1a1a1a', borderRadius: '8px', border: '1px solid #333', justifyContent: 'space-around' }, + barContainer: { display: 'flex', flexDirection: 'column', alignItems: 'center', flex: 1 }, + barLabel: { fontSize: '12px', marginBottom: '8px', fontWeight: '600' }, + barWrapper: { height: '220px', display: 'flex', alignItems: 'flex-end' }, + bar: { backgroundColor: '#2563eb', width: '100%', borderRadius: '4px 4px 0 0', minHeight: '20px', display: 'flex', alignItems: 'flex-start', justifyContent: 'center', paddingTop: '8px', transition: 'height 0.3s' }, + barValue: { fontSize: '11px', fontWeight: '600' }, + orderCount: { fontSize: '11px', color: '#9ca3af', marginTop: '8px' }, + stats: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))', gap: '16px' }, + statCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px', textAlign: 'center' }, + statLabel: { fontSize: '14px', color: '#9ca3af', marginBottom: '8px' }, + statValue: { fontSize: '28px', fontWeight: 'bold', color: '#22c55e' }, +}; + +export default App; diff --git a/servers/toast/src/ui/inventory-manager/src/App.tsx b/servers/toast/src/ui/inventory-manager/src/App.tsx new file mode 100644 index 0000000..f575c98 --- /dev/null +++ b/servers/toast/src/ui/inventory-manager/src/App.tsx @@ -0,0 +1,72 @@ +import React from 'react'; + +const App: React.FC = () => { + const items = [ + { name: 'Burger Patties', quantity: 45, unit: 'lbs', status: 'in-stock', reorderAt: 20 }, + { name: 'Lettuce', quantity: 8, unit: 'heads', status: 'low', reorderAt: 10 }, + { name: 'Tomatoes', quantity: 2, unit: 'lbs', status: 'critical', reorderAt: 5 }, + ]; + + return ( +
+
+

Inventory Manager

+ +
+ +
+ + + +
+ +
+
+
Item Name
+
Quantity
+
Unit
+
Reorder At
+
Status
+
Actions
+
+ {items.map((item, idx) => ( +
+
{item.name}
+
{item.quantity}
+
{item.unit}
+
{item.reorderAt}
+
+ + {item.status} + +
+
+ + +
+
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '10px 20px', borderRadius: '6px', cursor: 'pointer' }, + filters: { display: 'flex', gap: '10px', marginBottom: '20px' }, + filterBtn: { padding: '8px 16px', backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', borderRadius: '6px', cursor: 'pointer' }, + table: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', overflow: 'hidden' }, + tableHeader: { display: 'grid', gridTemplateColumns: '2fr 1fr 1fr 1fr 1fr 1.5fr', padding: '16px', fontWeight: '600', borderBottom: '1px solid #333', backgroundColor: '#1e1e1e' }, + tableRow: { display: 'grid', gridTemplateColumns: '2fr 1fr 1fr 1fr 1fr 1.5fr', padding: '16px', borderBottom: '1px solid #333', alignItems: 'center' }, + badge: { display: 'inline-block', padding: '4px 12px', borderRadius: '12px', fontSize: '12px', textTransform: 'capitalize' }, + actions: { display: 'flex', gap: '8px' }, + actionButton: { backgroundColor: '#374151', color: '#fff', border: 'none', padding: '6px 12px', borderRadius: '4px', cursor: 'pointer', fontSize: '12px' }, +}; + +export default App; diff --git a/servers/toast/src/ui/kitchen-display/src/App.tsx b/servers/toast/src/ui/kitchen-display/src/App.tsx new file mode 100644 index 0000000..bf91ab1 --- /dev/null +++ b/servers/toast/src/ui/kitchen-display/src/App.tsx @@ -0,0 +1,63 @@ +import React from 'react'; + +const App: React.FC = () => { + const orders = [ + { id: 'ORD-001', table: '12', time: '5m', items: ['Burger', 'Fries', 'Coke'], status: 'preparing' }, + { id: 'ORD-002', table: '8', time: '2m', items: ['Salad', 'Water'], status: 'new' }, + ]; + + return ( +
+
+

Kitchen Display System

+
+ New: 3 + Preparing: 5 + Ready: 2 +
+
+ +
+ {orders.map((order) => ( +
+
+ {order.id} + Table {order.table} + {order.time} +
+
+ {order.items.map((item, idx) => ( +
β€’ {item}
+ ))} +
+
+ + +
+
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + stats: { display: 'flex', gap: '12px' }, + statBadge: { padding: '8px 16px', backgroundColor: '#1e40af', borderRadius: '6px', fontSize: '14px', fontWeight: '600' }, + ordersGrid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(350px, 1fr))', gap: '20px' }, + orderCard: { backgroundColor: '#1a1a1a', border: '2px solid #dc2626', borderRadius: '8px', padding: '20px' }, + orderHeader: { display: 'flex', justifyContent: 'space-between', marginBottom: '16px', fontSize: '14px', fontWeight: '600' }, + orderId: { color: '#60a5fa' }, + table: { color: '#22c55e' }, + time: { color: '#f59e0b' }, + items: { marginBottom: '16px' }, + item: { padding: '8px 0', fontSize: '16px', borderBottom: '1px solid #333' }, + orderActions: { display: 'flex', gap: '10px' }, + startButton: { flex: 1, backgroundColor: '#f59e0b', color: '#000', border: 'none', padding: '12px', borderRadius: '6px', cursor: 'pointer', fontWeight: '600' }, + doneButton: { flex: 1, backgroundColor: '#22c55e', color: '#000', border: 'none', padding: '12px', borderRadius: '6px', cursor: 'pointer', fontWeight: '600' }, +}; + +export default App; diff --git a/servers/toast/src/ui/labor-scheduler/src/App.tsx b/servers/toast/src/ui/labor-scheduler/src/App.tsx new file mode 100644 index 0000000..32b8f39 --- /dev/null +++ b/servers/toast/src/ui/labor-scheduler/src/App.tsx @@ -0,0 +1,57 @@ +import React from 'react'; + +const App: React.FC = () => { + const hours = Array.from({ length: 24 }, (_, i) => i); + const days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; + + return ( +
+
+

Labor Scheduler

+
+ + Week of Jan 1, 2026 + +
+
+ +
+
+
Time
+ {hours.map((hour) => ( +
{hour}:00
+ ))} +
+ {days.map((day) => ( +
+
{day}
+ {hours.map((hour) => ( +
+ {hour >= 10 && hour < 22 &&
John D.
} +
+ ))} +
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { marginBottom: '20px' }, + title: { fontSize: '28px', fontWeight: 'bold', marginBottom: '16px', color: '#fff' }, + headerActions: { display: 'flex', gap: '12px', alignItems: 'center' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '8px 16px', borderRadius: '6px', cursor: 'pointer' }, + weekLabel: { fontWeight: '600', fontSize: '16px' }, + scheduleGrid: { display: 'flex', gap: '1px', backgroundColor: '#333', border: '1px solid #333', borderRadius: '8px', overflow: 'auto' }, + timeColumn: { display: 'flex', flexDirection: 'column' }, + timeHeader: { padding: '12px', backgroundColor: '#1e1e1e', fontWeight: '600', height: '60px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, + timeSlot: { padding: '8px 12px', backgroundColor: '#1a1a1a', minHeight: '40px', display: 'flex', alignItems: 'center', fontSize: '12px' }, + dayColumn: { display: 'flex', flexDirection: 'column', flex: 1, minWidth: '120px' }, + dayHeader: { padding: '12px', backgroundColor: '#1e1e1e', fontWeight: '600', height: '60px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, + scheduleSlot: { padding: '4px', backgroundColor: '#1a1a1a', minHeight: '40px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, + shift: { backgroundColor: '#2563eb', color: '#fff', padding: '4px 8px', borderRadius: '4px', fontSize: '11px', width: '100%', textAlign: 'center' }, +}; + +export default App; diff --git a/servers/toast/src/ui/menu-manager/src/App.tsx b/servers/toast/src/ui/menu-manager/src/App.tsx new file mode 100644 index 0000000..189addf --- /dev/null +++ b/servers/toast/src/ui/menu-manager/src/App.tsx @@ -0,0 +1,64 @@ +import React, { useState } from 'react'; + +const App: React.FC = () => { + const [searchQuery, setSearchQuery] = useState(''); + const [selectedCategory, setSelectedCategory] = useState('all'); + + return ( +
+
+

Menu Manager

+ +
+ +
+ setSearchQuery(e.target.value)} + style={styles.input} + /> + +
+ +
+
+

Classic Burger

+

$12.99

+

Beef patty, lettuce, tomato, cheese

+
+ + +
+
+
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + button: { backgroundColor: '#2563eb', color: '#fff', border: 'none', padding: '10px 20px', borderRadius: '6px', cursor: 'pointer' }, + filters: { display: 'flex', gap: '10px', marginBottom: '20px' }, + input: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px', flex: 1 }, + select: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px', width: '200px' }, + grid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(300px, 1fr))', gap: '20px' }, + card: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '16px' }, + cardTitle: { fontSize: '18px', fontWeight: '600', marginBottom: '8px' }, + price: { fontSize: '20px', fontWeight: 'bold', color: '#22c55e', marginBottom: '8px' }, + description: { fontSize: '14px', color: '#9ca3af', marginBottom: '16px' }, + cardActions: { display: 'flex', gap: '10px' }, + editButton: { backgroundColor: '#1e40af', color: '#fff', border: 'none', padding: '8px 16px', borderRadius: '4px', cursor: 'pointer' }, + deleteButton: { backgroundColor: '#991b1b', color: '#fff', border: 'none', padding: '8px 16px', borderRadius: '4px', cursor: 'pointer' }, +}; + +export default App; diff --git a/servers/toast/src/ui/payment-terminal/src/App.tsx b/servers/toast/src/ui/payment-terminal/src/App.tsx new file mode 100644 index 0000000..503494a --- /dev/null +++ b/servers/toast/src/ui/payment-terminal/src/App.tsx @@ -0,0 +1,56 @@ +import React, { useState } from 'react'; + +const App: React.FC = () => { + const [amount, setAmount] = useState(''); + const [paymentMethod, setPaymentMethod] = useState('card'); + + const addDigit = (digit: string) => setAmount(amount + digit); + const clear = () => setAmount(''); + + return ( +
+
+

Payment Terminal

+
+ +
+
+
Amount to Charge
+
${amount || '0.00'}
+
+ +
+ + + +
+ +
+ {['1', '2', '3', '4', '5', '6', '7', '8', '9', '.', '0', 'C'].map((key) => ( + + ))} +
+ + +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui', display: 'flex', flexDirection: 'column', alignItems: 'center' }, + header: { marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff', textAlign: 'center' }, + terminal: { maxWidth: '400px', width: '100%' }, + display: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '30px', marginBottom: '20px', textAlign: 'center' }, + amountLabel: { fontSize: '14px', color: '#9ca3af', marginBottom: '8px' }, + amount: { fontSize: '48px', fontWeight: 'bold', color: '#22c55e' }, + paymentMethods: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '10px', marginBottom: '20px' }, + method: { padding: '12px', backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', borderRadius: '6px', cursor: 'pointer' }, + methodActive: { padding: '12px', backgroundColor: '#2563eb', color: '#fff', border: '1px solid #2563eb', borderRadius: '6px', cursor: 'pointer' }, + keypad: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: '10px', marginBottom: '20px' }, + key: { padding: '24px', fontSize: '24px', fontWeight: 'bold', backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', borderRadius: '6px', cursor: 'pointer' }, + chargeButton: { width: '100%', padding: '20px', fontSize: '18px', fontWeight: 'bold', backgroundColor: '#22c55e', color: '#000', border: 'none', borderRadius: '6px', cursor: 'pointer' }, +}; + +export default App; diff --git a/servers/toast/src/ui/react-app/customer-detail.html b/servers/toast/src/ui/react-app/customer-detail.html new file mode 100644 index 0000000..6d8fc7f --- /dev/null +++ b/servers/toast/src/ui/react-app/customer-detail.html @@ -0,0 +1,42 @@ + + + + + + Customer Detail - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ‘€ Customer Detail

+

Customer profiles and order history

+
+
+

Customer Detail Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Customer Detail. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/customer-loyalty.html b/servers/toast/src/ui/react-app/customer-loyalty.html new file mode 100644 index 0000000..cc59c9f --- /dev/null +++ b/servers/toast/src/ui/react-app/customer-loyalty.html @@ -0,0 +1,42 @@ + + + + + + Customer Loyalty - Toast MCP + + + + +
+ ← Back to Dashboard +
+

🎁 Customer Loyalty

+

Loyalty program management

+
+
+

Customer Loyalty Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Customer Loyalty. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/employee-dashboard.html b/servers/toast/src/ui/react-app/employee-dashboard.html new file mode 100644 index 0000000..bd7dfcb --- /dev/null +++ b/servers/toast/src/ui/react-app/employee-dashboard.html @@ -0,0 +1,42 @@ + + + + + + Employee Dashboard - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ‘₯ Employee Dashboard

+

Staff directory and performance overview

+
+
+

Employee Dashboard Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Employee Dashboard. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/employee-schedule.html b/servers/toast/src/ui/react-app/employee-schedule.html new file mode 100644 index 0000000..fe896f1 --- /dev/null +++ b/servers/toast/src/ui/react-app/employee-schedule.html @@ -0,0 +1,42 @@ + + + + + + Employee Schedule - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ“… Employee Schedule

+

Shift scheduling and time-off management

+
+
+

Employee Schedule Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Employee Schedule. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/index.html b/servers/toast/src/ui/react-app/index.html new file mode 100644 index 0000000..b137e8b --- /dev/null +++ b/servers/toast/src/ui/react-app/index.html @@ -0,0 +1,241 @@ + + + + + + Toast MCP - Dashboard + + + +
+
+

🍽️ Toast MCP Dashboard

+

Complete restaurant management platform with 18 specialized apps

+
+
+ +
+
+

πŸ“¦ Orders & Service

+
+ +

Order Dashboard

+

Real-time order monitoring and status tracking

+ LIVE + + +

Order Detail

+

Deep dive into individual orders with full history

+ ANALYTICS + + +

Order Grid

+

Multi-order view with filtering and bulk actions

+ PRODUCTIVITY + + +

Table Map

+

Visual floor plan with table status and assignments

+ VISUAL + +
+
+ +
+

πŸ” Menu Management

+
+ +

Menu Manager

+

Full menu editing, pricing, and 86 management

+ ADMIN + + +

Menu Item Detail

+

Detailed item configuration and modifiers

+ CONFIGURATION + + +

Menu Performance

+

Sales analytics and item profitability tracking

+ ANALYTICS + +
+
+ +
+

πŸ‘₯ Staff & Labor

+
+ +

Employee Dashboard

+

Staff directory and performance overview

+ MANAGEMENT + + +

Employee Schedule

+

Shift scheduling and time-off management

+ SCHEDULING + + +

Labor Dashboard

+

Real-time labor cost tracking and forecasting

+ ANALYTICS + + +

Tip Summary

+

Tip distribution and employee earnings

+ PAYROLL + +
+
+ +
+

πŸ’° Payments & Finance

+
+ +

Payment History

+

Transaction log with search and filtering

+ FINANCE + + +

Sales Dashboard

+

Comprehensive sales metrics and trends

+ ANALYTICS + + +

Revenue by Hour

+

Hourly sales breakdown and peak time analysis

+ INSIGHTS + +
+
+ +
+

πŸ“Š Inventory & Operations

+
+ +

Inventory Tracker

+

Stock levels, 86\'d items, and reorder alerts

+ INVENTORY + + +

Restaurant Overview

+

System configuration and location settings

+ SETTINGS + +
+
+ +
+

πŸ‘€ Customer Management

+
+ +

Customer Detail

+

Customer profiles and order history

+ CRM + + +

Customer Loyalty

+

Loyalty program management and rewards tracking

+ MARKETING + +
+
+
+ + diff --git a/servers/toast/src/ui/react-app/inventory-tracker.html b/servers/toast/src/ui/react-app/inventory-tracker.html new file mode 100644 index 0000000..7e445c8 --- /dev/null +++ b/servers/toast/src/ui/react-app/inventory-tracker.html @@ -0,0 +1,42 @@ + + + + + + Inventory Tracker - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ“¦ Inventory Tracker

+

Stock levels and reorder alerts

+
+
+

Inventory Tracker Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Inventory Tracker. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/labor-dashboard.html b/servers/toast/src/ui/react-app/labor-dashboard.html new file mode 100644 index 0000000..6ece480 --- /dev/null +++ b/servers/toast/src/ui/react-app/labor-dashboard.html @@ -0,0 +1,42 @@ + + + + + + Labor Dashboard - Toast MCP + + + + +
+ ← Back to Dashboard +
+

⏱️ Labor Dashboard

+

Real-time labor cost tracking and forecasting

+
+
+

Labor Dashboard Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Labor Dashboard. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/menu-item-detail.html b/servers/toast/src/ui/react-app/menu-item-detail.html new file mode 100644 index 0000000..ba84ec0 --- /dev/null +++ b/servers/toast/src/ui/react-app/menu-item-detail.html @@ -0,0 +1,42 @@ + + + + + + Menu Item Detail - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ“ Menu Item Detail

+

Detailed item configuration and modifiers

+
+
+

Menu Item Detail Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Menu Item Detail. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/menu-manager.html b/servers/toast/src/ui/react-app/menu-manager.html new file mode 100644 index 0000000..2cc849b --- /dev/null +++ b/servers/toast/src/ui/react-app/menu-manager.html @@ -0,0 +1,42 @@ + + + + + + Menu Manager - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ” Menu Manager

+

Full menu editing, pricing, and 86 management

+
+
+

Menu Manager Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Menu Manager. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/menu-performance.html b/servers/toast/src/ui/react-app/menu-performance.html new file mode 100644 index 0000000..6dd1484 --- /dev/null +++ b/servers/toast/src/ui/react-app/menu-performance.html @@ -0,0 +1,42 @@ + + + + + + Menu Performance - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ“Š Menu Performance

+

Sales analytics and item profitability

+
+
+

Menu Performance Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Menu Performance. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/order-dashboard.html b/servers/toast/src/ui/react-app/order-dashboard.html new file mode 100644 index 0000000..a4e6914 --- /dev/null +++ b/servers/toast/src/ui/react-app/order-dashboard.html @@ -0,0 +1,201 @@ + + + + + + Order Dashboard - Toast MCP + + + + +
+ ← Back to Dashboard + +
+

πŸ“¦ Order Dashboard

+

Real-time order monitoring and status tracking

+
+ +
+ + + +
+ +
+
+
0
+
Total Orders
+
+
+
0
+
Open Orders
+
+
+
$0
+
Total Sales
+
+
+
$0
+
Avg Check
+
+
+ +
+

Active Orders

+
+
Loading orders...
+
+
+
+ + + + diff --git a/servers/toast/src/ui/react-app/order-detail.html b/servers/toast/src/ui/react-app/order-detail.html new file mode 100644 index 0000000..2093e77 --- /dev/null +++ b/servers/toast/src/ui/react-app/order-detail.html @@ -0,0 +1,150 @@ + + + + + + Order Detail - Toast MCP + + + + +
+ ← Back to Orders + +
+

πŸ“‹ Order Detail

+

Complete order information and history

+
+ +
+
+

Order Information

+
+ + + + + + +
Order GUID:-
Opened:-
Closed:-
Source:-
Guests:-
Status:-
+ + +
+

Payment Summary

+
+
$0
+
Total Amount
+
+
+ + +
+
+ + +
+

Items

+
+
+ +
+

Payments

+
+
+ + + + + diff --git a/servers/toast/src/ui/react-app/order-grid.html b/servers/toast/src/ui/react-app/order-grid.html new file mode 100644 index 0000000..6f60bde --- /dev/null +++ b/servers/toast/src/ui/react-app/order-grid.html @@ -0,0 +1,77 @@ + + + + + + Order Grid - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ“Š Order Grid

+

Multi-order view with filtering and bulk actions

+
+
+ + + + +
+
+ + + + + + + + + + + + + +
Check #TimeSourceItemsTotalStatus
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/payment-history.html b/servers/toast/src/ui/react-app/payment-history.html new file mode 100644 index 0000000..5522d86 --- /dev/null +++ b/servers/toast/src/ui/react-app/payment-history.html @@ -0,0 +1,42 @@ + + + + + + Payment History - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ’³ Payment History

+

Transaction log with search and filtering

+
+
+

Payment History Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Payment History. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/restaurant-overview.html b/servers/toast/src/ui/react-app/restaurant-overview.html new file mode 100644 index 0000000..0118f05 --- /dev/null +++ b/servers/toast/src/ui/react-app/restaurant-overview.html @@ -0,0 +1,42 @@ + + + + + + Restaurant Overview - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸͺ Restaurant Overview

+

System configuration and location settings

+
+
+

Restaurant Overview Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Restaurant Overview. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/revenue-by-hour.html b/servers/toast/src/ui/react-app/revenue-by-hour.html new file mode 100644 index 0000000..72a7309 --- /dev/null +++ b/servers/toast/src/ui/react-app/revenue-by-hour.html @@ -0,0 +1,42 @@ + + + + + + Revenue by Hour - Toast MCP + + + + +
+ ← Back to Dashboard +
+

⏰ Revenue by Hour

+

Hourly sales breakdown and peak times

+
+
+

Revenue by Hour Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Revenue by Hour. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/sales-dashboard.html b/servers/toast/src/ui/react-app/sales-dashboard.html new file mode 100644 index 0000000..41d072a --- /dev/null +++ b/servers/toast/src/ui/react-app/sales-dashboard.html @@ -0,0 +1,42 @@ + + + + + + Sales Dashboard - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ’° Sales Dashboard

+

Comprehensive sales metrics and trends

+
+
+

Sales Dashboard Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Sales Dashboard. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/shared.js b/servers/toast/src/ui/react-app/shared.js new file mode 100644 index 0000000..63c9731 --- /dev/null +++ b/servers/toast/src/ui/react-app/shared.js @@ -0,0 +1,315 @@ +// Shared UI components and utilities for Toast MCP apps + +// Dark theme styles +const DARK_THEME = ` + * { + margin: 0; + padding: 0; + box-sizing: border-box; + } + + body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + background: #0f0f0f; + color: #e0e0e0; + line-height: 1.6; + } + + .app-container { + max-width: 1600px; + margin: 0 auto; + padding: 20px; + } + + header { + background: #1a1a1a; + border-bottom: 2px solid #2d2d2d; + padding: 20px; + margin-bottom: 30px; + border-radius: 8px; + } + + h1 { + color: #00bfa5; + font-size: 2rem; + font-weight: 700; + margin-bottom: 10px; + } + + h2 { + color: #fff; + font-size: 1.5rem; + margin-bottom: 15px; + } + + h3 { + color: #00bfa5; + font-size: 1.2rem; + margin-bottom: 10px; + } + + .subtitle { + color: #888; + font-size: 0.9rem; + } + + .back-link { + color: #00bfa5; + text-decoration: none; + display: inline-block; + margin-bottom: 20px; + font-size: 0.9rem; + } + + .back-link:hover { + text-decoration: underline; + } + + .card { + background: #1a1a1a; + border: 1px solid #2d2d2d; + border-radius: 8px; + padding: 24px; + margin-bottom: 20px; + } + + .grid { + display: grid; + gap: 20px; + margin-top: 20px; + } + + .grid-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } + .grid-3 { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); } + .grid-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } + + .stat-card { + background: #232323; + padding: 20px; + border-radius: 6px; + border: 1px solid #2d2d2d; + } + + .stat-value { + font-size: 2rem; + font-weight: 700; + color: #00bfa5; + margin-bottom: 5px; + } + + .stat-label { + color: #888; + font-size: 0.85rem; + text-transform: uppercase; + letter-spacing: 0.5px; + } + + table { + width: 100%; + border-collapse: collapse; + } + + th { + background: #232323; + color: #00bfa5; + padding: 12px; + text-align: left; + font-weight: 600; + border-bottom: 2px solid #2d2d2d; + } + + td { + padding: 12px; + border-bottom: 1px solid #2d2d2d; + } + + tr:hover { + background: #1f1f1f; + } + + .badge { + display: inline-block; + padding: 4px 10px; + border-radius: 4px; + font-size: 0.75rem; + font-weight: 600; + text-transform: uppercase; + } + + .badge-success { background: #1b5e20; color: #4caf50; } + .badge-warning { background: #f57f17; color: #ffeb3b; } + .badge-error { background: #b71c1c; color: #f44336; } + .badge-info { background: #01579b; color: #03a9f4; } + .badge-default { background: #2d2d2d; color: #00bfa5; } + + button { + background: #00bfa5; + color: #000; + border: none; + padding: 10px 20px; + border-radius: 6px; + font-size: 0.9rem; + font-weight: 600; + cursor: pointer; + transition: all 0.2s ease; + } + + button:hover { + background: #00e5c2; + transform: translateY(-1px); + } + + button:active { + transform: translateY(0); + } + + button.secondary { + background: #2d2d2d; + color: #00bfa5; + } + + button.secondary:hover { + background: #3d3d3d; + } + + input, select { + background: #232323; + border: 1px solid #2d2d2d; + color: #e0e0e0; + padding: 10px; + border-radius: 6px; + font-size: 0.9rem; + width: 100%; + } + + input:focus, select:focus { + outline: none; + border-color: #00bfa5; + } + + .form-group { + margin-bottom: 15px; + } + + label { + display: block; + color: #999; + font-size: 0.85rem; + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.5px; + } + + .loading { + text-align: center; + padding: 40px; + color: #888; + } + + .error { + background: #b71c1c; + color: #fff; + padding: 12px; + border-radius: 6px; + margin-bottom: 20px; + } + + .success { + background: #1b5e20; + color: #fff; + padding: 12px; + border-radius: 6px; + margin-bottom: 20px; + } + + .toolbar { + display: flex; + gap: 10px; + margin-bottom: 20px; + flex-wrap: wrap; + } + + .search-box { + flex: 1; + min-width: 200px; + } +`; + +// Format currency +function formatCurrency(cents) { + return new Intl.NumberFormat('en-US', { + style: 'currency', + currency: 'USD', + }).format(cents / 100); +} + +// Format date +function formatDate(dateString) { + return new Date(dateString).toLocaleString('en-US', { + month: 'short', + day: 'numeric', + year: 'numeric', + hour: 'numeric', + minute: '2-digit', + }); +} + +// Format business date (YYYYMMDD) +function formatBusinessDate(businessDate) { + const str = businessDate.toString(); + const year = str.substring(0, 4); + const month = str.substring(4, 6); + const day = str.substring(6, 8); + return `${month}/${day}/${year}`; +} + +// Get today's business date +function getTodayBusinessDate() { + const now = new Date(); + const year = now.getFullYear(); + const month = String(now.getMonth() + 1).padStart(2, '0'); + const day = String(now.getDate()).padStart(2, '0'); + return parseInt(`${year}${month}${day}`); +} + +// Client-side state management +class AppState { + constructor() { + this.data = {}; + this.listeners = new Map(); + } + + set(key, value) { + this.data[key] = value; + this.notify(key, value); + } + + get(key) { + return this.data[key]; + } + + subscribe(key, callback) { + if (!this.listeners.has(key)) { + this.listeners.set(key, []); + } + this.listeners.get(key).push(callback); + } + + notify(key, value) { + if (this.listeners.has(key)) { + this.listeners.get(key).forEach(cb => cb(value)); + } + } +} + +// Export for use in apps +if (typeof window !== 'undefined') { + window.ToastUI = { + DARK_THEME, + formatCurrency, + formatDate, + formatBusinessDate, + getTodayBusinessDate, + AppState, + }; +} diff --git a/servers/toast/src/ui/react-app/table-map.html b/servers/toast/src/ui/react-app/table-map.html new file mode 100644 index 0000000..97fa7be --- /dev/null +++ b/servers/toast/src/ui/react-app/table-map.html @@ -0,0 +1,42 @@ + + + + + + Table Map - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ—ΊοΈ Table Map

+

Visual floor plan with table status

+
+
+

Table Map Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Table Map. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/react-app/tip-summary.html b/servers/toast/src/ui/react-app/tip-summary.html new file mode 100644 index 0000000..87ddc49 --- /dev/null +++ b/servers/toast/src/ui/react-app/tip-summary.html @@ -0,0 +1,42 @@ + + + + + + Tip Summary - Toast MCP + + + + +
+ ← Back to Dashboard +
+

πŸ’΅ Tip Summary

+

Tip distribution and employee earnings

+
+
+

Tip Summary Interface

+
+
+
0
+
Total Items
+
+
+
$0
+
Value
+
+
+
0
+
Active
+
+
+
+

Client-side demo interface for Tip Summary. Connect to Toast API for live data.

+
+
+
+ + + diff --git a/servers/toast/src/ui/revenue-centers/src/App.tsx b/servers/toast/src/ui/revenue-centers/src/App.tsx new file mode 100644 index 0000000..9c56e51 --- /dev/null +++ b/servers/toast/src/ui/revenue-centers/src/App.tsx @@ -0,0 +1,73 @@ +import React from 'react'; + +const App: React.FC = () => { + const centers = [ + { name: 'Bar', sales: 8420.50, orders: 94, avgCheck: 89.58 }, + { name: 'Main Dining', sales: 15678.25, orders: 156, avgCheck: 100.50 }, + { name: 'Patio', sales: 5234.00, orders: 68, avgCheck: 76.97 }, + { name: 'Takeout', sales: 3890.75, orders: 52, avgCheck: 74.82 }, + ]; + + return ( +
+
+

Revenue Centers

+ +
+ +
+
Total Revenue
+
$33,223.50
+
370 orders
+
+ +
+ {centers.map((center) => ( +
+

{center.name}

+
+ Sales: + ${center.sales.toFixed(2)} +
+
+ Orders: + {center.orders} +
+
+ Avg Check: + ${center.avgCheck.toFixed(2)} +
+
+
+
+
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + select: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px' }, + totalCard: { backgroundColor: '#1e40af', borderRadius: '8px', padding: '30px', textAlign: 'center', marginBottom: '30px' }, + totalLabel: { fontSize: '16px', marginBottom: '8px' }, + totalValue: { fontSize: '48px', fontWeight: 'bold', marginBottom: '8px' }, + totalOrders: { fontSize: '14px', opacity: 0.8 }, + grid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(280px, 1fr))', gap: '20px' }, + card: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + cardTitle: { fontSize: '20px', fontWeight: '600', marginBottom: '16px', color: '#60a5fa' }, + metric: { display: 'flex', justifyContent: 'space-between', marginBottom: '12px', fontSize: '14px' }, + metricLabel: { color: '#9ca3af' }, + metricValue: { fontWeight: '600' }, + progressBar: { height: '8px', backgroundColor: '#333', borderRadius: '4px', overflow: 'hidden', marginTop: '16px' }, + progressFill: { height: '100%', backgroundColor: '#22c55e', transition: 'width 0.3s' }, +}; + +export default App; diff --git a/servers/toast/src/ui/sales-analytics/src/App.tsx b/servers/toast/src/ui/sales-analytics/src/App.tsx new file mode 100644 index 0000000..a5d9293 --- /dev/null +++ b/servers/toast/src/ui/sales-analytics/src/App.tsx @@ -0,0 +1,68 @@ +import React from 'react'; + +const App: React.FC = () => { + return ( +
+
+

Sales Analytics

+ +
+ +
+
+
Total Sales
+
$12,456
+
+12.5% from yesterday
+
+
+
Total Orders
+
156
+
+8.2% from yesterday
+
+
+
Avg Order Value
+
$79.85
+
+3.1% from yesterday
+
+
+
Total Guests
+
312
+
+15.4% from yesterday
+
+
+ +
+
+

Sales by Hour

+
[Bar Chart Placeholder]
+
+
+

Sales by Dining Option

+
[Pie Chart Placeholder]
+
+
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + select: { backgroundColor: '#1a1a1a', color: '#e0e0e0', border: '1px solid #333', padding: '10px', borderRadius: '6px' }, + statsGrid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(250px, 1fr))', gap: '20px', marginBottom: '30px' }, + statCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + statLabel: { fontSize: '14px', color: '#9ca3af', marginBottom: '8px' }, + statValue: { fontSize: '32px', fontWeight: 'bold', marginBottom: '8px', color: '#fff' }, + statChange: { fontSize: '14px', color: '#22c55e' }, + chartsGrid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(400px, 1fr))', gap: '20px' }, + chartCard: { backgroundColor: '#1a1a1a', border: '1px solid #333', borderRadius: '8px', padding: '20px' }, + chartTitle: { fontSize: '18px', fontWeight: '600', marginBottom: '16px' }, + chartPlaceholder: { height: '300px', display: 'flex', alignItems: 'center', justifyContent: 'center', backgroundColor: '#111', borderRadius: '4px', color: '#666' }, +}; + +export default App; diff --git a/servers/toast/src/ui/table-manager/src/App.tsx b/servers/toast/src/ui/table-manager/src/App.tsx new file mode 100644 index 0000000..4e721ae --- /dev/null +++ b/servers/toast/src/ui/table-manager/src/App.tsx @@ -0,0 +1,65 @@ +import React from 'react'; + +const App: React.FC = () => { + const tables = [ + { number: '1', capacity: 2, status: 'available' }, + { number: '2', capacity: 4, status: 'occupied', guest: 'Smith' }, + { number: '3', capacity: 4, status: 'occupied', guest: 'Johnson' }, + { number: '4', capacity: 6, status: 'reserved', guest: 'Williams' }, + { number: '5', capacity: 2, status: 'available' }, + { number: '6', capacity: 8, status: 'occupied', guest: 'Brown' }, + ]; + + const getStatusColor = (status: string) => { + switch (status) { + case 'available': return '#166534'; + case 'occupied': return '#991b1b'; + case 'reserved': return '#854d0e'; + default: return '#374151'; + } + }; + + return ( +
+
+

Table Manager

+
+ Available + Occupied + Reserved +
+
+ +
+ {tables.map((table) => ( +
+
Table {table.number}
+
Capacity: {table.capacity}
+
+ {table.status.toUpperCase()} +
+ {table.guest &&
Guest: {table.guest}
} + +
+ ))} +
+
+ ); +}; + +const styles: Record = { + container: { minHeight: '100vh', backgroundColor: '#0a0a0a', color: '#e0e0e0', padding: '20px', fontFamily: 'system-ui' }, + header: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '30px' }, + title: { fontSize: '28px', fontWeight: 'bold', margin: 0, color: '#fff' }, + legend: { display: 'flex', gap: '12px' }, + legendItem: { padding: '6px 12px', borderRadius: '4px', fontSize: '12px', fontWeight: '600' }, + tablesGrid: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(200px, 1fr))', gap: '20px' }, + tableCard: { backgroundColor: '#1a1a1a', border: '3px solid', borderRadius: '8px', padding: '20px', textAlign: 'center' }, + tableNumber: { fontSize: '24px', fontWeight: 'bold', marginBottom: '8px' }, + capacity: { fontSize: '14px', color: '#9ca3af', marginBottom: '12px' }, + status: { padding: '6px 12px', borderRadius: '4px', fontSize: '12px', fontWeight: '600', marginBottom: '8px', display: 'inline-block' }, + guest: { fontSize: '14px', marginBottom: '12px', fontStyle: 'italic' }, + viewButton: { width: '100%', padding: '10px', backgroundColor: '#2563eb', color: '#fff', border: 'none', borderRadius: '4px', cursor: 'pointer', fontSize: '14px', fontWeight: '600' }, +}; + +export default App; diff --git a/servers/toast/tsconfig.json b/servers/toast/tsconfig.json index 2729a67..4bfd03f 100644 --- a/servers/toast/tsconfig.json +++ b/servers/toast/tsconfig.json @@ -1,21 +1,28 @@ { "compilerOptions": { "target": "ES2022", - "module": "Node16", - "lib": ["ES2022", "DOM"], - "jsx": "react-jsx", + "module": "ES2022", + "lib": ["ES2022"], + "moduleResolution": "node", "outDir": "./dist", "rootDir": "./src", "strict": true, "esModuleInterop": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true, - "resolveJsonModule": true, - "moduleResolution": "Node16", "declaration": true, "declarationMap": true, - "sourceMap": true + "sourceMap": true, + "resolveJsonModule": true, + "allowSyntheticDefaultImports": true, + "isolatedModules": true }, - "include": ["src/**/*"], - "exclude": ["node_modules", "dist", "src/ui/*/node_modules", "src/ui/*/dist"] + "include": [ + "src/**/*" + ], + "exclude": [ + "node_modules", + "dist", + "src/ui" + ] }