W
Wasp2mo ago
NEROX

Fail to compile

@kapa.ai Help! [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(3,10): error TS2724: '"wasp/client/operations"' has no exported member named 'createCGPACalculation2'. Did you mean 'createCGPACalculation'? [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(138,17): error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SetStateAction<CalculationResult>'. [ Wasp ] ext-src/cgpa-calculator-2/operations.ts(1,10): error TS2724: '"wasp/server/operations"' has no exported member named 'CreateCGPACalculation2'. Did you mean 'CreateCGPACalculation'? [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(48,35): error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2 ❌ --- [Error] Compilation of wasp project failed: -------------------------------- 1 errors found
25 Replies
kapa.ai
kapa.ai2mo ago
Hi @NEROX. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- It seems you're encountering compilation errors in your Wasp project. Let's break down the issues and provide some guidance: 1. The first error suggests that you're trying to import createCGPACalculation2 from 'wasp/client/operations', but it doesn't exist. The compiler suggests that you might have meant to use createCGPACalculation instead. This could be a typo in your import statement or in your Wasp file where you define the action. 2. There's a type mismatch in your CGPACalculator2.tsx file. You're trying to set a state with an unknown type, but the state expects a CalculationResult type. 3. In your operations.ts file, you're trying to import CreateCGPACalculation2 from 'wasp/server/operations', but it doesn't exist. Again, the compiler suggests you might have meant CreateCGPACalculation. 4. In CGPAToPercentageCalculator2.tsx, you're trying to access a percentage property that doesn't exist on the object you're working with. These errors are likely caused by mismatches between your Wasp declarations and your implementation in the ext-src files. Here are some steps you can take to resolve these issues: 1. Check your main.wasp file and ensure that your action and query names match exactly with what you're trying to import in your React components and operation files. 2. Make sure you're using the correct import paths. For client-side code, use import { actionName } from 'wasp/client/operations', and for server-side code, use import { ActionName } from 'wasp/server/operations' Discord Support Thread (https://discord.com/channels/686873244791210014/1216119302244270181). 3. Double-check your type definitions and make sure they match between your Wasp declarations and your TypeScript implementations. 4. If you've recently made changes to your Wasp file or restructured your project, try running wasp clean and then wasp start to rebuild everything Discord Support Thread (https://discord.com/channels/686873244791210014/1215750573278629958). If you continue to have issues after checking these points, you might want to review your recent changes and ensure that all your action and query names are consistent across your Wasp and TypeScript files. Remember, Wasp is sensitive to naming conventions and import paths, so even small typos can cause compilation errors. If you're still stuck after trying these suggestions, consider sharing more details about your Wasp file and the relevant TypeScript files for further assistance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins? Let me check the knowledge base for you again. One moment! :books: ---------------------- I understand you're looking for clarification on the errors and suggestions I provided earlier. Let me address your points and provide some additional context: 1. Regarding the import errors for createCGPACalculation2 and CreateCGPACalculation2: These errors suggest that you might have a mismatch between the names you've declared in your Wasp file and the names you're trying to use in your TypeScript files. It's crucial to ensure that the names in your Wasp declarations exactly match the names you're using in your imports and implementations. For example, in your main.wasp file, you should have something like:
action createCGPACalculation {
fn: import { createCGPACalculation } from "@src/actions.js",
entities: [...]
}

action createCGPACalculation {
fn: import { createCGPACalculation } from "@src/actions.js",
entities: [...]
}

And then in your TypeScript files, you would import it as:
import { createCGPACalculation } from 'wasp/client/operations';

import { createCGPACalculation } from 'wasp/client/operations';

Make sure you're not accidentally adding a "2" to the end of these names in some places but not others. 2. For the type mismatch in CGPACalculator2.tsx: This error occurs when you're trying to set a state with a value that doesn't match the expected type. You need to ensure that the value you're passing to your state setter function matches the CalculationResult type you've defined. 3. For the missing percentage property in CGPAToPercentageCalculator2.tsx: This error suggests that you're trying to access a percentage property on an object that doesn't have it. You need to make sure that the object you're working with actually has a percentage property, or adjust your code to handle cases where it might not exist. To resolve these issues, follow the steps I outlined earlier: 1. Check your main.wasp file to ensure all action and query names are correct and consistent. 2. Use the correct import paths as mentioned in the Discord Support Thread (https://discord.com/channels/686873244791210014/1216119302244270181). 3. Double-check your type definitions in both Wasp and TypeScript files. Additionally, you might want to: 4. Run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). 5. If you're using TypeScript, make sure your tsconfig.json is correctly set up to work with Wasp-generated files Wasp Lang Dev Tooling (https://github.com/wasp-lang/wasp/issues/688). If you're still encountering issues after these steps, it might be helpful to share relevant parts of your main.wasp file and the TypeScript files where you're encountering errors for more specific guidance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(3,10): error TS2724: '"wasp/client/operations"' has no exported member named 'createCGPACalculation2'. Did you mean 'createCGPACalculation'? [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(138,17): error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SetStateAction<CalculationResult>'. [ Wasp ] ext-src/cgpa-calculator-2/operations.ts(1,10): error TS2724: '"wasp/server/operations"' has no exported member named 'CreateCGPACalculation2'. Did you mean 'CreateCGPACalculation'? [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(30,55): error TS2345: Argument of type 'CGPACalculationInput' is not assignable to parameter of type '{ semesters: { semesterNumber: number; sgpa: number; subjects: { name: string; credits: number; grade: string; }[]; }[]; }'. [ Wasp ] Property 'semesters' is missing in type 'CGPACalculationInput' but required in type '{ semesters: { semesterNumber: number; sgpa: number; subjects: { name: string; credits: number; grade: string; }[]; }[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(34,35): error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(35,30): error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(69,41): error TS2304: Cannot find name 'handleGradeScaleChange'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2 ❌ --- [Error] Compilation of wasp project failed: --------------------------------
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages you've provided, it seems you're still encountering several TypeScript compilation errors in your Wasp project. Let's break them down and suggest some solutions: 1. Import errors for createCGPACalculation2 and CreateCGPACalculation2: It appears you're trying to import functions that don't exist. The compiler suggests you might have meant createCGPACalculation instead. This is likely a naming mismatch between your Wasp declarations and your TypeScript implementations. Solution: Check your main.wasp file and ensure that your action is named createCGPACalculation (without the "2" at the end). Then, update your imports in both client and server files to match this name Discord Support Thread (https://discord.com/channels/686873244791210014/1216119302244270181). 2. Type mismatch in CGPACalculator2.tsx: You're trying to set a state with an unknown type, but the state expects a CalculationResult type. Solution: Ensure that the value you're passing to your state setter function matches the CalculationResult type. You might need to cast the value or adjust your type definitions. 3. Type mismatch in CGPAToPercentageCalculator2.tsx: The CGPACalculationInput type doesn't match the expected input type, which requires a semesters property. Solution: Update your CGPACalculationInput type to include the semesters property with the correct structure. 4. Missing properties in CGPAToPercentageCalculator2.tsx: The object you're working with doesn't have percentage and scale properties. Solution: Ensure that the object returned from your calculation includes these properties, or adjust your code to handle cases where they might not exist. 5. Undefined function in CGPAToPercentageCalculator2.tsx: The function handleGradeScaleChange is not defined. Solution: Define this function in your component or remove its usage if it's no longer needed. To resolve these issues: 1. Double-check your main.wasp file to ensure all action and query names are correct and consistent. 2. Update your TypeScript files to use the correct names and types as defined in your Wasp file. 3. Make sure your type definitions in both Wasp and TypeScript files are aligned. 4. Run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after these steps, you might want to review your recent changes and ensure that all your action and query names are consistent across your Wasp and TypeScript files. Remember, Wasp is sensitive to naming conventions and import paths, so even small typos can cause compilation errors. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins? Let me check the knowledge base for you again. One moment! :books: ---------------------- It seems you're looking for confirmation and further clarification on the solutions I provided earlier for your Wasp project compilation errors. I'll address each point and provide some additional context where possible. 1. Import errors for createCGPACalculation2 and CreateCGPACalculation2: Your understanding is correct. The solution is to ensure that the action name in your main.wasp file matches exactly what you're trying to import in your TypeScript files. In your main.wasp file, you should have:
action createCGPACalculation {
fn: import { createCGPACalculation } from "@src/actions.js",
entities: [...]
}

action createCGPACalculation {
fn: import { createCGPACalculation } from "@src/actions.js",
entities: [...]
}

Then in your TypeScript files, import it as:
import { createCGPACalculation } from 'wasp/client/operations';

import { createCGPACalculation } from 'wasp/client/operations';

Make sure to remove any "2" from the end of these names throughout your project. 2. Type mismatch in CGPACalculator2.tsx: Your understanding is correct. You need to ensure that the value you're passing to your state setter function matches the CalculationResult type. If you're not sure about the structure of CalculationResult, you can check its definition in your generated types file or in your main.wasp file. 3. Type mismatch in CGPAToPercentageCalculator2.tsx: Correct. You need to update your CGPACalculationInput type to include the semesters property. The structure should match what's expected:
type CGPACalculationInput = {
semesters: {
semesterNumber: number;
sgpa: number;
subjects: { name: string; credits: number; grade: string; }[];
}[];
};

type CGPACalculationInput = {
semesters: {
semesterNumber: number;
sgpa: number;
subjects: { name: string; credits: number; grade: string; }[];
}[];
};

4. Missing properties in CGPAToPercentageCalculator2.tsx: Your understanding is correct. Ensure that your calculation function returns an object that includes percentage and scale properties, or update your component to handle cases where these properties might not exist. 5. Undefined function in CGPAToPercentageCalculator2.tsx: Correct. You need to either define the handleGradeScaleChange function in your component or remove its usage if it's no longer needed. Your proposed steps to resolve these issues are on point. Additionally, after making these changes, you should run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1215750573278629958). If you're still encountering issues after implementing these changes, it might be helpful to review your recent modifications and ensure that all your action and query names are consistent across your Wasp and TypeScript files. Remember, Wasp is sensitive to naming conventions and import paths, so even small typos can cause compilation errors Wasp Lang Dev Docs (https://wasp-lang.dev/docs/migrate-from-0-11-to-0-12#migrating-your-project-to-the-new-structure). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(3,10): error TS2724: '"wasp/client/operations"' has no exported member named 'createCGPACalculation2'. Did you mean 'createCGPACalculation'? [ Wasp ] ext-src/cgpa-calculator-2/calculator/CGPACalculator2.tsx(138,17): error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SetStateAction<CalculationResult>'. [ Wasp ] ext-src/cgpa-calculator-2/operations.ts(1,10): error TS2724: '"wasp/server/operations"' has no exported member named 'CreateCGPACalculation2'. Did you mean 'CreateCGPACalculation'? [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(41,35): error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(42,30): error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages you've provided, it seems you're still encountering compilation errors in your Wasp project. Let's address each error and provide solutions: 1. Import errors for createCGPACalculation2 and CreateCGPACalculation2:
error TS2724: '"wasp/client/operations"' has no exported member named 'createCGPACalculation2'. Did you mean 'createCGPACalculation'?
error TS2724: '"wasp/server/operations"' has no exported member named 'CreateCGPACalculation2'. Did you mean 'CreateCGPACalculation'?

error TS2724: '"wasp/client/operations"' has no exported member named 'createCGPACalculation2'. Did you mean 'createCGPACalculation'?
error TS2724: '"wasp/server/operations"' has no exported member named 'CreateCGPACalculation2'. Did you mean 'CreateCGPACalculation'?


Solution: You need to update your imports in both client and server files. Remove the "2" from the end of these function names. In your main.wasp file, ensure your action is named createCGPACalculation (without the "2"). Then, update your imports in TypeScript files:
// In client files
import { createCGPACalculation } from 'wasp/client/operations';

// In server files
import { CreateCGPACalculation } from 'wasp/server/operations';

// In client files
import { createCGPACalculation } from 'wasp/client/operations';

// In server files
import { CreateCGPACalculation } from 'wasp/server/operations';

2. Type mismatch in CGPACalculator2.tsx:
error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SetStateAction<CalculationResult>'.

error TS2345: Argument of type 'unknown' is not assignable to parameter of type 'SetStateAction<CalculationResult>'.

Solution: Ensure that the value you're passing to your state setter function matches the CalculationResult type. You might need to cast the value or adjust your type definitions. 3. Missing properties in CGPAToPercentageCalculator2.tsx:
error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

Solution: The object you're working with doesn't have percentage and scale properties. You need to ensure that the object returned from your calculation includes these properties, or adjust your code to handle cases where they might not exist. To resolve these issues: 1. Double-check your main.wasp file to ensure all action and query names are correct and consistent (without the "2" at the end). 2. Update your TypeScript files to use the correct names as defined in your Wasp file. 3. Make sure your type definitions in both Wasp and TypeScript files are aligned. 4. Run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after these steps, you might want to review your recent changes and ensure that all your action and query names are consistent across your Wasp and TypeScript files. Remember, Wasp is sensitive to naming conventions and import paths, so even small typos can cause compilation errors Wasp Lang Dev Docs (https://wasp-lang.dev/docs/migrate-from-0-11-to-0-12#migrating-your-project-to-the-new-structure). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
ffs, solved. I deleted all✅ No code no errors @kapa.ai [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(41,35): error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(42,30): error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2 cgpatopercentagecalculator2.tsx: import React, { useState } from 'react'; import { useAction } from 'wasp/client/operations'; import { createCGPACalculation } from 'wasp/client/operations'; import { gradeScalepoints, GradeScale } from './gradeScales'; import ResultDisplay from './ResultDisplay'; import { GradeScaleSelector } from '../../shared/components/GradeScaleSelector'; import CalculateButton from './CalculateButton'; import ToggleButton from './ToggleButton'; import AutoCalculateCheckbox from './AutoCalculateCheckbox'; import { CGPACalculationInput, CalculationResult } from './types'; const calculation = await createCalculationFn(calculationInput);
setResult({ cgpaResult: calculation.cgpaResult, percentage: calculation.percentage, scale: calculation.scale, semesters: calculation.semesters }); } catch (error) { console.error('Error calculating percentage:', error); setResult(null); } } else { setResult(null); } };
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages and the code snippet you've provided, it seems that the calculation object returned from createCalculationFn doesn't have the percentage and scale properties that you're trying to access. Let's address this issue: 1. Type mismatch in CGPAToPercentageCalculator2.tsx:
error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

The error suggests that the calculation object only has cgpaResult and semesters properties, but you're trying to access percentage and scale as well. To resolve this, you have two options: 1. Update your server-side function to include percentage and scale in the returned object. 2. Modify your client-side code to handle the case where these properties might not exist. Here's how you can modify your client-side code to handle this:
const calculation = await createCalculationFn(calculationInput);

setResult({
cgpaResult: calculation.cgpaResult,
percentage: calculation.percentage || null, // Use null if percentage doesn't exist
scale: calculation.scale || null, // Use null if scale doesn't exist
semesters: calculation.semesters
});
const calculation = await createCalculationFn(calculationInput);

setResult({
cgpaResult: calculation.cgpaResult,
percentage: calculation.percentage || null, // Use null if percentage doesn't exist
scale: calculation.scale || null, // Use null if scale doesn't exist
semesters: calculation.semesters
});
Alternatively, if you're sure that percentage and scale should always be present, you should update your server-side function (the one that createCalculationFn calls) to include these properties in its return value. If you're using TypeScript, you should also update your type definitions to match the actual structure of the data. In your types.ts file, ensure that the CalculationResult type includes all the properties you're expecting:
export type CalculationResult = {
cgpaResult: number;
percentage?: number; // Make it optional if it's not always present
scale?: string; // Make it optional if it's not always present
semesters: any[]; // Consider defining a more specific type for semesters
};
export type CalculationResult = {
cgpaResult: number;
percentage?: number; // Make it optional if it's not always present
scale?: string; // Make it optional if it's not always present
semesters: any[]; // Consider defining a more specific type for semesters
};
After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after these steps, you might want to review the implementation of your createCalculationFn function to ensure it's returning all the expected data. Remember, Wasp is sensitive to type definitions, so ensuring your types match your actual data structures is crucial for avoiding compilation errors Wasp Lang Dev Docs (https://wasp-lang.dev/docs/language/features). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(41,35): error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. [ Wasp ] ext-src/cgpa-to-percentage-calculator2/calculator/CGPAToPercentageCalculator2.tsx(42,30): error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2 ❌ --- [Error] Compilation of wasp project failed: -------------------------------- 1 errors found
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages you've provided, it appears that you're still encountering type mismatches in your CGPAToPercentageCalculator2.tsx file. The errors indicate that the object you're working with doesn't have the percentage and scale properties that you're trying to access. Let's address this issue: 1. Type mismatch in CGPAToPercentageCalculator2.tsx:
error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

error TS2339: Property 'percentage' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.
error TS2339: Property 'scale' does not exist on type '{ cgpaResult: number; semesters: any[]; }'.

To resolve this, you have two main options: 1. Update your server-side function to include percentage and scale in the returned object. 2. Modify your client-side code to handle the case where these properties might not exist. Here's how you can modify your client-side code in CGPAToPercentageCalculator2.tsx to handle this:
const calculation = await createCalculationFn(calculationInput);

setResult({
cgpaResult: calculation.cgpaResult,
percentage: (calculation as any).percentage || null, // Use null if percentage doesn't exist
scale: (calculation as any).scale || null, // Use null if scale doesn't exist
semesters: calculation.semesters
});
const calculation = await createCalculationFn(calculationInput);

setResult({
cgpaResult: calculation.cgpaResult,
percentage: (calculation as any).percentage || null, // Use null if percentage doesn't exist
scale: (calculation as any).scale || null, // Use null if scale doesn't exist
semesters: calculation.semesters
});
Additionally, you should update your type definitions to match the actual structure of the data. In your types.ts file, ensure that the CalculationResult type includes all the properties you're expecting:
export type CalculationResult = {
cgpaResult: number;
percentage?: number; // Make it optional if it's not always present
scale?: string; // Make it optional if it's not always present
semesters: any[]; // Consider defining a more specific type for semesters
};
export type CalculationResult = {
cgpaResult: number;
percentage?: number; // Make it optional if it's not always present
scale?: string; // Make it optional if it's not always present
semesters: any[]; // Consider defining a more specific type for semesters
};
After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after these steps, you might want to review the implementation of your createCalculationFn function to ensure it's returning all the expected data. Remember, Wasp is sensitive to type definitions, so ensuring your types match your actual data structures is crucial for avoiding compilation errors Wasp Lang Dev Docs (https://wasp-lang.dev/docs/language/features). If the problem persists, you may need to check your main.wasp file to ensure that your action or query definitions match the implementation in your TypeScript files. Make sure that the return type of your server-side function matches what you're expecting on the client side. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
Solved✅ @kapa.ai [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(8,59): error TS2345: Argument of type '(args: void, context: any) => Promise<any>' is not assignable to parameter of type 'Query<void, any>'. [ Wasp ] Type '(args: void, context: any) => Promise<any>' is not assignable to type '() => Promise<any>'. [ Wasp ] Target signature provides too few arguments. Expected 2 or more, but got 0. my operations.ts: import { type LeaveTemplate } from 'wasp/entities' import { type GetLeaveTemplates } from 'wasp/server/operations' export const getLeaveTemplates = async (args: void, context: any) => { return context.entities.LeaveTemplate.findMany({ orderBy: { createdAt: 'asc' } }); } my page tsx: import React, { useState } from 'react'; import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react'; import { useQuery } from 'wasp/client/operations'; import { getLeaveTemplates } from '../operations'; import { type LeaveTemplate } from 'wasp/entities'; export default function Generator() { const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates, {}); const [selectedType, setSelectedType] = useState<string>(''); const [name, setName] = useState(''); const [startDate, setStartDate] = useState(''); const [endDate, setEndDate] = useState(''); const [reason, setReason] = useState(''); const [generatedLetter, setGeneratedLetter] = useState(''); const [copied, setCopied] = useState(false); const generateLetter = () => { if (!leaveTypes) return; const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || ''; const letter = selectedTemplate .replace('[NAME]', name) .replace('[START_DATE]', startDate) .replace('[END_DATE]', endDate) .replace('[REASON]', reason); setGeneratedLetter(letter); }; const copyToClipboard = async () => { await navigator.clipboard.writeText(generatedLetter); setCopied(true); setTimeout(() => setCopied(false), 2000); }; if (isLoading) return <div>Loading...</div>; if (error) return <div>Error: {error.message}</div>; if (!leaveTypes) return <div>No templates found</div>;
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error message and the code snippets you've provided, it seems the issue is related to how you've defined and used the getLeaveTemplates query. Let's address this: 1. The error message suggests that there's a mismatch between the expected and actual function signature for getLeaveTemplates. 2. In your operations.ts file, you've defined getLeaveTemplates as:
export const getLeaveTemplates = async (args: void, context: any) => {
// ...
}
export const getLeaveTemplates = async (args: void, context: any) => {
// ...
}
However, Wasp expects queries to be defined without parameters. The args and context are automatically injected by Wasp when the query is executed. To fix this, you should modify your operations.ts file as follows:
import { type LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'

export const getLeaveTemplates: GetLeaveTemplates<void, LeaveTemplate[]> = async (args, context) => {
return context.entities.LeaveTemplate.findMany({
orderBy: { createdAt: 'asc' }
});
}
import { type LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'

export const getLeaveTemplates: GetLeaveTemplates<void, LeaveTemplate[]> = async (args, context) => {
return context.entities.LeaveTemplate.findMany({
orderBy: { createdAt: 'asc' }
});
}
This change does a few things: - It uses the GetLeaveTemplates type from Wasp to properly type your query function. - It specifies that the query takes no arguments (void) and returns an array of LeaveTemplate objects. - It keeps the args and context parameters, which Wasp will provide when executing the query. 3. In your React component, you're using the query correctly with useQuery(getLeaveTemplates, {}). However, since your query doesn't take any arguments, you can simplify it to:
const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates);
const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates);
After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). These modifications should resolve the type error you're encountering. If you continue to face issues, double-check your main.wasp file to ensure that the query is properly declared there as well Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#implementing-queries). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(8,59): error TS2345: Argument of type 'GetLeaveTemplates<void, { id: string; label: string; template: string; createdAt: Date; updatedAt: Date; }[]>' is not assignable to parameter of type 'Query<void, { id: string; label: string; template: string; createdAt: Date; updatedAt: Date; }[]>'. [ Wasp ] Type 'GetLeaveTemplates<void, { id: string; label: string; template: string; createdAt: Date; updatedAt: Date; }[]>' is not assignable to type '() => Promise<{ id: string; label: string; template: string; createdAt: Date; updatedAt: Date; }[]>'. [ Wasp ] Target signature provides too few arguments. Expected 2 or more, but got 0. My pagre: import React, { useState } from 'react'; import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react'; import { useQuery } from 'wasp/client/operations'; import { getLeaveTemplates } from '../operations'; import { type LeaveTemplate } from 'wasp/entities'; export default function Generator() { const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates, {});
const [selectedType, setSelectedType] = useState<string>(''); const [name, setName] = useState(''); const [startDate, setStartDate] = useState(''); const [endDate, setEndDate] = useState(''); const [reason, setReason] = useState(''); const [generatedLetter, setGeneratedLetter] = useState(''); const [copied, setCopied] = useState(false); const generateLetter = () => { if (!leaveTypes) return;
const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || ''; const letter = selectedTemplate .replace('[NAME]', name) .replace('[START_DATE]', startDate) .replace('[END_DATE]', endDate) .replace('[REASON]', reason); setGeneratedLetter(letter); }; const copyToClipboard = async () => { await navigator.clipboard.writeText(generatedLetter); setCopied(true); setTimeout(() => setCopied(false), 2000); }; if (isLoading) return <div>Loading...</div>; if (error) return <div>Error: {error.message}</div>; if (!leaveTypes) return <div>No templates found</div>; return ( my operations: import { type LeaveTemplate } from 'wasp/entities' import { type GetLeaveTemplates } from 'wasp/server/operations' export const getLeaveTemplates: GetLeaveTemplates<void, LeaveTemplate[]> = async (args, context) => { return context.entities.LeaveTemplate.findMany({ orderBy: { createdAt: 'asc' } }) }
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error message and the code snippets you've provided, it seems that there's a mismatch between the type of getLeaveTemplates and what the useQuery hook expects. Let's address this issue: 1. The error suggests that the useQuery hook is expecting a function with no arguments, but GetLeaveTemplates is a type that includes two parameters (args and context). 2. To resolve this, we need to modify how you're using the useQuery hook. Instead of passing the entire getLeaveTemplates function, we should use its queryCacheKey property. Here's how you can fix it:
import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';

export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates.queryCacheKey);

// ... rest of your component code ...
}
import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';

export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates.queryCacheKey);

// ... rest of your component code ...
}
3. This change uses the queryCacheKey property of getLeaveTemplates, which is what Wasp expects for the useQuery hook Discord Support Thread (https://discord.com/channels/686873244791210014/1222460717136085054). 4. Your operations.ts file looks correct. You've properly typed getLeaveTemplates using the GetLeaveTemplates type from Wasp. After making this change, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after this change, double-check your main.wasp file to ensure that the query is properly declared there as well. The declaration in main.wasp should look something like this:
query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}
query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}
This approach should resolve the type error you're encountering. Remember, Wasp is sensitive to type definitions and how operations are used, so ensuring your types and usage match Wasp's expectations is crucial for avoiding compilation errors Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#using-queries). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai after your fix it gives me: [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(8,77): error TS2339: Property 'queryCacheKey' does not exist on type 'GetLeaveTemplates<void, { id: string; label: string; template: string; createdAt: Date; updatedAt: Date; }[]>'. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(21,41): error TS2339: Property 'find' does not exist on type 'unknown'. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(52,25): error TS2339: Property 'map' does not exist on type 'unknown'.
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- I apologize for the confusion in my previous response. It seems that the queryCacheKey property is not available on the getLeaveTemplates function as expected. Let's address these new errors one by one: 1. Error regarding queryCacheKey: The queryCacheKey property is not directly accessible on the query function. Instead, we need to use the query function directly with useQuery. Let's modify your code as follows:
const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates);

