all kinds of weird attempts

This commit is contained in:
StefanWout 2024-11-26 14:27:54 +00:00
parent cad43681ad
commit 78d3716899
3 changed files with 403 additions and 70 deletions

299
package-lock.json generated
View file

@ -21,6 +21,7 @@
"@radix-ui/react-select": "^1.2.2",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-toast": "^1.2.2",
"@radix-ui/react-tooltip": "^1.0.7",
"@remixicon/react": "^4.2.0",
"@tanstack/react-query": "^4.29.12",
@ -2303,6 +2304,304 @@
}
}
},
"node_modules/@radix-ui/react-toast": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/@radix-ui/react-toast/-/react-toast-1.2.2.tgz",
"integrity": "sha512-Z6pqSzmAP/bFJoqMAston4eSNa+ud44NSZTiZUmUen+IOZ5nBY8kzuU5WDBVyFXPtcW6yUalOHsxM/BP6Sv8ww==",
"license": "MIT",
"dependencies": {
"@radix-ui/primitive": "1.1.0",
"@radix-ui/react-collection": "1.1.0",
"@radix-ui/react-compose-refs": "1.1.0",
"@radix-ui/react-context": "1.1.1",
"@radix-ui/react-dismissable-layer": "1.1.1",
"@radix-ui/react-portal": "1.1.2",
"@radix-ui/react-presence": "1.1.1",
"@radix-ui/react-primitive": "2.0.0",
"@radix-ui/react-use-callback-ref": "1.1.0",
"@radix-ui/react-use-controllable-state": "1.1.0",
"@radix-ui/react-use-layout-effect": "1.1.0",
"@radix-ui/react-visually-hidden": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/primitive": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.0.tgz",
"integrity": "sha512-4Z8dn6Upk0qk4P74xBhZ6Hd/w0mPEzOOLxy4xiPXOXqjF7jZS0VAKk7/x/H6FyY2zCkYJqePf1G5KmkmNJ4RBA==",
"license": "MIT"
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-collection": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.1.0.tgz",
"integrity": "sha512-GZsZslMJEyo1VKm5L1ZJY8tGDxZNPAoUeQUIbKeJfoi7Q4kmig5AsgLMYYuyYbfjd8fBmFORAIwYAkXMnXZgZw==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-compose-refs": "1.1.0",
"@radix-ui/react-context": "1.1.0",
"@radix-ui/react-primitive": "2.0.0",
"@radix-ui/react-slot": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-collection/node_modules/@radix-ui/react-context": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.0.tgz",
"integrity": "sha512-OKrckBy+sMEgYM/sMmqmErVn0kZqrHPJze+Ql3DzYsDDp0hl0L62nx/2122/Bvps1qz645jlcu2tD9lrRSdf8A==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-compose-refs": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.0.tgz",
"integrity": "sha512-b4inOtiaOnYf9KWyO3jAeeCG6FeyfY6ldiEPanbUjWd+xIk5wZeHa8yVwmrJ2vderhu/BQvzCrJI0lHd+wIiqw==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-context": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.1.tgz",
"integrity": "sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-dismissable-layer": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.1.tgz",
"integrity": "sha512-QSxg29lfr/xcev6kSz7MAlmDnzbP1eI/Dwn3Tp1ip0KT5CUELsxkekFEMVBEoykI3oV39hKT4TKZzBNMbcTZYQ==",
"license": "MIT",
"dependencies": {
"@radix-ui/primitive": "1.1.0",
"@radix-ui/react-compose-refs": "1.1.0",
"@radix-ui/react-primitive": "2.0.0",
"@radix-ui/react-use-callback-ref": "1.1.0",
"@radix-ui/react-use-escape-keydown": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-portal": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.2.tgz",
"integrity": "sha512-WeDYLGPxJb/5EGBoedyJbT0MpoULmwnIPMJMSldkuiMsBAv7N1cRdsTWZWht9vpPOiN3qyiGAtbK2is47/uMFg==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-primitive": "2.0.0",
"@radix-ui/react-use-layout-effect": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-presence": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.1.tgz",
"integrity": "sha512-IeFXVi4YS1K0wVZzXNrbaaUvIJ3qdY+/Ih4eHFhWA9SwGR9UDX7Ck8abvL57C4cv3wwMvUE0OG69Qc3NCcTe/A==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-compose-refs": "1.1.0",
"@radix-ui/react-use-layout-effect": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-primitive": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.0.tgz",
"integrity": "sha512-ZSpFm0/uHa8zTvKBDjLFWLo8dkr4MBsiDLz0g3gMUwqgLHz9rTaRRGYDgvZPtBJgYCBKXkS9fzmoySgr8CO6Cw==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-slot": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-use-callback-ref": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.0.tgz",
"integrity": "sha512-CasTfvsy+frcFkbXtSJ2Zu9JHpN8TYKxkgJGWbjiZhFivxaeW7rMeZt7QELGVLaYVfFMsKHjb7Ak0nMEe+2Vfw==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-use-controllable-state": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.1.0.tgz",
"integrity": "sha512-MtfMVJiSr2NjzS0Aa90NPTnvTSg6C/JLCV7ma0W6+OMV78vd8OyRpID+Ng9LxzsPbLeuBnWBA1Nq30AtBIDChw==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-use-callback-ref": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-use-escape-keydown": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.1.0.tgz",
"integrity": "sha512-L7vwWlR1kTTQ3oh7g1O0CBF3YCyyTj8NmhLR+phShpyA50HCfBFKVJTpshm9PzLiKmehsrQzTYTpX9HvmC9rhw==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-use-callback-ref": "1.1.0"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-use-layout-effect": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.1.0.tgz",
"integrity": "sha512-+FPE0rOdziWSrH9athwI1R0HDVbWlEhd+FR+aSDk4uWGmSJ9Z54sdZVDQPZAinJhJXwfT+qnj969mCsT2gfm5w==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-toast/node_modules/@radix-ui/react-visually-hidden": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.1.0.tgz",
"integrity": "sha512-N8MDZqtgCgG5S3aV60INAB475osJousYpZ4cTJ2cFbMpdHS5Y6loLTH8LPtkj2QN0x93J30HT/M3qJXM0+lyeQ==",
"license": "MIT",
"dependencies": {
"@radix-ui/react-primitive": "2.0.0"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.0.7.tgz",

View file

@ -27,6 +27,7 @@
"@radix-ui/react-select": "^1.2.2",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-toast": "^1.2.2",
"@radix-ui/react-tooltip": "^1.0.7",
"@remixicon/react": "^4.2.0",
"@tanstack/react-query": "^4.29.12",

View file

@ -12,6 +12,8 @@ import { Form, useForm, FormProvider } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import * as z from "zod";
import { FormField, FormItem, FormLabel, FormControl, FormMessage } from "@/app/shadcn_components/ui/form";
import { Toast } from "@/app/shadcn_components/ui/toast";
// import { Form } from "aws-sdk/clients/amplifyuibuilder";
type Option = {
label: string;
@ -69,6 +71,35 @@ const goalValueOptions = [
},
];
interface EngineTriggerBody {
portfolio_id: string;
housing_type: string;
goal: string;
goal_value: string;
trigger_file_path: string;
already_installed_file_path: string;
patches_file_path: string;
non_invasive_recommendations_file_path: string;
valuation_file_path: string;
scenario_name: string;
multi_plan: boolean;
budget: null;
event_type: string;
}
const formSchema = z.object({
scenario: z.string().min(1, "Scenario is required"),
goal: z.string().min(1, "Goal is required"),
goalValue: z.string().min(1, "Goal value is required"),
housingType: z.string().min(1, "Housing type is required"),
addressLineOne: z.string().min(1, "Address is required"),
postcode: z.string().min(1, "Postcode is required"),
uprn: z.number().min(1, "UPRN is required"),
valuation: z.number().min(1, "Valuation is required"),
});
type FormValues = z.infer<typeof formSchema>;
export function SelectDropdown({
options,
selectedOption,
@ -220,42 +251,26 @@ function useCreateRemoteAssessment({
);
const {
mutate: mutateUploadAssetList,
isLoading: uploadAssetListIsLoading,
isError: uploadAssetListIsError,
} = useMutation(uploadCsvToS3, {
onSuccess: (data) => {
console.log("WAS THE ASSET LIST A SUCCESS?", data.success);
console.log("ASSETS TRIGGERING THE ENGINE");
// This is where we trigger the engine!!!
const body = {
trigger_file_path: assetListFileKey,
};
// engine API call goes here
mutate: mutateUploadFiles,
isLoading: uploadFilesIsLoading,
isError: uploadFilesIsError,
} = useMutation(async ({ assetList, valuationData }: { assetList: { presignedUrl: string; file: Blob }; valuationData: { presignedUrl: string; file: Blob } }) => {
// Upload asset list
await uploadCsvToS3({ presignedUrl: assetList.presignedUrl, file: assetList.file });
// Upload valuation data
await uploadCsvToS3({ presignedUrl: valuationData.presignedUrl, file: valuationData.file });
}, {
onSuccess: (data) => { // Callback for successful mutation
console.log("Files uploaded successfully");
// Trigger the engine here if needed
},
onError: (error) => {
console.error(error);
onError: (error) => { // Callback for failed mutation
console.error("Error uploading files:", error);
},
});
const {
mutate: mutateUploadValuationData,
isLoading: uploadValuationDataIsLoading,
isError: uploadValuationDataIsError,
} = useMutation(uploadCsvToS3, {
onSuccess: (data) => {
console.log("WAS VALUATION DATA A SUCCESS?", data.success);
console.log("VALUATION TRIGGERING THE ENGINE");
// This is where we trigger the engine!!!
const body = {
trigger_file_path: valuationDataFileKey,
};
// engine API call goes here
},
onError: (error) => {
console.error(error);
},
});
const {
mutate: mutatePresignedUrl,
@ -275,20 +290,21 @@ function useCreateRemoteAssessment({
const valuationData = [
{
uprn: uprn,
valuation: 100000,
valuation: 0,
},
];
const assetListCsvString = convertToCSV(assetList);
const assetListCsv = new Blob([assetListCsvString], {
type: "text/csv",
});
mutateUploadAssetList({ presignedUrl: data.url, file: assetListCsv });
const valuationDataCsvString = convertToCSV(valuationData);
const valuationDataCsv = new Blob([valuationDataCsvString], {
type: "text/csv",
});
mutateUploadValuationData({ presignedUrl: data.url, file: valuationDataCsv });
mutateUploadFiles({ assetList: { presignedUrl: data.url, file: assetListCsv }, valuationData: { presignedUrl: data.url, file: valuationDataCsv } });
},
onError: (error) => {
console.error(error);
@ -296,32 +312,66 @@ function useCreateRemoteAssessment({
});
async function handleSubmit() {
async function triggerEngine(data: FormValues) {
try {
// Mutate presigned URL for asset list file
await mutatePresignedUrl({ userId, portfolioId, fileKey: assetListFileKey });
console.log("ASSET LIST SUCCESS");
const triggerBody: EngineTriggerBody ={
portfolio_id: portfolioId,
housing_type: data.housingType,
goal: data.goal,
goal_value: data.goalValue,
trigger_file_path: assetListFileKey,
already_installed_file_path: "",
patches_file_path: "",
non_invasive_recommendations_file_path: "",
valuation_file_path: valuationDataFileKey,
scenario_name: data.scenario,
multi_plan: true,
budget: null,
event_type: "Remote Assessment"
};
// Mutate presigned URL for valuation data file
await mutatePresignedUrl({ userId, portfolioId, fileKey: valuationDataFileKey });
console.log("VALUATION DATA SUCCESS");
const response = await fetch("/api/plan/trigger", {
method: "POST",
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(triggerBody),
});
// Trigger user feedback (e.g., show a success message)
console.log("Both uploads SUCCESS");
if (!response.ok) {
throw new Error('Failed to trigger engine');
}
} catch (error) {
// Handle error (e.g., show an error message)
console.error("Error uploading files:", error);
console.error('Error triggering engine:', error);
throw error;
}
}
async function handleSubmit(formData: FormValues) {
try {
const [assetListUrl, valuationDataUrl] = await Promise.all([
mutatePresignedUrl({ userId, portfolioId, fileKey: assetListFileKey }),
mutatePresignedUrl({ userId, portfolioId, fileKey: valuationDataFileKey })
]);
await triggerEngine(formData);
} catch (error) {
console.error("Error in submission process:", error);
}
}
return {
handleSubmit,
triggerEngine,
presignedUrlIsLoading,
presignedUrlIsError,
uploadFilesIsLoading,
uploadFilesIsError,
};
}
export default function RemoteAssessmentModal({
portfolioId,
isOpen,
@ -331,17 +381,6 @@ export default function RemoteAssessmentModal({
setIsOpen: (isOpen: boolean) => void;
portfolioId: string;
}) {
const formSchema = z.object({
scenario: z.string().min(1, "Scenario is required"),
goal: z.string().min(1, "Goal is required"),
goalValue: z.string().min(1, "Goal value is required"),
housingType: z.string().min(1, "Housing type is required"),
addressLineOne: z.string().min(1, "Address is required"),
postcode: z.string().min(1, "Postcode is required"),
uprn: z.number().min(1, "UPRN is required"),
valuation: z.number().min(1, "Valuation is required"),
});
const form = useForm<FormValues>({
resolver: zodResolver(formSchema),
@ -357,20 +396,10 @@ export default function RemoteAssessmentModal({
},
});
type FormValues = z.infer<typeof formSchema>;
const onSubmit = async (data: FormValues) => {
try {
// First handle the form submission from react-hook-form
const formData = form.getValues();
// Then trigger the data upload using handleSubmit from useCreateRemoteAssessment
await handleSubmit();
// Reset the form
await handleSubmit(data);
form.reset();
// Close the modal on success
setIsOpen(false);
} catch (error) {
console.error('Error submitting form:', error);
@ -589,3 +618,7 @@ export default function RemoteAssessmentModal({
</>
);
}
function setIsOpen(arg0: boolean) {
throw new Error("Function not implemented.");
}