feat: add sql example #368
Conversation
WalkthroughThis pull request introduces a comprehensive example project called "example-vite-react-sql" that demonstrates the integration of Vite, React, TypeScript, and the Dojo Engine with a SQL endpoint. The project provides a fully configured development environment with routing, state management, UI components, and a playground for exploring game mechanics and database interactions. Changes
Sequence DiagramsequenceDiagram
participant User
participant App
participant DojoSDK
participant SQLEndpoint
User->>App: Access Application
App->>DojoSDK: Initialize SDK
DojoSDK-->>App: SDK Ready
User->>App: Interact with Playground
App->>SQLEndpoint: Query Database
SQLEndpoint-->>App: Return Results
App->>User: Display Data/Metrics
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 27
🧹 Nitpick comments (35)
examples/example-vite-react-sql/tsconfig.app.json (3)
3-7: Consider upgrading target to ES2022 or later.For a new project in 2025, ES2020 target might be too conservative. ES2022+ would provide access to newer JavaScript features while maintaining broad browser compatibility.
- "target": "ES2020", + "target": "ES2022", - "lib": ["ES2020", "DOM", "DOM.Iterable"], + "lib": ["ES2022", "DOM", "DOM.Iterable"],
15-19: Consider additional type-safety checks.While the current strict checks are good, consider adding these recommended TypeScript checks for enhanced type safety:
"strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true, + "noImplicitReturns": true, + "noUncheckedIndexedAccess": true, + "exactOptionalPropertyTypes": true,🧰 Tools
🪛 Biome (1.9.4)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
25-25: Consider expanding include patterns.The current include pattern might miss important files. Consider adding:
- "include": ["src"] + "include": ["src", "src/**/*.d.ts", "types/**/*.d.ts"]🧰 Tools
🪛 Biome (1.9.4)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-26: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/vite.config.ts (1)
8-16: Consider additional configuration options for security and compatibility.While the current configuration is functional, consider the following improvements:
- The
"esnext"build target might be too aggressive. Consider using"es2020"for better browser compatibility.- Add security-related configurations for SQL endpoints.
- Consider adding more common path aliases (e.g.,
@components,@utils).Here's a suggested enhancement:
export default defineConfig({ plugins: [TanStackRouterVite(), react(), wasm()], - build: { target: "esnext" }, + build: { + target: "es2020", + rollupOptions: { + output: { + manualChunks: { + vendor: ['react', 'react-dom'], + }, + }, + }, + }, resolve: { alias: { "@": path.resolve(__dirname, "./src"), + "@components": path.resolve(__dirname, "./src/components"), + "@utils": path.resolve(__dirname, "./src/utils"), }, }, + server: { + headers: { + 'X-Frame-Options': 'DENY', + 'X-Content-Type-Options': 'nosniff', + }, + }, });examples/example-vite-react-sql/tsconfig.node.json (1)
15-19: Consider additional type-checking options.While the current linting configuration provides good baseline checks, consider enabling these additional type-checking options for enhanced safety:
/* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, -"noFallthroughCasesInSwitch": true +"noFallthroughCasesInSwitch": true, +"noImplicitReturns": true, +"noUncheckedIndexedAccess": true🧰 Tools
🪛 Biome (1.9.4)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/src/hooks/useDojoStore.ts (1)
4-7: Enhance JSDoc documentation with usage examples.While the current documentation explains the purpose, it would be more helpful to include:
- Usage examples
- Available store methods
- Common patterns for state updates
examples/example-vite-react-sql/src/components/playground/playground.tsx (1)
5-13: Consider component organization and error handling.A few suggestions to enhance this component:
- Consider wrapping each major component in an ErrorBoundary to prevent cascading failures
- Add loading states for better UX
- Consider adding PropTypes or TypeScript interface for future props
Example implementation:
+import { ErrorBoundary } from 'react-error-boundary'; + export function Playground() { return ( <> - <Schema /> - <PlayerActions /> - <Metrics /> + <ErrorBoundary fallback={<div>Error loading schema</div>}> + <Schema /> + </ErrorBoundary> + <ErrorBoundary fallback={<div>Error loading actions</div>}> + <PlayerActions /> + </ErrorBoundary> + <ErrorBoundary fallback={<div>Error loading metrics</div>}> + <Metrics /> + </ErrorBoundary> </> ); }examples/example-vite-react-sql/src/routes/documentation.lazy.tsx (1)
8-14: Consider using semantic HTML and removing unnecessary wrapperThe
divwrapper aroundDocumentationis redundant and could be replaced with semantic HTML or removed entirely.function RouteComponent() { return ( - <div> - <Documentation /> - </div> + <Documentation /> ); }examples/example-vite-react-sql/src/components/playground/metrics.tsx (1)
8-11: Optimize grid layout and improve accessibilityThe grid is set to 4 columns but only contains 2 children, which may lead to unexpected spacing.
- <div className="grid grid-cols-4 gap-4"> + <div className="grid grid-cols-2 gap-4" role="region" aria-label="Metrics Dashboard">examples/example-vite-react-sql/src/components/playground/total-entities.tsx (1)
14-23: Add loading state and improve number formattingThe component should handle loading state and format large numbers for better readability.
export function TotalEntities() { - const { data: totalEntities } = useQuery(TOTAL_ENTITIES_QUERY, formatFn); + const { data: totalEntities, isLoading, error } = useQuery(TOTAL_ENTITIES_QUERY, formatFn); + + if (isLoading) return <div>Loading...</div>; + if (error) return <div>Error loading entities count</div>; + return ( <div> Total player spawned : <br /> - <b>{totalEntities}</b> + <b>{totalEntities?.toLocaleString()}</b> </div> ); }examples/example-vite-react-sql/eslint.config.js (1)
1-28: Consider adding security-focused ESLint rules.The configuration covers React and TypeScript essentials. Consider enhancing security by adding
eslint-plugin-securityto prevent common security issues.Add these rules to strengthen security:
export default tseslint.config( { ignores: ["dist"] }, { extends: [ js.configs.recommended, + "plugin:security/recommended", ...tseslint.configs.recommended ], plugins: { "react-hooks": reactHooks, "react-refresh": reactRefresh, + "security": security, },examples/example-vite-react-sql/src/hooks/useModel.ts (2)
16-16: Consider safer type assertion alternatives.The type assertion in
split("-")could be replaced with runtime validation for better type safety.- const [namespace, modelName] = model.split("-") as [N, M]; + const parts = model.split("-"); + if (parts.length !== 2) { + throw new Error("Invalid model format. Expected 'namespace-modelName'"); + } + const [namespace, modelName] = parts as [N, M];
19-24: Add null checks for better error handling.The nested optional chaining is good, but consider adding explicit error handling for missing data.
const modelData = useDojoStore( - (state) => - state.entities[entityId.toString()]?.models?.[namespace]?.[ - modelName - ] as SchemaType[N][M] | undefined + (state) => { + const entity = state.entities[entityId.toString()]; + if (!entity) { + console.warn(`Entity ${entityId} not found`); + return undefined; + } + return entity.models?.[namespace]?.[modelName] as SchemaType[N][M] | undefined; + } );examples/example-vite-react-sql/src/routes/__root.tsx (1)
8-9: Consider configuring QueryClient with default options.The QueryClient is created without any configuration. Consider adding default options for better error handling and caching behavior.
-const queryClient = new QueryClient(); +const queryClient = new QueryClient({ + defaultOptions: { + queries: { + staleTime: 5 * 60 * 1000, // 5 minutes + retry: 1, + refetchOnWindowFocus: false, + }, + }, +});examples/example-vite-react-sql/src/components/ui/popover.tsx (1)
12-28: Enhance accessibility with ARIA attributes and keyboard navigation.The popover implementation could benefit from additional accessibility features.
const PopoverContent = React.forwardRef< React.ElementRef<typeof PopoverPrimitive.Content>, React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content> ->(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( +>(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( <PopoverPrimitive.Portal> <PopoverPrimitive.Content ref={ref} align={align} sideOffset={sideOffset} + aria-modal="true" + role="dialog" className={cn( "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className )} + onKeyDown={(e) => { + if (e.key === 'Escape') { + e.preventDefault(); + props.onEscapeKeyDown?.(e); + } + }} {...props} /> </PopoverPrimitive.Portal>examples/example-vite-react-sql/src/typescript/contracts.gen.ts (1)
5-59: Consider adding input validation and constants.The contract interactions could benefit from input validation and constant definitions.
+const CONTRACT_NAME = 'actions'; +const SYSTEM_NAME = 'dojo_starter'; + +function validateDirection(direction: models.Direction): void { + const validDirections = ['up', 'down', 'left', 'right']; // adjust based on actual enum values + if (!validDirections.includes(direction)) { + throw new Error(`Invalid direction: ${direction}`); + } +} + export function setupWorld(provider: DojoProvider) { const build_actions_move_calldata = (direction: models.Direction) => { + validateDirection(direction); return { - contractName: "actions", + contractName: CONTRACT_NAME, entrypoint: "move", calldata: [direction], }; }; // ... rest of the implementation }examples/example-vite-react-sql/src/main.tsx (1)
40-43: Consider environment-specific configuration for domain settings.The domain configuration contains hardcoded values which might need to change across different environments.
Consider moving these values to environment variables:
domain: { - name: "WORLD_NAME", - version: "1.0", - chainId: "KATANA", - revision: "1", + name: process.env.VITE_WORLD_NAME ?? "WORLD_NAME", + version: process.env.VITE_WORLD_VERSION ?? "1.0", + chainId: process.env.VITE_CHAIN_ID ?? "KATANA", + revision: process.env.VITE_WORLD_REVISION ?? "1", }examples/example-vite-react-sql/src/dojo-sdk-provider.tsx (1)
38-41: Consider using a custom hook for context validation.The context validation logic could be reused across components.
+function useDojoContext() { + const context = useContext(DojoContext); + if (!context) { + throw new Error("useDojoContext must be used within a DojoProvider"); + } + return context; +} + export const DojoSdkProvider = ({ sdk, children, }) => { const currentValue = useContext(DojoContext); if (currentValue) { throw new Error("DojoProvider can only be used once"); }examples/example-vite-react-sql/src/components/playground/action.tsx (1)
37-61: Improve button accessibility and loading states.The movement buttons lack proper accessibility attributes and loading states.
<Button variant="outline" + aria-label="Move Left" + disabled={isLoading} onClick={async () => { + try { await moveCallback(Direction.Left) + } catch (error) { + console.error('Failed to move:', error); + } }} > + {isLoading ? 'Moving...' : 'Left'} - Left </Button>examples/example-vite-react-sql/src/components/ui/button.tsx (1)
7-35: Consider adding focus and active states to button variants.The button variants only handle hover states but lack focus and active states.
variants: { variant: { default: - "bg-primary text-primary-foreground shadow hover:bg-primary/90", + "bg-primary text-primary-foreground shadow hover:bg-primary/90 focus:bg-primary/95 active:bg-primary/100", destructive: - "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90", + "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90 focus:bg-destructive/95 active:bg-destructive/100",examples/example-vite-react-sql/src/components/ui/accordion.tsx (2)
10-20: Consider adding prop types documentation.While the TypeScript types are well-defined, adding JSDoc comments would improve developer experience by providing inline documentation.
+/** + * AccordionItem component that wraps Radix UI's AccordionItem primitive. + * @param className - Additional CSS classes to apply + * @param props - Additional props to pass to the AccordionItem + */ const AccordionItem = React.forwardRef<
26-39: Add aria-label for better accessibility.The accordion trigger should have an aria-label for better screen reader support.
<AccordionPrimitive.Header className="flex"> <AccordionPrimitive.Trigger ref={ref} + aria-label="Toggle accordion section" className={cn(examples/example-vite-react-sql/src/components/playground/schema.tsx (1)
22-34: Consider parameterizing the SQL query.While the current query looks safe, it's a good practice to use parameterized queries to prevent SQL injection vulnerabilities.
examples/example-vite-react-sql/tailwind.config.ts (1)
34-75: Consider documenting custom color variables.Add comments explaining the expected HSL values for custom color variables to help maintain consistency.
+ // Custom colors using HSL format + // --background: <hue> <saturation>% <lightness>% colors: { background: "hsl(var(--background))",examples/example-vite-react-sql/src/components/wallet-provider.tsx (1)
30-32: Enhance error handling in connect function.The current error handling only logs to console. Consider showing user feedback for connection failures.
} catch (error) { - console.error(error); + console.error('Wallet connection failed:', error); + // Consider adding a toast notification or error state + // to show feedback to the user }examples/example-vite-react-sql/src/hooks/usePlayerActions.ts (2)
36-44: Improve error handling in subscription callback.The error handling could be more robust by implementing proper error recovery and user feedback.
if (error) { - console.error("Error setting up entity sync:", error); + console.error("Entity sync failed:", error); + // Consider implementing retry logic + // Example: + // setTimeout(() => subscribe(address), 5000); } else if ( data && (data[0] as ParsedEntity<SchemaType>).entityId !== "0x0" ) { state.updateEntity(data[0] as ParsedEntity<SchemaType>); +} else { + console.warn("Received invalid entity data"); }
74-89: Consolidate error handling patterns.The error handling pattern is duplicated across the file. Consider extracting it into a reusable utility.
// Add at the top of the file: const handleQueryError = (error: any, context: string) => { console.error(`Error in ${context}:`, error); // Add common error handling logic here }; // Then replace the error handling blocks with: if (resp.error) { handleQueryError(resp.error, 'entity query'); return; } // ... } catch (error) { handleQueryError(error, 'entity fetch'); }examples/example-vite-react-sql/src/hooks/useSystemCalls.ts (1)
78-81: Address TODO comment about enum parsing.The comment indicates a need for proper enum conversion in the SDK.
Would you like me to help create a GitHub issue to track the implementation of proper enum parsing in the SDK? This would help improve type safety and reduce the need for type assertions.
examples/example-vite-react-sql/src/components/Documentation.tsx (3)
11-11: Fix typo in documentation text."vbe" should be "be" in the sentence.
- endpoint is not meant to vbe used as a state query system. + endpoint is not meant to be used as a state query system.
116-146: Consider moving styles to a separate CSS module or using Tailwind.The current implementation uses inline styles within a
<style>tag. Consider:
- Moving styles to a separate CSS module
- Using Tailwind classes (recommended since Tailwind is already set up in the project)
25-27: Improve code example formatting and add error handling.The fetch examples could be improved with proper error handling and formatting.
- {`fetch(\`\$\{process.env.TORII_URL\}\`/sql?' + -new URLSearchParams({ q: "SELECT name from contracts", }))`} + {`const response = await fetch(\`\${process.env.TORII_URL}/sql?\${ + new URLSearchParams({ + q: "SELECT name from contracts" + }) +}\`); + +if (!response.ok) { + throw new Error(\`HTTP error! status: \${response.status}\`); +} + +const data = await response.json();`}Also applies to: 36-42
examples/example-vite-react-sql/src/typescript/models.gen.ts (1)
81-94: Add input validation to parse method.The
parsemethod could benefit from stronger input validation.export function parse(d: string): Direction { + if (!d || typeof d !== 'string') { + throw new Error("Input must be a non-empty string"); + } + const normalizedInput = d.trim(); switch (d) {scripts/build-examples.sh (1)
Line range hint
20-24: Consider making the directory navigation more robust.The current directory navigation assumes a fixed depth. Consider using absolute paths or storing the initial directory to make the navigation more reliable.
+ initial_dir=$(pwd) for example in "${examples[@]}"; do echo "Building in $example..." cd "$example" pnpm run build - cd ../../ + cd "$initial_dir" doneexamples/example-vite-react-sql/index.html (2)
5-13: Consider enhancing theme management robustness.While the theme implementation works, consider these improvements:
- Add error handling for localStorage access
- Use
try-catchto handle potential SecurityError in private browsing- Consider using a CSS variable strategy for smoother theme transitions
<script> - let theme = localStorage.getItem("dojo-react-sql-theme"); - if (!theme) - theme = window.matchMedia("(prefers-color-scheme: dark)") - .matches - ? "dark" - : "light"; - document.documentElement.classList.toggle("dark", theme === "dark"); + try { + let theme = localStorage.getItem("dojo-react-sql-theme"); + if (!theme) { + theme = window.matchMedia("(prefers-color-scheme: dark)") + .matches + ? "dark" + : "light"; + } + document.documentElement.classList.toggle("dark", theme === "dark"); + } catch (e) { + // Fallback to light theme if localStorage is unavailable + console.warn("Theme persistence unavailable:", e); + } </script>
1-22: Consider adding accessibility enhancements.Add these accessibility improvements:
- Meta description for SEO
- Theme-color meta tag for mobile browsers
- Skip-to-main-content link for keyboard navigation
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> + <meta name="description" content="Dojo Engine SQL Example with Vite and React" /> + <meta name="theme-color" content="#000000" /> <!-- theme script --> <link rel="icon" type="image/svg+xml" href="/vite.svg" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Vite + React + TS</title> </head> <body> + <a href="#root" class="skip-to-main-content">Skip to main content</a> <div id="root"></div> <script type="module" src="/src/main.tsx"></script> </body> </html>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (48)
examples/example-vite-react-sql/.gitignore(1 hunks)examples/example-vite-react-sql/README.md(1 hunks)examples/example-vite-react-sql/components.json(1 hunks)examples/example-vite-react-sql/dojoConfig.ts(1 hunks)examples/example-vite-react-sql/eslint.config.js(1 hunks)examples/example-vite-react-sql/index.html(1 hunks)examples/example-vite-react-sql/package.json(1 hunks)examples/example-vite-react-sql/postcss.config.js(1 hunks)examples/example-vite-react-sql/src/components/Documentation.tsx(1 hunks)examples/example-vite-react-sql/src/components/header.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/action.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/direction-count.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/metrics.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/playground.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/schema.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/total-entities.tsx(1 hunks)examples/example-vite-react-sql/src/components/starknet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/theme-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/accordion.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/button.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/popover.tsx(1 hunks)examples/example-vite-react-sql/src/components/wallet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/dojo-sdk-provider.tsx(1 hunks)examples/example-vite-react-sql/src/hooks/useDojoStore.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useModel.ts(1 hunks)examples/example-vite-react-sql/src/hooks/usePlayerActions.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useQuery.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useSystemCalls.ts(1 hunks)examples/example-vite-react-sql/src/index.css(1 hunks)examples/example-vite-react-sql/src/lib/utils.ts(1 hunks)examples/example-vite-react-sql/src/main.tsx(1 hunks)examples/example-vite-react-sql/src/routeTree.gen.ts(1 hunks)examples/example-vite-react-sql/src/routes/__root.tsx(1 hunks)examples/example-vite-react-sql/src/routes/documentation.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/index.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/playground.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/typescript/contracts.gen.ts(1 hunks)examples/example-vite-react-sql/src/typescript/models.gen.ts(1 hunks)examples/example-vite-react-sql/tailwind.config.ts(1 hunks)examples/example-vite-react-sql/tsconfig.app.json(1 hunks)examples/example-vite-react-sql/tsconfig.app.tsbuildinfo(1 hunks)examples/example-vite-react-sql/tsconfig.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.tsbuildinfo(1 hunks)examples/example-vite-react-sql/vite.config.ts(1 hunks)packages/create-dojo/src/commands/start.ts(1 hunks)scripts/build-examples.sh(2 hunks)
✅ Files skipped from review due to trivial changes (10)
- examples/example-vite-react-sql/dojoConfig.ts
- examples/example-vite-react-sql/tsconfig.node.tsbuildinfo
- examples/example-vite-react-sql/tsconfig.app.tsbuildinfo
- examples/example-vite-react-sql/components.json
- examples/example-vite-react-sql/.gitignore
- examples/example-vite-react-sql/tsconfig.json
- examples/example-vite-react-sql/postcss.config.js
- examples/example-vite-react-sql/README.md
- examples/example-vite-react-sql/src/routeTree.gen.ts
- examples/example-vite-react-sql/package.json
🧰 Additional context used
🪛 Biome (1.9.4)
examples/example-vite-react-sql/tsconfig.node.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-22: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
examples/example-vite-react-sql/src/hooks/useQuery.ts
[error] 3-3: Don't use 'Function' as a type.
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
(lint/complexity/noBannedTypes)
examples/example-vite-react-sql/src/typescript/models.gen.ts
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
examples/example-vite-react-sql/tsconfig.app.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-23: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 24-24: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-26: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: check
- GitHub Check: build
🔇 Additional comments (17)
examples/example-vite-react-sql/src/index.css (4)
1-3: LGTM! Tailwind directives are correctly configured.The Tailwind CSS layers are imported in the correct order: base → components → utilities.
5-31: LGTM! Well-structured theme variables with semantic naming.The light theme implementation uses semantic naming conventions and provides comprehensive coverage of UI states, including specialized chart colors.
32-57: Verify color contrast ratios for accessibility compliance.While the dark theme implementation looks good, please ensure that all color combinations meet WCAG 2.1 contrast requirements, particularly for text and interactive elements.
You can verify the contrast ratios using the following tools:
- WebAIM Contrast Checker
- WAVE Web Accessibility Tool
- Chrome DevTools' Accessibility features
59-66: LGTM! Base styles are properly configured.The base styles are correctly implemented using Tailwind's @apply directive and properly utilize the theme variables.
examples/example-vite-react-sql/tsconfig.app.json (2)
8-14: LGTM! Well-configured bundler settings.The bundler mode settings are optimally configured for a Vite + React application, with appropriate module resolution and JSX transformation settings.
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
20-23: LGTM! Standard path alias configuration.The path alias configuration follows common conventions for React applications.
🧰 Tools
🪛 Biome (1.9.4)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-23: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/vite.config.ts (1)
1-5: Verify SQL-related configuration requirements.The imports cover React, WebAssembly, and routing needs. However, since this is an SQL example project, please verify if any additional configurations or plugins are needed for SQL functionality (e.g., proxy settings for SQL endpoints, CORS configurations).
✅ Verification successful
No additional SQL-related Vite configurations required
The current configuration is sufficient as SQL functionality is implemented through HTTP endpoints and runtime libraries. The WebAssembly plugin already covers any WASM requirements for the SQL client library.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Check for SQL-related configurations in the project # Look for SQL-related configurations or environment files fd -t f -e env -e env.example -e env.local rg -i "sql|database|db|proxy|cors" .env* package.jsonLength of output: 148
Script:
#!/bin/bash # Search for SQL-related code and configurations # Check package.json for SQL-related dependencies echo "=== SQL-related dependencies ===" rg -i "sql|sqlite|mysql|postgres|database" package.json # Find SQL-related files echo -e "\n=== SQL-related files ===" fd -i sql # Search for SQL configurations and usage in source files echo -e "\n=== SQL configurations and usage ===" rg -i "sql|sqlite|mysql|postgres|database" -g "!*.{lock,md}" -g "!package.json"Length of output: 9174
examples/example-vite-react-sql/tsconfig.node.json (3)
8-13: LGTM! Bundler mode is properly configured.The bundler settings are optimally configured for Vite, ensuring proper TypeScript module resolution and compatibility.
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
21-21: LGTM! Appropriate include path.The include path is correctly scoped to just the Vite configuration file, maintaining a clear separation of concerns.
🧰 Tools
🪛 Biome (1.9.4)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-22: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
2-6: LGTM! Verify Node.js version compatibility.The compiler options are well-configured for a modern development environment. However, ensure your deployment environment supports ES2022/ES2023 features.
✅ Verification successful
TypeScript configuration is compatible with Node.js 16+
The ES2022/ES2023 features in your TypeScript configuration, combined with the modern Vite setup and contemporary dependencies, indicate that Node.js 16 or later is required for this project. Consider adding this requirement to
package.json'senginesfield:{ "engines": { "node": ">=16" } }🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Check if package.json specifies the required Node.js version jq '.engines.node' package.json 2>/dev/null || echo "No Node.js version constraint found in package.json"Length of output: 36
Script:
#!/bin/bash # Check for Node.js version requirements in various files echo "=== Checking .nvmrc ===" cat .nvmrc 2>/dev/null || echo "No .nvmrc file found" echo -e "\n=== Checking README.md ===" rg -i "node.*version|requires.*node" README.md 2>/dev/null || echo "No Node.js version info in README.md" echo -e "\n=== Checking package.json dependencies ===" jq '.dependencies + .devDependencies' package.json echo -e "\n=== Checking vite config ===" fd -e js -e ts -e mjs "vite.config" -x cat {}Length of output: 6084
examples/example-vite-react-sql/src/routes/index.lazy.tsx (1)
1-6: Implementation looks good!The route is properly configured with lazy loading, which is great for performance optimization.
examples/example-vite-react-sql/src/lib/utils.ts (1)
4-6: LGTM!The
cnfunction implementation correctly usesclsxandtwMergefor class name management.examples/example-vite-react-sql/src/components/ui/accordion.tsx (1)
8-8: LGTM! Good use of Radix UI primitives.The direct assignment to
AccordionPrimitive.Rootmaintains all accessibility features from Radix UI.examples/example-vite-react-sql/tailwind.config.ts (1)
4-4: Verify content paths for Tailwind scanning.Ensure that all paths containing Tailwind classes are included in the content array.
✅ Verification successful
Tailwind content paths are correctly configured
The paths
"./index.html"and"./src/**/*.{js,ts,jsx,tsx}"are correctly set relative to the project's root directory (examples/example-vite-react-sql/). All UI components that might use Tailwind classes are properly covered by these paths.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Check for potential files with Tailwind classes that might be missed fd -e tsx -e jsx -e html | grep -v -f <(echo "./index.html\n./src")Length of output: 124
Script:
#!/bin/bash # First verify if the configured paths exist echo "Checking configured paths:" [ -f "./index.html" ] && echo "✓ ./index.html exists" || echo "✗ ./index.html not found" [ -d "./src" ] && echo "✓ ./src directory exists" || echo "✗ ./src directory not found" echo -e "\nListing all potential UI files:" # List all UI-related files in the entire project fd -e tsx -e jsx -e html echo -e "\nChecking for UI files outside ./src:" # List files that are not in ./src or index.html fd -e tsx -e jsx -e html | grep -v "^./src\|^./index.html"Length of output: 11899
examples/example-vite-react-sql/src/components/header.tsx (1)
16-77: LGTM! Well-structured header component.The implementation demonstrates good practices:
- Proper use of semantic HTML with
headertag- Responsive design with proper class utilities
- Accessible theme toggle with proper aria labels
examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx (1)
1-202: Great implementation of the dropdown menu component!The code demonstrates excellent practices:
- Proper use of Radix UI for accessibility
- Well-typed with TypeScript
- Consistent styling approach with cn utility
- Good component composition
scripts/build-examples.sh (1)
17-17: LGTM! New example project added correctly.The addition of "example-vite-react-sql" to the examples array aligns with the PR objective.
| import { Playground } from "@/components/playground/playground"; | ||
| import { createLazyFileRoute } from "@tanstack/react-router"; | ||
|
|
||
| export const Route = createLazyFileRoute("/playground")({ | ||
| component: Playground, | ||
| }); |
There was a problem hiding this comment.
💡 Codebase verification
Confirmed: Route organization needs improvement
The codebase shows that the Playground component is indeed rendered at both "/" and "/playground" routes without any differentiation or redirection logic. This duplicates the entry point and may confuse users. Consider:
- Choose a single canonical route for the Playground component
- Implement a redirect from the other route
- Follow the pattern shown in the documentation route where each route has its dedicated component
🔗 Analysis chain
Consider route organization.
The Playground component is currently accessible at both "/" and "/playground" routes. This might be confusing for users and maintenance. Consider:
- Making one route redirect to the other
- Using different components for different routes
- Adding clear navigation between routes
Let's verify the route configuration:
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Check for route definitions and potential conflicts
rg -A 5 "createLazyFileRoute|createFileRoute" examples/example-vite-react-sql/src/routes/
Length of output: 1848
| export function shortAddress(address: string): string { | ||
| return `${address.slice(0, 6)}...${address.slice(-4)}`; | ||
| } |
There was a problem hiding this comment.
Add input validation to prevent runtime errors
The shortAddress function should validate its input to handle edge cases gracefully.
Here's a safer implementation:
export function shortAddress(address: string): string {
+ if (!address || address.length < 10) {
+ return address || '';
+ }
return `${address.slice(0, 6)}...${address.slice(-4)}`;
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export function shortAddress(address: string): string { | |
| return `${address.slice(0, 6)}...${address.slice(-4)}`; | |
| } | |
| export function shortAddress(address: string): string { | |
| if (!address || address.length < 10) { | |
| return address || ''; | |
| } | |
| return `${address.slice(0, 6)}...${address.slice(-4)}`; | |
| } |
| function formatFn(rows: QueryResponse): number { | ||
| return parseInt(rows[0].totalEntities); | ||
| } |
There was a problem hiding this comment.
Add error handling to formatFn
The function assumes the response array always has elements and doesn't handle potential parsing errors.
function formatFn(rows: QueryResponse): number {
- return parseInt(rows[0].totalEntities);
+ if (!rows?.length) return 0;
+ const count = parseInt(rows[0].totalEntities, 10);
+ return isNaN(count) ? 0 : count;
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function formatFn(rows: QueryResponse): number { | |
| return parseInt(rows[0].totalEntities); | |
| } | |
| function formatFn(rows: QueryResponse): number { | |
| if (!rows?.length) return 0; | |
| const count = parseInt(rows[0].totalEntities, 10); | |
| return isNaN(count) ? 0 : count; | |
| } |
| const TOTAL_ENTITIES_QUERY = | ||
| "SELECT count(id) as totalEntities from 'entities'"; | ||
|
|
There was a problem hiding this comment.
🛠️ Refactor suggestion
Improve SQL query robustness
The current query might return null for an empty table. Consider using COALESCE.
-const TOTAL_ENTITIES_QUERY =
- "SELECT count(id) as totalEntities from 'entities'";
+const TOTAL_ENTITIES_QUERY =
+ "SELECT COALESCE(count(id), 0) as totalEntities from 'entities'";📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const TOTAL_ENTITIES_QUERY = | |
| "SELECT count(id) as totalEntities from 'entities'"; | |
| const TOTAL_ENTITIES_QUERY = | |
| "SELECT COALESCE(count(id), 0) as totalEntities from 'entities'"; | |
| export function useQuery<Output, Input>( | ||
| query: string, | ||
| formatFn: (rows: Input) => Output, | ||
| defaultValue?: Output | ||
| ) { | ||
| const { data, error, isPending, isRefetching } = useTanStackQuery({ | ||
| queryKey: [query], | ||
| queryFn: async () => { | ||
| return await fetchSchema(query, formatFn); | ||
| }, | ||
| placeholderData: defaultValue ?? [], | ||
| }); | ||
|
|
||
| return { | ||
| data, | ||
| error, | ||
| isPending, | ||
| isRefetching, | ||
| }; | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add retry configuration and error type handling.
The query configuration could benefit from retry logic and better error typing.
export function useQuery<Output, Input>(
query: string,
formatFn: (rows: Input) => Output,
defaultValue?: Output
) {
const { data, error, isPending, isRefetching } = useTanStackQuery({
queryKey: [query],
queryFn: async () => {
return await fetchSchema(query, formatFn);
},
placeholderData: defaultValue ?? [],
+ retry: (failureCount, error) => {
+ if (error instanceof Error && error.message.includes('Failed to fetch')) {
+ return failureCount < 3;
+ }
+ return false;
+ },
+ retryDelay: (attemptIndex) => Math.min(1000 * 2 ** attemptIndex, 30000),
});📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export function useQuery<Output, Input>( | |
| query: string, | |
| formatFn: (rows: Input) => Output, | |
| defaultValue?: Output | |
| ) { | |
| const { data, error, isPending, isRefetching } = useTanStackQuery({ | |
| queryKey: [query], | |
| queryFn: async () => { | |
| return await fetchSchema(query, formatFn); | |
| }, | |
| placeholderData: defaultValue ?? [], | |
| }); | |
| return { | |
| data, | |
| error, | |
| isPending, | |
| isRefetching, | |
| }; | |
| } | |
| export function useQuery<Output, Input>( | |
| query: string, | |
| formatFn: (rows: Input) => Output, | |
| defaultValue?: Output | |
| ) { | |
| const { data, error, isPending, isRefetching } = useTanStackQuery({ | |
| queryKey: [query], | |
| queryFn: async () => { | |
| return await fetchSchema(query, formatFn); | |
| }, | |
| placeholderData: defaultValue ?? [], | |
| retry: (failureCount, error) => { | |
| if (error instanceof Error && error.message.includes('Failed to fetch')) { | |
| return failureCount < 3; | |
| } | |
| return false; | |
| }, | |
| retryDelay: (attemptIndex) => Math.min(1000 * 2 ** attemptIndex, 30000), | |
| }); | |
| return { | |
| data, | |
| error, | |
| isPending, | |
| isRefetching, | |
| }; | |
| } |
| // @ts-expect-error it's ok | ||
| src={connector.icon.dark} |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Remove ts-expect-error and handle icon type properly.
Instead of suppressing the TypeScript error, define proper types for the connector icon.
-// @ts-expect-error it's ok
-src={connector.icon.dark}
+src={connector.icon?.dark || ''}
+alt={connector.name}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| // @ts-expect-error it's ok | |
| src={connector.icon.dark} | |
| src={connector.icon?.dark || ''} | |
| alt={connector.name} |
| // @ts-expect-error object is not undefined, I checked it above bro | ||
| draft.entities[ | ||
| entityId.toString() | ||
| ].models.dojo_starter.Moves.remaining = remainingMoves; | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Replace ts-expect-error with proper type checking.
Instead of suppressing TypeScript errors, implement proper type guards.
-// @ts-expect-error object is not undefined, I checked it above bro
+const moves = draft.entities[entityId.toString()]?.models?.dojo_starter?.Moves;
+if (moves) {
+ (moves as any).remaining = remainingMoves;
+}Also applies to: 64-68
| } catch (error) { | ||
| // Revert the optimistic update if an error occurs | ||
| state.revertOptimisticUpdate(transactionId); | ||
| console.error("Error executing spawn:", error); |
There was a problem hiding this comment.
Fix incorrect error message in move function.
The error message refers to "spawn" instead of "move".
-console.error("Error executing spawn:", error);
+console.error("Error executing move:", error);📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| console.error("Error executing spawn:", error); | |
| console.error("Error executing move:", error); |
| export function toString(d: Direction): string { | ||
| switch (d) { | ||
| case Direction.Left: | ||
| return "Left"; | ||
| case Direction.Right: | ||
| return "Right"; | ||
| case Direction.Up: | ||
| return "Up"; | ||
| case Direction.Down: | ||
| return "Down"; | ||
| } | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Rename toString method to avoid shadowing global property.
The toString method shadows the global toString property. Consider renaming it to be more specific.
- export function toString(d: Direction): string {
+ export function directionToString(d: Direction): string {📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export function toString(d: Direction): string { | |
| switch (d) { | |
| case Direction.Left: | |
| return "Left"; | |
| case Direction.Right: | |
| return "Right"; | |
| case Direction.Up: | |
| return "Up"; | |
| case Direction.Down: | |
| return "Down"; | |
| } | |
| } | |
| export function directionToString(d: Direction): string { | |
| switch (d) { | |
| case Direction.Left: | |
| return "Left"; | |
| case Direction.Right: | |
| return "Right"; | |
| case Direction.Up: | |
| return "Up"; | |
| case Direction.Down: | |
| return "Down"; | |
| } | |
| } |
🧰 Tools
🪛 Biome (1.9.4)
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
| { | ||
| value: "example-vite-react-sql", | ||
| description: "Demonstrates how Torii sql endpoint works.", | ||
| }, |
There was a problem hiding this comment.
Remove duplicate template entry.
The template "example-vite-react-sdk" appears twice in the templates array. Remove the duplicate entry to avoid confusion.
{
value: "example-vite-react-sql",
description: "Demonstrates how Torii sql endpoint works.",
},
{
value: "example-vanillajs-phaser-recs",
description: "Vanilla JS/Phaser app using Dojo RECS",
},
{
value: "example-vite-react-phaser-recs",
description: "React/Phaser app using Dojo RECS",
},
{
value: "example-vite-react-pwa-recs",
description: "React Progressive Web App using Dojo RECS",
},
{
value: "example-vite-react-threejs-recs",
description: "React Three.js app using Dojo RECS",
},
- {
- value: "example-vite-react-sdk",
- description: "Basic react app using the sdk",
- },Also applies to: 31-34
MartianGreed
force-pushed
the
feat/sql-example
branch
from
b1a3967 to
115f5e3
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (7)
examples/example-vite-react-sql/src/components/starknet-provider.tsx (2)
14-16:⚠️ Potential issueAdd error handling for invalid RPC URL.
The provider setup should validate the RPC URL before using it.
const provider = jsonRpcProvider({ - rpc: () => ({ nodeUrl: dojoConfig.rpcUrl as string }), + rpc: () => { + if (!dojoConfig.rpcUrl) { + throw new Error('RPC URL is not configured'); + } + return { nodeUrl: dojoConfig.rpcUrl }; + }, });
18-26:⚠️ Potential issueImprove effect dependency and error handling.
The effect implementation needs improvements in error handling and dependency management.
useEffect(() => { - if (connectors.length === 0) { - predeployedAccounts({ - rpc: dojoConfig.rpcUrl as string, - id: "katana", - name: "Katana", - }).then(setConnectors); - } -}, [connectors]); + const initConnectors = async () => { + try { + const newConnectors = await predeployedAccounts({ + rpc: dojoConfig.rpcUrl as string, + id: "katana", + name: "Katana", + }); + setConnectors(newConnectors); + } catch (error) { + console.error('Failed to initialize connectors:', error); + // Consider showing user-friendly error message + } + }; + + if (connectors.length === 0) { + initConnectors(); + } +}, []); // Remove connectors from dependencyexamples/example-vite-react-sql/src/main.tsx (1)
48-48:⚠️ Potential issueAdd null check for root element.
The code assumes the root element exists without proper error handling.
-createRoot(document.getElementById("root")!).render( +const rootElement = document.getElementById("root"); +if (!rootElement) { + throw new Error("Failed to find root element"); +} +createRoot(rootElement).render(examples/example-vite-react-sql/src/hooks/useQuery.ts (2)
3-18:⚠️ Potential issueCritical security and reliability improvements needed.
The
fetchSchemafunction needs improvements for security and reliability:
- Replace generic
Functiontype with proper typing- Make the endpoint URL configurable
- Add request timeout
- Add input validation
🧰 Tools
🪛 Biome (1.9.4)
[error] 3-3: Don't use 'Function' as a type.
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
(lint/complexity/noBannedTypes)
20-39: 🛠️ Refactor suggestionAdd retry configuration and error type handling.
The query configuration would benefit from retry logic and better error typing.
examples/example-vite-react-sql/src/components/playground/schema.tsx (2)
48-66: 🛠️ Refactor suggestionAdd error and loading state handling.
The component should handle loading and error states from useQuery hook for better user experience.
57-60: 🛠️ Refactor suggestionAvoid using array index as React key.
Using array indices as keys can lead to rendering issues. Consider using table_name as it appears to be unique.
🧹 Nitpick comments (29)
examples/example-vite-react-sql/src/components/ui/popover.tsx (1)
12-29: Consider making z-index and width configurable.The implementation is solid, but consider these improvements for better reusability:
- Make the z-index configurable to handle different stacking contexts
- Allow width customization through props instead of hardcoding
w-72Here's a suggested implementation:
-className={cn( - "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", - className -)} +className={cn( + "rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", + className +)} +style={{ + zIndex: props.zIndex ?? 50, + width: props.width ?? '18rem' +}}examples/example-vite-react-sql/src/main.tsx (2)
39-44: Consider making domain configuration configurable.The domain configuration contains hardcoded values like "WORLD_NAME" and "KATANA". Consider making these configurable through environment variables or configuration files for better flexibility across different environments.
domain: { - name: "WORLD_NAME", - version: "1.0", - chainId: "KATANA", + name: process.env.WORLD_NAME || "WORLD_NAME", + version: process.env.WORLD_VERSION || "1.0", + chainId: process.env.CHAIN_ID || "KATANA", revision: "1", }
57-59: Enhance error handling strategy.While basic error logging is present, consider implementing a more robust error handling strategy:
- Add error boundaries for React components
- Implement user-friendly error notifications
- Consider error reporting to a monitoring service
main().catch((error) => { console.error("Failed to initialize the application:", error); + // Display user-friendly error message + const rootElement = document.getElementById("root"); + if (rootElement) { + createRoot(rootElement).render( + <ErrorDisplay message="Failed to initialize the application. Please try again later." /> + ); + } + // Report error to monitoring service + reportError(error); });examples/example-vite-react-sql/tsconfig.node.json (2)
2-6: Consider aligning TypeScript target with library version.For consistency, consider updating
targetto "ES2023" to match the specified library version. This ensures you can use all the language features available in your library definition."compilerOptions": { - "target": "ES2022", + "target": "ES2023", "lib": ["ES2023"], "module": "ESNext", "skipLibCheck": true,
15-19: Consider additional type safety options.While the current linting configuration is good, consider adding these additional checks for better type safety:
/* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, - "noFallthroughCasesInSwitch": true + "noFallthroughCasesInSwitch": true, + "noImplicitReturns": true, + "noUncheckedIndexedAccess": true🧰 Tools
🪛 Biome (1.9.4)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/tsconfig.app.json (4)
3-7: Consider upgrading target and adding WebWorker types.For a modern Vite application with SQL functionality:
- Consider upgrading to
ES2022or newer for better browser compatibility and features- Add
WebWorkerto thelibarray if you plan to use Web Workers for SQL operations- "target": "ES2020", + "target": "ES2022", "useDefineForClassFields": true, - "lib": ["ES2020", "DOM", "DOM.Iterable"], + "lib": ["ES2022", "DOM", "DOM.Iterable", "WebWorker"],
15-19: Enhance type safety with additional checks.Consider adding these compiler options for stronger type safety:
noImplicitReturns: Ensure all code paths return a valuenoUncheckedIndexedAccess: Add undefined to index signatures"strict": true, "noUnusedLocals": true, "noUnusedParameters": true, - "noFallthroughCasesInSwitch": true, + "noFallthroughCasesInSwitch": true, + "noImplicitReturns": true, + "noUncheckedIndexedAccess": true,🧰 Tools
🪛 Biome (1.9.4)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
20-23: Consider adding SQL-specific path aliases.For better organization of SQL-related code, consider adding specific path aliases:
"paths": { - "@/*": ["./src/*"] + "@/*": ["./src/*"], + "@sql/*": ["./src/sql/*"], + "@tests/*": ["./src/__tests__/*"] }🧰 Tools
🪛 Biome (1.9.4)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-23: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
25-25: Consider expanding include patterns for tests.If you have test files outside the src directory, consider expanding the include patterns:
- "include": ["src"] + "include": ["src", "tests", "**/*.test.ts", "**/*.test.tsx"]🧰 Tools
🪛 Biome (1.9.4)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-26: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/src/components/Documentation.tsx (6)
1-4: Add TypeScript types and enhance accessibility.Consider these improvements:
- Add TypeScript type annotation for the component
- Use semantic HTML
<main>instead of<div>for better accessibility-export function Documentation() { +export function Documentation(): JSX.Element { return ( - <div className="documentation"> + <main className="documentation">
11-11: Fix typo in documentation text.There's a typo in the word "vbe".
- system (grpc & graphql) to retrieve your world state, SQL - endpoint is not meant to vbe used as a state query system. + system (grpc & graphql) to retrieve your world state, SQL + endpoint is not meant to be used as a state query system.
25-27: Improve URL construction and error handling.The current URL construction could be improved for better safety and error handling.
- {`fetch(\`\$\{process.env.TORII_URL\}\`/sql?' + -new URLSearchParams({ q: "SELECT name from contracts", }))`} + {`const url = new URL('/sql', process.env.TORII_URL); +url.searchParams.set('q', 'SELECT name from contracts'); + +fetch(url.toString()) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .catch(error => console.error('Error:', error));`}
36-43: Enhance POST request implementation.The POST request implementation could be improved with proper error handling and response type handling.
- {`fetch(\`\$\{process.env.TORII_URL\}\`/sql', { - method: "POST", - headers: { - "Content-Type": "application/json" - }, - body: "SELECT name from contracts", -}))`} + {`fetch(new URL('/sql', process.env.TORII_URL).toString(), { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + query: 'SELECT name from contracts' + }) + }) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .catch(error => console.error('Error:', error));`}
116-146: Move styles to a separate CSS module and add theming support.Consider moving the styles to a separate CSS module for better maintainability and adding CSS variables for theming support.
- Create a new file
Documentation.module.css::root { --doc-max-width: 800px; --doc-background: #f5f5f5; --code-background: #2d2d2d; --code-color: #fff; --note-border-color: #ffd700; } .documentation { max-width: var(--doc-max-width); margin: 20px auto; padding: 20px; font-family: system-ui, -apple-system, sans-serif; } .endpoint { background: var(--doc-background); padding: 20px; border-radius: 8px; margin: 20px 0; } /* ... rest of the styles ... */
- Import and use the CSS module:
+import styles from './Documentation.module.css'; export function Documentation() { return ( - <div className="documentation"> + <main className={styles.documentation}> {/* ... */} - <style>{/* ... */}</style> </main> ); }
1-149: Consider adding interactive features to enhance documentation.The documentation is well-structured but could benefit from these enhancements:
- Add a "Try it now" section with an interactive SQL query editor
- Include copy buttons for code snippets
- Add syntax highlighting for SQL queries
- Include a table of contents for easier navigation
Would you like me to provide implementation details for any of these features?
examples/example-vite-react-sql/src/hooks/useQuery.ts (1)
33-38: Improve error typing and add caching configuration.The hook should:
- Type the error object properly
- Configure caching behavior for better performance
return { - data, - error, + data: data as Output, + error: error as Error, isPending, isRefetching, };Consider adding caching configuration:
const { data, error, isPending, isRefetching } = useTanStackQuery({ queryKey: [query], queryFn: async () => { return await fetchSchema(query, formatFn); }, placeholderData: defaultValue ?? [], + staleTime: 5 * 60 * 1000, // Data stays fresh for 5 minutes + cacheTime: 30 * 60 * 1000, // Cache persists for 30 minutes });examples/example-vite-react-sql/src/components/playground/schema.tsx (3)
9-21: Enhance type safety for schema interfaces.Consider making the interfaces more type-safe:
interface Row { table_name: string; column_name: string; data_type: string; is_primary_key: boolean; + is_nullable: boolean; // Add missing field from query } interface Table { table_name: string; columns: Array<Row>; + readonly [Symbol.iterator](): Iterator<Row>; // Make it properly iterable } -type Rows = Array<Row>; -type Schema = Array<Table>; +type Rows = readonly Row[]; +type Schema = readonly Table[];
35-46: Optimize schema formatting for performance and immutability.The current implementation uses array spreads and mutations which can be inefficient for large datasets.
-function formatSchema(rows: Rows) { - let result: Schema = []; - for (const row of rows) { - const table = result.find((i) => i.table_name === row.table_name); - if (table) { - table.columns = [...table.columns, row]; - continue; - } - result = [...result, { table_name: row.table_name, columns: [row] }]; - } - return result; +function formatSchema(rows: Rows): Schema { + return Array.from( + rows.reduce((map, row) => { + const existing = map.get(row.table_name); + map.set(row.table_name, { + table_name: row.table_name, + columns: existing ? [...existing.columns, row] : [row], + }); + return map; + }, new Map<string, Table>()) + .values() + ); }
68-81: Enhance table column display and fix key usage.The Table component could be improved by:
- Using proper keys for column list
- Displaying more column information
-{table.columns.map((col, idx) => { - return <li key={idx}>{col.column_name}</li>; +{table.columns.map((col) => { + return ( + <li key={`${table.table_name}.${col.column_name}`} className="py-1"> + <span className="font-medium">{col.column_name}</span> + <span className="text-sm text-gray-500"> + {' '}({col.data_type}) + {col.is_primary_key && ' 🔑'} + {!col.is_nullable && ' *'} + </span> + </li> + ); })}examples/example-vite-react-sql/src/hooks/useModel.ts (2)
12-15: Add input validation for the model string format.The model parameter assumes a specific format ("namespace-modelName") but doesn't validate it. Consider adding runtime validation to provide better error messages.
export function useModel< N extends keyof SchemaType, M extends keyof SchemaType[N] & string, >(entityId: BigNumberish, model: `${N}-${M}`): SchemaType[N][M] | undefined { + if (!model.includes('-')) { + throw new Error('Model parameter must be in the format "namespace-modelName"'); + } const [namespace, modelName] = model.split("-") as [N, M];
16-16: Memoize the split operation.The model string splitting operation could be memoized to prevent unnecessary recalculations on re-renders.
- const [namespace, modelName] = model.split("-") as [N, M]; + const [namespace, modelName] = useMemo( + () => model.split("-") as [N, M], + [model] + );examples/example-vite-react-sql/src/hooks/usePlayerActions.ts (2)
35-38: Enhance error handling with specific error types.The error handling is generic. Consider adding specific error types and handling for different failure scenarios.
callback: ({ error, data }) => { if (error) { - console.error("Error setting up entity sync:", error); + if (error instanceof NetworkError) { + console.error("Network error during entity sync:", error); + } else if (error instanceof ValidationError) { + console.error("Validation error during entity sync:", error); + } else { + console.error("Unknown error during entity sync:", error); + } }
61-95: Extract duplicate query logic into a shared utility.The query construction logic is duplicated between the subscription and fetch operations. Consider extracting it into a shared utility function.
+const buildPlayerQuery = (address: string) => + new QueryBuilder<SchemaType>() + .namespace("dojo_starter", (n) => + n.entity("Moves", (e) => + e.eq("player", addAddressPadding(address)) + ) + ) + .build(); useEffect(() => { const fetchEntities = async (address: string) => { try { await sdk.getEntities({ - query: new QueryBuilder<SchemaType>() - .namespace("dojo_starter", (n) => - n.entity("Moves", (e) => - e.eq("player", addAddressPadding(address)) - ) - ) - .build(), + query: buildPlayerQuery(address),examples/example-vite-react-sql/src/typescript/models.gen.ts (1)
81-94: Add exhaustive switch case handling in parse function.The parse function should handle all possible enum values exhaustively at compile time.
- export function parse(d: string): Direction { + export function parse(d: string): Direction { + const exhaustiveCheck = (value: never): never => { + throw new Error(`Unhandled direction: ${value}`); + }; + switch (d) { case "Left": return Direction.Left; case "Right": return Direction.Right; case "Up": return Direction.Up; case "Down": return Direction.Down; default: - throw new Error("Unsupported direction"); + return exhaustiveCheck(d as never); } }examples/example-vite-react-sql/src/components/header.tsx (2)
1-11: Consider organizing imports by category.The imports could be better organized by grouping them into:
- External dependencies (Radix, TanStack)
- Internal UI components
- Internal providers/hooks
+ // External dependencies import { MoonIcon, SunIcon } from "@radix-ui/react-icons"; + import { Link } from "@tanstack/react-router"; + + // Internal UI components import { Button } from "@/components/ui/button"; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; + + // Internal providers/hooks import { useTheme } from "@/components/theme-provider"; - import { Link } from "@tanstack/react-router"; import { Wallet } from "./wallet-provider";
20-24: Enhance homepage link accessibility.The homepage link lacks proper aria-label and could benefit from using the Link component for consistent routing.
- <a className="mr-6 flex items-center space-x-2" href="/"> + <Link + to="/" + className="mr-6 flex items-center space-x-2" + aria-label="Go to homepage" + > <span className="font-bold inline-block"> Torii SQL </span> - </a> + </Link>examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx (3)
1-6: Consider adding type safety for utility functions.The
cnutility function import could benefit from explicit type definitions to ensure type safety across the application.- import { cn } from "@/lib/utils"; + import type { ClassValue } from 'clsx'; + import { cn } from "@/lib/utils";
57-74: Add error boundary and loading state handling.The DropdownMenuContent component could benefit from error boundary protection and loading state handling for dynamic content.
const DropdownMenuContent = React.forwardRef< React.ElementRef<typeof DropdownMenuPrimitive.Content>, - React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> + React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & { + isLoading?: boolean; + } >(({ className, sideOffset = 4, ...props }, ref) => ( <DropdownMenuPrimitive.Portal> <DropdownMenuPrimitive.Content ref={ref} sideOffset={sideOffset} className={cn( "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className )} {...props} /> </DropdownMenuPrimitive.Portal> ));
186-202: Add JSDoc comments for exported components.Consider adding JSDoc comments for the exported components to improve documentation and IDE support.
+/** + * A dropdown menu component that supports keyboard navigation and ARIA attributes. + * @see https://www.radix-ui.com/docs/primitives/components/dropdown-menu + */ export { DropdownMenu, DropdownMenuTrigger, // ... other exports };
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (48)
examples/example-vite-react-sql/.gitignore(1 hunks)examples/example-vite-react-sql/README.md(1 hunks)examples/example-vite-react-sql/components.json(1 hunks)examples/example-vite-react-sql/dojoConfig.ts(1 hunks)examples/example-vite-react-sql/eslint.config.js(1 hunks)examples/example-vite-react-sql/index.html(1 hunks)examples/example-vite-react-sql/package.json(1 hunks)examples/example-vite-react-sql/postcss.config.js(1 hunks)examples/example-vite-react-sql/src/components/Documentation.tsx(1 hunks)examples/example-vite-react-sql/src/components/header.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/action.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/direction-count.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/metrics.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/playground.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/schema.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/total-entities.tsx(1 hunks)examples/example-vite-react-sql/src/components/starknet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/theme-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/accordion.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/button.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/popover.tsx(1 hunks)examples/example-vite-react-sql/src/components/wallet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/dojo-sdk-provider.tsx(1 hunks)examples/example-vite-react-sql/src/hooks/useDojoStore.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useModel.ts(1 hunks)examples/example-vite-react-sql/src/hooks/usePlayerActions.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useQuery.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useSystemCalls.ts(1 hunks)examples/example-vite-react-sql/src/index.css(1 hunks)examples/example-vite-react-sql/src/lib/utils.ts(1 hunks)examples/example-vite-react-sql/src/main.tsx(1 hunks)examples/example-vite-react-sql/src/routeTree.gen.ts(1 hunks)examples/example-vite-react-sql/src/routes/__root.tsx(1 hunks)examples/example-vite-react-sql/src/routes/documentation.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/index.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/playground.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/typescript/contracts.gen.ts(1 hunks)examples/example-vite-react-sql/src/typescript/models.gen.ts(1 hunks)examples/example-vite-react-sql/tailwind.config.ts(1 hunks)examples/example-vite-react-sql/tsconfig.app.json(1 hunks)examples/example-vite-react-sql/tsconfig.app.tsbuildinfo(1 hunks)examples/example-vite-react-sql/tsconfig.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.tsbuildinfo(1 hunks)examples/example-vite-react-sql/vite.config.ts(1 hunks)packages/create-dojo/src/commands/start.ts(1 hunks)scripts/build-examples.sh(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (34)
- examples/example-vite-react-sql/postcss.config.js
- examples/example-vite-react-sql/src/hooks/useDojoStore.ts
- examples/example-vite-react-sql/src/routes/playground.lazy.tsx
- examples/example-vite-react-sql/vite.config.ts
- examples/example-vite-react-sql/tsconfig.node.tsbuildinfo
- examples/example-vite-react-sql/tsconfig.app.tsbuildinfo
- examples/example-vite-react-sql/tailwind.config.ts
- examples/example-vite-react-sql/src/lib/utils.ts
- packages/create-dojo/src/commands/start.ts
- examples/example-vite-react-sql/src/routes/index.lazy.tsx
- scripts/build-examples.sh
- examples/example-vite-react-sql/src/index.css
- examples/example-vite-react-sql/src/components/playground/playground.tsx
- examples/example-vite-react-sql/src/routes/documentation.lazy.tsx
- examples/example-vite-react-sql/eslint.config.js
- examples/example-vite-react-sql/dojoConfig.ts
- examples/example-vite-react-sql/tsconfig.json
- examples/example-vite-react-sql/src/components/playground/metrics.tsx
- examples/example-vite-react-sql/.gitignore
- examples/example-vite-react-sql/components.json
- examples/example-vite-react-sql/index.html
- examples/example-vite-react-sql/src/routes/__root.tsx
- examples/example-vite-react-sql/src/components/playground/action.tsx
- examples/example-vite-react-sql/README.md
- examples/example-vite-react-sql/src/dojo-sdk-provider.tsx
- examples/example-vite-react-sql/src/components/wallet-provider.tsx
- examples/example-vite-react-sql/src/components/playground/total-entities.tsx
- examples/example-vite-react-sql/src/components/playground/direction-count.tsx
- examples/example-vite-react-sql/src/components/theme-provider.tsx
- examples/example-vite-react-sql/src/components/ui/accordion.tsx
- examples/example-vite-react-sql/src/typescript/contracts.gen.ts
- examples/example-vite-react-sql/src/components/ui/button.tsx
- examples/example-vite-react-sql/src/routeTree.gen.ts
- examples/example-vite-react-sql/package.json
🧰 Additional context used
🪛 Biome (1.9.4)
examples/example-vite-react-sql/src/typescript/models.gen.ts
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
examples/example-vite-react-sql/src/hooks/useQuery.ts
[error] 3-3: Don't use 'Function' as a type.
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
(lint/complexity/noBannedTypes)
examples/example-vite-react-sql/tsconfig.app.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-23: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 24-24: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-26: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
examples/example-vite-react-sql/tsconfig.node.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-22: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: build
- GitHub Check: check
🔇 Additional comments (15)
examples/example-vite-react-sql/src/components/ui/popover.tsx (2)
1-11: LGTM! Good choice using Radix UI primitives.The component definitions are clean and leverage Radix UI primitives, which provides built-in accessibility features including proper ARIA attributes and keyboard navigation.
31-31: LGTM! Clean exports.The named exports provide a clear public API and enable tree-shaking.
examples/example-vite-react-sql/src/components/starknet-provider.tsx (3)
1-9: LGTM! Imports are well-organized and necessary.All required dependencies are properly imported and organized.
10-13: LGTM! Component and state setup is type-safe.The component is properly typed with PropsWithChildren and the state is correctly initialized with type safety.
28-39: LGTM! StarknetConfig setup is complete.The component render logic properly configures all necessary StarknetConfig props.
examples/example-vite-react-sql/src/main.tsx (2)
1-13: LGTM! Well-organized imports.The imports are logically organized and include all necessary dependencies for the application setup.
14-22: LGTM! Proper router setup with type safety.Good use of TypeScript's module augmentation to ensure type safety with the router instance.
examples/example-vite-react-sql/tsconfig.node.json (3)
8-13: Well-configured bundler options for Vite!The bundler mode configuration is optimal for Vite, with appropriate settings for module resolution, TypeScript extensions, and isolated modules.
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
21-21: Appropriate include configuration!The include path correctly specifies only the Vite configuration file, which is appropriate for a node-specific TypeScript configuration.
🧰 Tools
🪛 Biome (1.9.4)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-22: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
8-8: Comments in TypeScript configuration files are supported.While the static analysis tool flags JSON comments as non-standard, these comments are fully supported in TypeScript configuration files and help improve code maintainability. You can safely ignore these warnings.
Also applies to: 15-15
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
examples/example-vite-react-sql/tsconfig.app.json (1)
8-14: LGTM! Bundler configuration is well-optimized for Vite.The bundler mode settings are properly configured for optimal TypeScript integration with Vite, including correct module resolution and JSX transformation.
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 14-14: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/src/hooks/useSystemCalls.ts (2)
27-31: Replace ts-expect-error with proper type checking.Instead of suppressing TypeScript errors, implement proper type guards.
89-89: Fix incorrect error message in move function.The error message refers to "spawn" instead of "move".
examples/example-vite-react-sql/src/typescript/models.gen.ts (1)
69-80: Rename toString method to avoid shadowing global property.The
toStringmethod shadows the globaltoStringproperty. Consider renaming it to be more specific.🧰 Tools
🪛 Biome (1.9.4)
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
examples/example-vite-react-sql/src/components/header.tsx (1)
46-73: Consider adding theme persistence.The theme switching functionality works well, but consider persisting the user's theme preference in localStorage to maintain consistency across page reloads.
Let's verify if theme persistence is already implemented elsewhere:
| // this uses immer drafts to update the state | ||
| state.applyOptimisticUpdate(transactionId, (draft) => { | ||
| if ( | ||
| draft.entities[entityId.toString()]?.models?.dojo_starter?.Moves | ||
| ) { | ||
| // @ts-expect-error object is not undefined, I checked it above bro | ||
| draft.entities[ | ||
| entityId.toString() | ||
| ].models.dojo_starter.Moves.remaining = remainingMoves; | ||
| } | ||
| }); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add race condition protection for optimistic updates.
The optimistic update could lead to race conditions if multiple transactions are in flight. Consider adding a transaction queue or lock mechanism.
+ const transactionLock = useRef<boolean>(false);
+
state.applyOptimisticUpdate(transactionId, (draft) => {
+ if (transactionLock.current) {
+ throw new Error('Another transaction is in progress');
+ }
+ transactionLock.current = true;
if (
draft.entities[entityId.toString()]?.models?.dojo_starter?.Moves
) {Committable suggestion skipped: line range outside the PR's diff.
MartianGreed
force-pushed
the
feat/sql-example
branch
from
115f5e3 to
f1893f1
Compare
There was a problem hiding this comment.
Actionable comments posted: 3
♻️ Duplicate comments (4)
examples/example-vite-react-sql/src/typescript/contracts.gen.ts (1)
24-28: 🛠️ Refactor suggestionImprove error handling with specific error types.
The current error handling is too generic and might mask specific contract errors.
examples/example-vite-react-sql/src/hooks/useSystemCalls.ts (3)
22-32: 🛠️ Refactor suggestionAdd race condition protection for optimistic updates.
The optimistic update could lead to race conditions if multiple transactions are in flight.
27-31: 🛠️ Refactor suggestionReplace ts-expect-error with proper type checking.
Instead of suppressing TypeScript errors, implement proper type guards.
89-89:⚠️ Potential issueFix incorrect error message in move function.
The error message refers to "spawn" instead of "move".
🧹 Nitpick comments (19)
examples/example-vite-react-sql/src/hooks/useModel.ts (1)
19-24: Consider adding error boundary or fallback handling.While optional chaining safely handles undefined values, consider adding error logging or fallback behavior for debugging purposes in development environments.
const modelData = useDojoStore( (state) => - state.entities[entityId.toString()]?.models?.[namespace]?.[ - modelName - ] as SchemaType[N][M] | undefined + { + const result = state.entities[entityId.toString()]?.models?.[namespace]?.[modelName]; + if (process.env.NODE_ENV === 'development' && !result) { + console.debug(`Model not found: ${namespace}-${modelName} for entity ${entityId}`); + } + return result as SchemaType[N][M] | undefined; + } );examples/example-vite-react-sql/src/typescript/models.gen.ts (1)
61-95: Consider enhancing Direction enum with value mapping.The current implementation could be improved by adding a values map for better performance and maintainability.
export enum Direction { Left, Right, Up, Down, } export namespace Direction { + const VALUES = { + Left: Direction.Left, + Right: Direction.Right, + Up: Direction.Up, + Down: Direction.Down, + } as const; + export function directionToString(d: Direction): string { - switch (d) { - case Direction.Left: - return "Left"; - case Direction.Right: - return "Right"; - case Direction.Up: - return "Up"; - case Direction.Down: - return "Down"; - } + return Object.keys(VALUES)[d]; } export function parse(d: string): Direction { - switch (d) { - case "Left": - return Direction.Left; - case "Right": - return Direction.Right; - case "Up": - return Direction.Up; - case "Down": - return Direction.Down; - default: - throw new Error("Unsupported direction"); - } + const value = VALUES[d as keyof typeof VALUES]; + if (value === undefined) throw new Error("Unsupported direction"); + return value; } }🧰 Tools
🪛 Biome (1.9.4)
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
examples/example-vite-react-sql/src/typescript/contracts.gen.ts (4)
5-5: Add provider validation.Consider adding validation for the provider parameter to ensure it's properly initialized before use.
export function setupWorld(provider: DojoProvider) { + if (!provider) { + throw new Error('DojoProvider is required'); + }
8-10: Extract contract configuration to constants.Contract names, entrypoints, and system names are hardcoded. Consider extracting these values to a configuration object for better maintainability.
+const CONTRACT_CONFIG = { + ACTIONS: { + NAME: 'actions', + ENTRYPOINTS: { + MOVE: 'move', + SPAWN: 'spawn' + } + }, + SYSTEM: 'dojo_starter' +} as const; + export function setupWorld(provider: DojoProvider) { const build_actions_move_calldata = (direction: models.Direction) => { return { - contractName: "actions", - entrypoint: "move", + contractName: CONTRACT_CONFIG.ACTIONS.NAME, + entrypoint: CONTRACT_CONFIG.ACTIONS.ENTRYPOINTS.MOVE, calldata: [direction], }; };Also applies to: 22-22
38-49: Add spawn result validation.Consider adding validation for the spawn result to ensure the action was successful.
const actions_spawn = async (snAccount: Account | AccountInterface) => { try { - return await provider.execute( + const result = await provider.execute( snAccount, build_actions_spawn_calldata(), "dojo_starter" ); + if (!result?.transaction_hash) { + throw new Error('Spawn action failed: No transaction hash returned'); + } + return result; } catch (error) { console.error(error); throw error; } };
51-58: Add explicit return type for better type safety.Consider adding an explicit interface for the return type to improve type safety and documentation.
+interface WorldActions { + actions: { + move: (snAccount: Account | AccountInterface, direction: models.Direction) => Promise<any>; + buildMoveCalldata: (direction: models.Direction) => { + contractName: string; + entrypoint: string; + calldata: models.Direction[]; + }; + spawn: (snAccount: Account | AccountInterface) => Promise<any>; + buildSpawnCalldata: () => { + contractName: string; + entrypoint: string; + calldata: never[]; + }; + }; +} + -export function setupWorld(provider: DojoProvider) { +export function setupWorld(provider: DojoProvider): WorldActions {examples/example-vite-react-sql/tsconfig.node.json (1)
15-19: Consider additional type-checking options.While the current linting configuration is good, consider adding these beneficial type-checking options:
/* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, -"noFallthroughCasesInSwitch": true +"noFallthroughCasesInSwitch": true, +"noImplicitReturns": true, +"noUncheckedIndexedAccess": true🧰 Tools
🪛 Biome (1.9.4)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/tsconfig.app.json (1)
16-19: Consider additional strict checks for better type safety.While the current strict checks are good, consider adding these additional checks for enhanced type safety:
{ "compilerOptions": { "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true, + "noImplicitReturns": true, + "noUncheckedIndexedAccess": true, + "exactOptionalPropertyTypes": true } }These additional checks will:
- Ensure all code paths return a value
- Add undefined to index signatures
- Enforce exact optional property types
🧰 Tools
🪛 Biome (1.9.4)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 16-16: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 17-17: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 18-18: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 19-19: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/src/components/Documentation.tsx (6)
1-4: Add TypeScript type definitions for better maintainability.Consider adding proper TypeScript types to the component for better maintainability and IDE support.
-export function Documentation() { +import { FC } from 'react'; + +export const Documentation: FC = () => {
11-11: Fix typo in the documentation text.There's a typo in the word "vbe" which should be "be".
- endpoint is not meant to vbe used as a state query system. + endpoint is not meant to be used as a state query system.
25-27: Enhance the GET endpoint example for better security and type safety.The current example could be improved by:
- Adding error handling
- Type-checking the response
- Validating the environment variable
- {`fetch(\`\$\{process.env.TORII_URL\}\`/sql?' + -new URLSearchParams({ q: "SELECT name from contracts", }))`} + {`// Ensure TORII_URL is defined +if (!process.env.TORII_URL) { + throw new Error('TORII_URL is not defined'); +} + +const response = await fetch(\`\${process.env.TORII_URL}/sql?\${ + new URLSearchParams({ + q: "SELECT name from contracts", + }) +}\`); + +if (!response.ok) { + throw new Error(\`HTTP error! status: \${response.status}\`); +} + +const data = await response.json();`}
54-65: Enhance SQL query example with schema context.Consider adding comments to explain:
- The purpose of this metadata query
- When and why users might need this information
- Common use cases for schema introspection
+ {`-- This query retrieves the database schema metadata +-- Use this to understand the structure of available tables + SELECT m.name as table_name, p.name as column_name,
109-111: Add specific SQLite version and feature support information.Consider adding:
- The specific SQLite version in use
- Links to SQLite documentation
- List of supported/unsupported SQLite features
116-146: Consider moving styles to a separate CSS module.The current inline styles could be moved to a separate CSS module for better maintainability and reusability. This would also enable:
- Better code organization
- CSS module scoping
- Easier theme customization
Create a new file
Documentation.module.cssand move the styles there:.documentation { max-width: 800px; margin: 20px auto; padding: 20px; font-family: system-ui, -apple-system, sans-serif; } /* ... rest of the styles ... */Then import and use it in the component:
+import styles from './Documentation.module.css'; export function Documentation() { return ( - <div className="documentation"> + <div className={styles.documentation}>examples/example-vite-react-sql/src/components/header.tsx (2)
16-26: Consider adding aria-label for better accessibilityThe header contains navigation elements but lacks proper accessibility attributes.
- <header className="sticky top-0 z-50 w-full border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 flex justify-center"> + <header className="sticky top-0 z-50 w-full border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 flex justify-center" role="banner" aria-label="Main navigation">
46-73: Consider persisting theme preferenceThe theme switcher implementation looks good, but consider persisting the user's theme preference to local storage for a better user experience.
examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx (3)
28-29: Consider extracting animation classesThe animation classes are duplicated across different components. Consider extracting them into a shared constant or utility.
const DROPDOWN_ANIMATION_CLASSES = "data-[state=open]:animate-in data-[state=closed]:animate-out " + "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 " + "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 " + "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 " + "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2";Also applies to: 65-68
94-114: Add keyboard interaction documentationThe checkbox item implementation looks good, but consider adding JSDoc comments to document keyboard interactions for better maintainability.
+/** + * A checkbox item within a dropdown menu. + * Keyboard interactions: + * - Space: Toggle checkbox + * - Enter: Toggle checkbox + * - Arrow keys: Navigate between items + */ const DropdownMenuCheckboxItem = React.forwardRef<
170-183: Consider adding type safety for shortcut keysThe DropdownMenuShortcut component accepts any string. Consider adding type safety for common keyboard shortcuts.
type ShortcutKey = 'Ctrl+S' | 'Cmd+K' | 'Alt+N'; // Add more as needed interface DropdownMenuShortcutProps extends React.HTMLAttributes<HTMLSpanElement> { shortcut?: ShortcutKey; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (48)
examples/example-vite-react-sql/.gitignore(1 hunks)examples/example-vite-react-sql/README.md(1 hunks)examples/example-vite-react-sql/components.json(1 hunks)examples/example-vite-react-sql/dojoConfig.ts(1 hunks)examples/example-vite-react-sql/eslint.config.js(1 hunks)examples/example-vite-react-sql/index.html(1 hunks)examples/example-vite-react-sql/package.json(1 hunks)examples/example-vite-react-sql/postcss.config.ts(1 hunks)examples/example-vite-react-sql/src/components/Documentation.tsx(1 hunks)examples/example-vite-react-sql/src/components/header.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/action.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/direction-count.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/metrics.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/playground.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/schema.tsx(1 hunks)examples/example-vite-react-sql/src/components/playground/total-entities.tsx(1 hunks)examples/example-vite-react-sql/src/components/starknet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/theme-provider.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/accordion.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/button.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx(1 hunks)examples/example-vite-react-sql/src/components/ui/popover.tsx(1 hunks)examples/example-vite-react-sql/src/components/wallet-provider.tsx(1 hunks)examples/example-vite-react-sql/src/dojo-sdk-provider.tsx(1 hunks)examples/example-vite-react-sql/src/hooks/useDojoStore.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useModel.ts(1 hunks)examples/example-vite-react-sql/src/hooks/usePlayerActions.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useQuery.ts(1 hunks)examples/example-vite-react-sql/src/hooks/useSystemCalls.ts(1 hunks)examples/example-vite-react-sql/src/index.css(1 hunks)examples/example-vite-react-sql/src/lib/utils.ts(1 hunks)examples/example-vite-react-sql/src/main.tsx(1 hunks)examples/example-vite-react-sql/src/routeTree.gen.ts(1 hunks)examples/example-vite-react-sql/src/routes/__root.tsx(1 hunks)examples/example-vite-react-sql/src/routes/documentation.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/index.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/routes/playground.lazy.tsx(1 hunks)examples/example-vite-react-sql/src/typescript/contracts.gen.ts(1 hunks)examples/example-vite-react-sql/src/typescript/models.gen.ts(1 hunks)examples/example-vite-react-sql/tailwind.config.ts(1 hunks)examples/example-vite-react-sql/tsconfig.app.json(1 hunks)examples/example-vite-react-sql/tsconfig.app.tsbuildinfo(1 hunks)examples/example-vite-react-sql/tsconfig.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.json(1 hunks)examples/example-vite-react-sql/tsconfig.node.tsbuildinfo(1 hunks)examples/example-vite-react-sql/vite.config.ts(1 hunks)packages/create-dojo/src/commands/start.ts(1 hunks)scripts/build-examples.sh(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- examples/example-vite-react-sql/postcss.config.ts
🚧 Files skipped from review as they are similar to previous changes (37)
- examples/example-vite-react-sql/src/routes/playground.lazy.tsx
- packages/create-dojo/src/commands/start.ts
- examples/example-vite-react-sql/src/hooks/useDojoStore.ts
- examples/example-vite-react-sql/src/components/playground/playground.tsx
- examples/example-vite-react-sql/tsconfig.node.tsbuildinfo
- examples/example-vite-react-sql/src/routes/index.lazy.tsx
- examples/example-vite-react-sql/tailwind.config.ts
- examples/example-vite-react-sql/src/index.css
- examples/example-vite-react-sql/dojoConfig.ts
- examples/example-vite-react-sql/vite.config.ts
- examples/example-vite-react-sql/index.html
- examples/example-vite-react-sql/tsconfig.app.tsbuildinfo
- examples/example-vite-react-sql/src/components/playground/metrics.tsx
- examples/example-vite-react-sql/src/routes/documentation.lazy.tsx
- examples/example-vite-react-sql/src/lib/utils.ts
- examples/example-vite-react-sql/src/components/playground/total-entities.tsx
- examples/example-vite-react-sql/README.md
- examples/example-vite-react-sql/src/routes/__root.tsx
- examples/example-vite-react-sql/components.json
- examples/example-vite-react-sql/src/main.tsx
- examples/example-vite-react-sql/src/components/playground/schema.tsx
- examples/example-vite-react-sql/src/components/wallet-provider.tsx
- examples/example-vite-react-sql/src/components/ui/button.tsx
- examples/example-vite-react-sql/src/components/theme-provider.tsx
- examples/example-vite-react-sql/src/components/playground/action.tsx
- examples/example-vite-react-sql/tsconfig.json
- examples/example-vite-react-sql/src/components/ui/accordion.tsx
- scripts/build-examples.sh
- examples/example-vite-react-sql/.gitignore
- examples/example-vite-react-sql/src/dojo-sdk-provider.tsx
- examples/example-vite-react-sql/src/components/playground/direction-count.tsx
- examples/example-vite-react-sql/src/components/starknet-provider.tsx
- examples/example-vite-react-sql/eslint.config.js
- examples/example-vite-react-sql/src/hooks/usePlayerActions.ts
- examples/example-vite-react-sql/package.json
- examples/example-vite-react-sql/src/components/ui/popover.tsx
- examples/example-vite-react-sql/src/routeTree.gen.ts
🧰 Additional context used
🪛 Biome (1.9.4)
examples/example-vite-react-sql/src/typescript/models.gen.ts
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
examples/example-vite-react-sql/src/hooks/useQuery.ts
[error] 3-3: Don't use 'Function' as a type.
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
(lint/complexity/noBannedTypes)
examples/example-vite-react-sql/tsconfig.app.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-14: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 14-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-23: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 24-24: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-25: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 25-26: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
examples/example-vite-react-sql/tsconfig.node.json
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 10-10: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 11-11: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 12-12: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-13: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 13-15: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 15-15: JSON standard does not allow comments.
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 16-16: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 17-17: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 18-18: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 19-19: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 20-20: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-21: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
[error] 21-22: End of file expected
Use an array for a sequence of values: [1, 2]
(parse)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: build
- GitHub Check: check
🔇 Additional comments (21)
examples/example-vite-react-sql/src/hooks/useQuery.ts (3)
1-1: LGTM! Clear import aliasing.Good practice using an alias to avoid naming conflicts with the custom hook.
3-18: Critical security and reliability improvements needed.The implementation needs the same improvements as previously suggested regarding:
- Hardcoded localhost URL
- Generic Function type (also flagged by static analysis)
- Missing request timeout
- Input sanitization
🧰 Tools
🪛 Biome (1.9.4)
[error] 3-3: Don't use 'Function' as a type.
Prefer explicitly define the function shape. This type accepts any function-like value, which can be a common source of bugs.
(lint/complexity/noBannedTypes)
20-31: Add retry configuration and error type handling.The query configuration needs the same improvements as previously suggested regarding retry logic and error typing.
examples/example-vite-react-sql/src/hooks/useModel.ts (1)
12-15: LGTM! Well-designed type constraints.The generic type constraints effectively ensure type safety by:
- Limiting N to valid schema namespaces
- Ensuring M is both a key of the namespace and a string
examples/example-vite-react-sql/src/typescript/models.gen.ts (2)
69-80: Rename toString method to avoid shadowing global property.The
toStringmethod shadows the globaltoStringproperty. Consider renaming it to be more specific.- export function toString(d: Direction): string { + export function directionToString(d: Direction): string {🧰 Tools
🪛 Biome (1.9.4)
[error] 69-69: Do not shadow the global "toString" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
110-158: LGTM! Well-structured schema with appropriate defaults.The schema implementation:
- Properly defines field orders for all types
- Sets sensible default values
- Correctly initializes complex types like CairoOption
examples/example-vite-react-sql/src/typescript/contracts.gen.ts (1)
1-3: LGTM! Imports are well-structured.The imports are correctly typed and necessary for the functionality.
examples/example-vite-react-sql/src/hooks/useSystemCalls.ts (3)
1-13: Clean hook setup with proper type safety!The imports are well-organized and the hook is properly typed with BigNumberish parameter.
99-103: Clean and consistent hook return value!The hook follows React conventions by returning a stable object with the callback functions.
78-81: Investigate and implement proper enum parsing.The TODO comment indicates a need for proper enum parsing in the SDK. This could lead to type-safety issues and runtime errors.
Would you like me to:
- Open a GitHub issue to track the enum parsing implementation?
- Generate a proper type-safe implementation for the enum conversion?
Let me verify the current enum handling:
examples/example-vite-react-sql/tsconfig.node.json (4)
2-6: LGTM! Modern TypeScript configuration.The basic compiler options are well-configured for a modern development environment, with appropriate ECMAScript target and library versions.
21-21: LGTM! Appropriate include configuration.The include pattern is correctly scoped to just the Vite configuration file, maintaining a clear separation of concerns.
🧰 Tools
🪛 Biome (1.9.4)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-22: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
8-8: Note about JSON comments.While standard JSON doesn't allow comments, they are commonly used in TypeScript configuration files and are supported by the TypeScript compiler. The comments here improve code readability and maintainability.
Also applies to: 15-15
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
8-13: Verify Vite configuration for TypeScript extensions.The bundler mode configuration is appropriate for Vite, but ensure that
vite.config.tsincludes the necessary configuration to handle TypeScript extensions:✅ Verification successful
TypeScript extension imports are properly configured
The current setup is correct. Vite handles TypeScript extensions automatically when using the bundler moduleResolution, and no additional configuration is needed in vite.config.ts. The allowImportingTsExtensions flag in tsconfig.json is supported out of the box.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Check if Vite config properly handles TypeScript extensions rg -l "resolve.*\.ts.*" vite.config.tsLength of output: 95
Script:
#!/bin/bash # Find Vite config files fd "vite.config" --type f # If found, check their content for TypeScript extension handling fd "vite.config" --type f --exec cat {}Length of output: 5728
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/tsconfig.app.json (4)
3-5: LGTM! Appropriate compiler settings for a modern React application.The target and library selections are well-suited for a Vite React application, providing a good balance between modern features and browser compatibility.
6-7: Verify the implications of skipLibCheck.While
skipLibCheck: trueimproves build performance, it skips type-checking of declaration files in node_modules. This could potentially mask type errors from dependencies.Consider if the performance benefit outweighs the safety of type-checking dependencies. If you have problematic declaration files that necessitate this setting, you might want to:
- Document the specific issues that required enabling this option
- Consider adding specific packages to exclude instead of skipping all checks
8-13: LGTM! Optimal bundler configuration for Vite.The bundler settings are well-configured for a Vite application, enabling proper module resolution and TypeScript features.
🧰 Tools
🪛 Biome (1.9.4)
[error] 8-8: JSON standard does not allow comments.
(parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 9-9: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 10-10: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 11-11: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 12-12: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 13-13: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
20-25: Verify Vite configuration for path alias.The path alias configuration looks good, but ensure that Vite's configuration matches this setup.
Run this script to verify the path alias configuration in Vite:
✅ Verification successful
Path alias configuration is correctly set up ✅
The Vite configuration in
examples/example-vite-react-sql/vite.config.tsproperly matches the path alias defined intsconfig.app.json. Both files map@/*to thesrcdirectory, ensuring consistent path resolution.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Check if Vite config has matching path alias # Search for path alias configuration in vite.config.ts rg -l 'resolve.*alias.*@' | grep -i 'vite.config'Length of output: 49
Script:
#!/bin/bash # First, find Vite config files echo "=== Searching for Vite config files ===" fd -t f "vite.config" # Then display their contents echo -e "\n=== Contents of Vite config files ===" fd -t f "vite.config" -x cat {}Length of output: 5896
🧰 Tools
🪛 Biome (1.9.4)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 20-20: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-21: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 21-23: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 24-24: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
[error] 25-25: End of file expected
Use an array for a sequence of values:
[1, 2](parse)
examples/example-vite-react-sql/src/components/header.tsx (2)
1-11: LGTM! Clean imports organizationThe imports are well-organized, separating third-party libraries from local components.
28-45: Add active state handling for navigation linksWhile the CSS class
[&.active]:font-boldis defined, there's no explicit handling of the active state. Consider using the router's active state management.examples/example-vite-react-sql/src/components/ui/dropdown-menu.tsx (1)
1-18: LGTM! Well-structured base component definitionsGood use of Radix UI primitives with proper type exports.
| queryFn: async () => { | ||
| return await fetchSchema(query, formatFn); | ||
| }, | ||
| placeholderData: defaultValue ?? [], |
There was a problem hiding this comment.
Ensure type safety for placeholderData.
The fallback to an empty array ([]) might not match the Output type, which could cause type errors.
- placeholderData: defaultValue ?? [],
+ placeholderData: defaultValue ?? ([] as Output),📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| placeholderData: defaultValue ?? [], | |
| placeholderData: defaultValue ?? ([] as Output), |
|
|
||
| try { | ||
| // Execute the spawn action from the client | ||
| await client.actions.spawn(account!); |
There was a problem hiding this comment.
Add null check for account before executing spawn action.
The account! non-null assertion is unsafe. Add proper null checking to handle disconnected wallet states gracefully.
- await client.actions.spawn(account!);
+ if (!account) {
+ throw new Error("No account connected");
+ }
+ await client.actions.spawn(account);📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await client.actions.spawn(account!); | |
| if (!account) { | |
| throw new Error("No account connected"); | |
| } | |
| await client.actions.spawn(account); |
| {`fetch(\`\$\{process.env.TORII_URL\}\`/sql', { | ||
| method: "POST", | ||
| headers: { | ||
| "Content-Type": "application/json" | ||
| }, | ||
| body: "SELECT name from contracts", | ||
| }))`} | ||
| </pre> |
There was a problem hiding this comment.
Fix inconsistency between Content-Type and request body format.
The request specifies "application/json" Content-Type but sends a plain string body. This should be corrected to match the specified content type.
- body: "SELECT name from contracts",
+ body: JSON.stringify({
+ query: "SELECT name from contracts"
+ }),📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| {`fetch(\`\$\{process.env.TORII_URL\}\`/sql', { | |
| method: "POST", | |
| headers: { | |
| "Content-Type": "application/json" | |
| }, | |
| body: "SELECT name from contracts", | |
| }))`} | |
| </pre> | |
| {`fetch(\`\$\{process.env.TORII_URL\}\`/sql', { | |
| method: "POST", | |
| headers: { | |
| "Content-Type": "application/json" | |
| }, | |
| body: JSON.stringify({ | |
| query: "SELECT name from contracts" | |
| }), | |
| }))`} | |
| </pre> |
Summary by CodeRabbit
New Features
Configuration
Components