const { data: leaveTypes, isLoading, error } = useQuery(getLeaveTemplates);

This change should resolve the first error Discord Support Thread (https://discord.com/channels/686873244791210014/1222460717136085054). 2. Errors regarding find and map on unknown type: These errors are occurring because TypeScript doesn't know the type of leaveTypes. We need to explicitly type the return value of useQuery. Update your code like this:
const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates);

const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates);

This change tells TypeScript that leaveTypes should be an array of LeaveTemplate objects. 3. To further improve type safety, you can update your component as follows:
import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';

export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...
const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
// ... your mapping logic ...
))}
// ... rest of your JSX ...
);
}

import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';

export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...
const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
// ... your mapping logic ...
))}
// ... rest of your JSX ...
);
}

After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). These modifications should resolve the type errors you're encountering. If you continue to face issues, double-check your main.wasp file to ensure that the query is properly declared there as well Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#using-queries). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai Now I have: Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(8,59): error TS2558: Expected 2 type arguments, but got 1. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(21,41): error TS2339: Property 'find' does not exist on type 'unknown'. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(52,25): error TS2339: Property 'map' does not exist on type 'unknown'. line 8: const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates); Line 21: const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || ''; line 52: {leaveTypes.map((type) => ( <option key={type.id} value={type.id}>{type.label}</option> ))}
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the new error messages you're encountering, it seems that there are still some type-related issues in your casual-leave-generator.tsx file. Let's address these errors one by one: 1. Error on line 8: "Expected 2 type arguments, but got 1." This error suggests that the useQuery hook is expecting two type arguments, but you're only providing one. In Wasp, the useQuery hook typically expects both the input type and the return type. Let's modify your code as follows:
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

