diff --git a/package-lock.json b/package-lock.json index ac28db5..687b492 100644 --- a/package-lock.json +++ b/package-lock.json @@ -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", diff --git a/package.json b/package.json index 382e746..12d2af0 100644 --- a/package.json +++ b/package.json @@ -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", diff --git a/src/app/portfolio/[slug]/components/RemoteAssessmentModal.tsx b/src/app/portfolio/[slug]/components/RemoteAssessmentModal.tsx index 383a6df..0bf4b89 100644 --- a/src/app/portfolio/[slug]/components/RemoteAssessmentModal.tsx +++ b/src/app/portfolio/[slug]/components/RemoteAssessmentModal.tsx @@ -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; + 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({ resolver: zodResolver(formSchema), @@ -357,20 +396,10 @@ export default function RemoteAssessmentModal({ }, }); - type FormValues = z.infer; - 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."); +} +