Here, void represents that the query doesn't take any input, and LeaveTemplate**] is the expected return type [Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#the-usequery-hook). 2. Errors about find and map not existing on type 'unknown': These errors are occurring because TypeScript still doesn't recognize leaveTypes as an array. To fix this, we need to explicitly type the data returned from useQuery. Update your code like this:
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

This change tells TypeScript that leaveTypes should be an array of LeaveTemplate objects. 3. To further improve type safety, you can update your component as follows:
import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';
export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...

const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
// ... your mapping logic ...
))}
// ... rest of your JSX ...
);
}

import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';
export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...

const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
// ... your mapping logic ...
))}
// ... rest of your JSX ...
);
}

After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date
Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). These modifications should resolve the type errors you're encountering. If you continue to face issues, double-check your main.wasp file to ensure that the query is properly declared there as well, and that your operations.ts file correctly exports the getLeaveTemplates function with the proper type annotations Wasp Lang Dev Docs** (https://wasp-lang.dev/docs/data-model/operations/queries#implementing-queries). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai Now I have: Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(8,59): error TS2558: Expected 2 type arguments, but got 1. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(21,41): error TS2339: Property 'find' does not exist on type 'unknown'. [ Wasp ] ext-src/casual-leave-application/application/casual-leave-generator.tsx(52,25): error TS2339: Property 'map' does not exist on type 'unknown'. line 8: const { data: leaveTypes, isLoading, error } = useQuery<LeaveTemplate[]>(getLeaveTemplates); Line 21: const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || ''; line 52: {leaveTypes.map((type) => ( <option key={type.id} value={type.id}>{type.label}</option> ))}
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages and the code snippets you've provided, it seems there are still some type-related issues in your casual-leave-generator.tsx file. Let's address these errors one by one: 1. Error on line 8: "Expected 2 type arguments, but got 1." The useQuery hook in Wasp expects two type arguments: the input type and the return type. Let's modify your code as follows:
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

Here, void represents that the query doesn't take any input, and LeaveTemplate**] is the expected return type [Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#the-usequery-hook). 2. Errors on lines 21 and 52 about find and map not existing on type 'unknown': These errors are occurring because TypeScript doesn't recognize leaveTypes as an array. To fix this, we need to handle the case where leaveTypes might be undefined. Update your code like this: For line 21:
const selectedTemplate = leaveTypes?.find(type => type.id === selectedType)?.template || '';

const selectedTemplate = leaveTypes?.find(type => type.id === selectedType)?.template || '';

For line 52:
{leaveTypes?.map((type) => (
<option key={type.id} value={type.id}>{type.label}</option>
))}

{leaveTypes?.map((type) => (
<option key={type.id} value={type.id}>{type.label}</option>
))}

The optional chaining operator (?.) will ensure that these operations are only performed if leaveTypes is not null or undefined. 3. To further improve type safety, you can update your component as follows:
import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';
export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...

const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
<option key={type.id} value={type.id}>{type.label}</option>
))}
// ... rest of your JSX ...
);
}

import React, { useState } from 'react';
import { Calendar, Clock, Send, FileText, Copy, CheckCircle } from 'lucide-react';
import { useQuery } from 'wasp/client/operations';
import { getLeaveTemplates } from '../operations';
import { type LeaveTemplate } from 'wasp/entities';
export default function Generator() {
const { data: leaveTypes, isLoading, error } = useQuery<void, LeaveTemplate[]>(getLeaveTemplates);

// ... rest of your component code ...

const generateLetter = () => {
if (!leaveTypes) return;

const selectedTemplate = leaveTypes.find(type => type.id === selectedType)?.template || '';
// ... rest of the function ...
};

// ... rest of your component code ...

if (!leaveTypes) return <div>No templates found</div>;

return (
// ... your JSX ...
{leaveTypes.map((type) => (
<option key={type.id} value={type.id}>{type.label}</option>
))}
// ... rest of your JSX ...
);
}

After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date
Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). These modifications should resolve the type errors you're encountering. If you continue to face issues, double-check your main.wasp file to ensure that the query is properly declared there as well, and that your operations.ts file correctly exports the getLeaveTemplates function with the proper type annotations Wasp Lang Dev Docs** (https://wasp-lang.dev/docs/data-model/operations/queries#implementing-queries). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai [ Wasp ] ext-src/casual-leave-application/operations.ts(2,28): error TS2307: Cannot find module 'wasp/server/queries' or its corresponding type declarations. [ Wasp ] ext-src/casual-leave-application/operations.ts(3,26): error TS2307: Cannot find module 'wasp/client/queries' or its corresponding type declarations. import { type LeaveTemplate } from 'wasp/entities' import { type Query } from 'wasp/server/operations' import { useQuery } from 'wasp/client/operations'
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the error messages you're encountering, it seems that there are issues with the import statements in your operations.ts file. The errors suggest that Wasp is unable to find the modules 'wasp/server/queries' and 'wasp/client/queries'. Let's address these issues: 1. First, it's important to note that the import paths for Wasp operations have changed in recent versions. The correct import paths should be:
import { type Query } from 'wasp/server/operations'
import { useQuery } from 'wasp/client/operations'

import { type Query } from 'wasp/server/operations'
import { useQuery } from 'wasp/client/operations'

You're already using these correct paths, so that's not the issue here. 2. The error might be occurring because the TypeScript compiler is not recognizing the Wasp-generated files. To fix this, you need to ensure that your tsconfig.json file is properly configured to include the Wasp-generated files. Here's what you can do to resolve these issues: 1. First, make sure you're using the latest version of Wasp. You can check your version by running wasp version in your terminal. 2. Run wasp clean followed by wasp start to regenerate all Wasp files Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). 3. Check your tsconfig.json file. It should include paths to the Wasp-generated files. Here's an example of how it might look:
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"wasp/*": [".wasp/out/web/src/*"]
}
},
"include": [
"src/**/*",
".wasp/out/web/src/**/*"
]
}

{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"wasp/*": [".wasp/out/web/src/*"]
}
},
"include": [
"src/**/*",
".wasp/out/web/src/**/*"
]
}

This configuration tells TypeScript where to find the Wasp-generated files Wasp Lang Dev Docs (https://wasp-lang.dev/docs/language/features). 4. If the problem persists, try updating your operations.ts file to use only the necessary imports:
import { type LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'

export const getLeaveTemplates: GetLeaveTemplates<void, LeaveTemplate[]> = async (args, context) => {
return context.entities.LeaveTemplate.findMany({
orderBy: { createdAt: 'asc' }
})
}

import { type LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'

export const getLeaveTemplates: GetLeaveTemplates<void, LeaveTemplate[]> = async (args, context) => {
return context.entities.LeaveTemplate.findMany({
orderBy: { createdAt: 'asc' }
})
}

Note that you don't need to import useQuery in your operations.ts file as it's typically used in React components, not in the operations file. 5. Make sure your main.wasp file correctly declares the query:
query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}

query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}

After making these changes, run wasp clean and wasp start again. If you continue to face issues, it might be helpful to check the Wasp documentation for any recent changes in import paths or query declarations Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#declaring-queries-1). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
@kapa.ai we have progress: [ Wasp ] ext-src/casual-leave-application/operations.ts(2,15): error TS2305: Module '"wasp/server/operations"' has no exported member 'Query'. ❌ --- [Error] Your wasp project failed to compile: ------------------------------- - SDK build failed with exit code: 2 ❌ --- [Error] Compilation of wasp project failed: -------------------------------- 1 errors found my operations.ts: import { LeaveTemplate } from 'wasp/entities' import { type Query } from 'wasp/server/operations' import { useQuery } from 'wasp/client/operations' type GetLeaveTemplatesReturn = LeaveTemplate[] export const getLeaveTemplates: Query<void, GetLeaveTemplatesReturn> = async (_args, context) => { return context.entities.LeaveTemplate.findMany() } export function useLeaveTemplates() { return useQuery<GetLeaveTemplatesReturn, void>(getLeaveTemplates) }
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Thank you for providing the updated information. It seems we're making progress, but there's still an issue with the import statement in your operations.ts file. Let's address this error: The error message indicates that the Query type is not exported from 'wasp/server/operations'. This is likely because the export name has changed in a recent version of Wasp. Let's modify your operations.ts file to use the correct import:
import { LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'
import { useQuery } from 'wasp/client/operations'

type GetLeaveTemplatesReturn = LeaveTemplate[]

export const getLeaveTemplates: GetLeaveTemplates<void, GetLeaveTemplatesReturn> = async (_args, context) => {
return context.entities.LeaveTemplate.findMany()
}

export function useLeaveTemplates() {
return useQuery(getLeaveTemplates)
}
import { LeaveTemplate } from 'wasp/entities'
import { type GetLeaveTemplates } from 'wasp/server/operations'
import { useQuery } from 'wasp/client/operations'

type GetLeaveTemplatesReturn = LeaveTemplate[]

export const getLeaveTemplates: GetLeaveTemplates<void, GetLeaveTemplatesReturn> = async (_args, context) => {
return context.entities.LeaveTemplate.findMany()
}

export function useLeaveTemplates() {
return useQuery(getLeaveTemplates)
}
Here are the changes made: 1. We've replaced import { type Query } from 'wasp/server/operations' with import { type GetLeaveTemplates } from 'wasp/server/operations'. This is because Wasp generates specific types for each query you define in your main.wasp file Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#implementing-queries). 2. We've updated the type annotation for getLeaveTemplates to use GetLeaveTemplates<void, GetLeaveTemplatesReturn> instead of Query<void, GetLeaveTemplatesReturn>. 3. In the useLeaveTemplates function, we've simplified the useQuery call. Wasp's useQuery hook can infer the types from the query function, so you don't need to specify them explicitly Wasp Lang Dev Docs (https://wasp-lang.dev/docs/data-model/operations/queries#the-usequery-hook). After making these changes, run wasp clean followed by wasp start to ensure all generated files are up-to-date Discord Support Thread (https://discord.com/channels/686873244791210014/1098429088164753498). If you continue to face issues after these changes, please make sure that your main.wasp file correctly declares the getLeaveTemplates query:
query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}
query getLeaveTemplates {
fn: import { getLeaveTemplates } from "@src/operations.js",
entities: [LeaveTemplate]
}
This should resolve the compilation error you're encountering. If you still face issues, it might be helpful to check your Wasp version and consult the documentation for any recent changes in the API or type definitions. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @NEROX, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
NEROX
NEROXOP2mo ago
Fixed
martinsos
martinsos2mo ago
@NEROX just to check, did you find a good solution? What was the issue at the end, anytihng we can improve on our end?
Want results from more Discord servers?
Add your server