From c9938d0e3cae5210b80027aae8aa10585f7b157b Mon Sep 17 00:00:00 2001
From: adhiraj23zelthy <adhiraj@zelthy.com>
Date: Tue, 24 Sep 2024 18:30:46 +0530
Subject: [PATCH] template upload

---
 .../src/assets/images/svg/single-file.svg     |  6 +++
 .../AppConfiguration/DetailsTable/index.jsx   | 18 +++++++
 .../LaunchNewAppModal/LaunchNewAppForm.jsx    | 51 +++++++++++++++++--
 3 files changed, 71 insertions(+), 4 deletions(-)
 create mode 100644 frontend/src/assets/images/svg/single-file.svg

diff --git a/frontend/src/assets/images/svg/single-file.svg b/frontend/src/assets/images/svg/single-file.svg
new file mode 100644
index 000000000..290cda0fa
--- /dev/null
+++ b/frontend/src/assets/images/svg/single-file.svg
@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M9.45455 27H22.5455C23.9006 26.999 24.999 25.9442 25 24.6429V12.0714C24.999 10.7701 23.9006 9.71527 22.5455 9.71429H20.0909V7.35714C20.0899 6.0558 18.9915 5.00098 17.6364 5H9.45455C8.09943 5.00098 7.00102 6.0558 7 7.35714V24.6429C7.00102 25.9442 8.09943 26.999 9.45455 27ZM8.63636 7.35714C8.63636 6.92303 9.00249 6.57143 9.45455 6.57143H17.6364C18.0884 6.57143 18.4545 6.92303 18.4545 7.35714V10.5C18.4545 10.7082 18.5405 10.9086 18.6939 11.0559C18.8473 11.2032 19.0559 11.2857 19.2727 11.2857H22.5454C22.9975 11.2857 23.3636 11.6373 23.3636 12.0714V24.6428C23.3636 25.077 22.9975 25.4286 22.5454 25.4286H9.45453C9.00248 25.4286 8.63635 25.077 8.63635 24.6428L8.63636 7.35714Z" fill="currentColor"></path>
+                    <path d="M11.0906 23.8576H15.9997C16.4518 23.8576 16.8179 23.506 16.8179 23.0718C16.8179 22.6377 16.4518 22.2861 15.9997 22.2861H11.0906C10.6386 22.2861 10.2724 22.6377 10.2724 23.0718C10.2724 23.506 10.6386 23.8576 11.0906 23.8576Z" fill="currentColor"></path>
+                    <path d="M11.0906 20.714H19.2724C19.7245 20.714 20.0906 20.3624 20.0906 19.9283C20.0906 19.4942 19.7245 19.1426 19.2724 19.1426H11.0906C10.6386 19.1426 10.2724 19.4942 10.2724 19.9283C10.2724 20.3624 10.6386 20.714 11.0906 20.714Z" fill="currentColor"></path>
+                    <path d="M13.5452 17.5718C15.3523 17.5718 16.8179 16.1644 16.8179 14.429C16.8179 12.6936 15.3523 11.2861 13.5452 11.2861V12.8576C14.2069 12.8576 14.8042 13.2406 15.0568 13.8279C15.3104 14.4152 15.1703 15.091 14.7019 15.5398C14.2345 15.9896 13.5308 16.1242 12.9193 15.8806C12.3077 15.638 11.9088 15.0645 11.9088 14.429H10.2724C10.2745 16.1645 11.738 17.5699 13.5452 17.5719L13.5452 17.5718Z" fill="currentColor"></path>
+                    </svg>
\ No newline at end of file
diff --git a/frontend/src/pages/appConfiguration/components/AppConfiguration/DetailsTable/index.jsx b/frontend/src/pages/appConfiguration/components/AppConfiguration/DetailsTable/index.jsx
index 3e2735233..0d59410ba 100644
--- a/frontend/src/pages/appConfiguration/components/AppConfiguration/DetailsTable/index.jsx
+++ b/frontend/src/pages/appConfiguration/components/AppConfiguration/DetailsTable/index.jsx
@@ -2,6 +2,8 @@ import { useSelector } from 'react-redux';
 import { ReactComponent as EachAppIcon } from '../../../../../assets/images/svg/each-app-icon.svg';
 import { selectAppConfigurationData } from '../../../slice';
 import EachDescriptionRow from './EachDescriptionRow';
+import { ReactComponent as SingleFileIcon } from '../../../../../assets/images/svg/single-file.svg';
+
 
 function DetailsTable() {
 	const appConfigurationData = useSelector(selectAppConfigurationData);
@@ -100,6 +102,22 @@ function DetailsTable() {
 						</span>
 					}
 				/>
+				<EachDescriptionRow
+					label="Template:"
+					content={
+						appConfigurationData?.app?.app_template?(
+							<a target='__blank'
+							 href={appConfigurationData?.app?.app_template} 
+							 className='whitespace-nowrap cursor-pointer font-lato text-[14px] font-bold leading-[20px] tracking-[0.2px] text-[#5048ED]'>
+								<SingleFileIcon />
+							</a>
+						):(
+						<span className="whitespace-nowrap font-lato text-[14px] font-bold leading-[20px] tracking-[0.2px] text-[#212429]">
+							No Template found
+						</span>
+						)
+					}
+				/>
 			</tbody>
 		</table>
 	);
diff --git a/frontend/src/pages/platform/components/Modals/LaunchNewAppModal/LaunchNewAppForm.jsx b/frontend/src/pages/platform/components/Modals/LaunchNewAppModal/LaunchNewAppForm.jsx
index ec931f593..dfa2b2f4a 100644
--- a/frontend/src/pages/platform/components/Modals/LaunchNewAppModal/LaunchNewAppForm.jsx
+++ b/frontend/src/pages/platform/components/Modals/LaunchNewAppModal/LaunchNewAppForm.jsx
@@ -5,6 +5,7 @@ import * as Yup from 'yup';
 import InputField from '../../../../../components/Form/InputField';
 import SubmitButton from '../../../../../components/Form/SubmitButton';
 import TextareaField from '../../../../../components/Form/TextareaField';
+import FileUpload from '../../../../../components/Form/FileUpload';
 import useApi from '../../../../../hooks/useApi';
 import { transformToFormDataOrder } from '../../../../../utils/form';
 import { setPollingTastIds, toggleRerenderPage } from '../../../slice';
@@ -16,12 +17,41 @@ const LaunchNewAppForm = ({ closeModal }) => {
 	let initialValues = {
 		name: '',
 		description: '',
+		app_template: null
 	};
 
-	let validationSchema = Yup.object({
-		name: Yup.string().required('Required'),
-		description: Yup.string().required('Required'),
-	});
+	let validationSchema = Yup.object().shape({
+		name: Yup.string(),
+		description: Yup.string(),
+		app_template: Yup.mixed(),
+	  }).test('custom', null, function(value) {
+		if (value.app_template) {
+		  return true; 
+		}
+		
+		if (!value.name && !value.description) {
+		  return this.createError({
+			path: 'app_template',
+			message: 'Required',
+		  });
+		}
+		
+		if (value.name && !value.description) {
+		  return this.createError({
+			path: 'description',
+			message: 'Required',
+		  });
+		}
+		
+		if (!value.name && value.description) {
+		  return this.createError({
+			path: 'name',
+			message: 'Required',
+		  });
+		}
+		
+		return true;
+	  });
 
 	const makeApiCall = async (dynamicFormData) => {
 		const { response, success } = await triggerApi({
@@ -79,6 +109,19 @@ const LaunchNewAppForm = ({ closeModal }) => {
 								onChange={formik.handleChange}
 								formik={formik}
 							/>
+							<div className='w-full flex my-4'>
+								<div className="w-full flex items-center">
+      							<div className="flex-grow h-px bg-[#A3ABB1]"></div>
+      							<p className="mx-4 text-sm text-[#A3ABB1] font-medium">OR</p>
+      							<div className="flex-grow h-px bg-[#A3ABB1]"></div>
+    							</div>						
+							</div>
+							<FileUpload
+								formik={formik}
+								label={'Template'}
+								id={'app_template'}
+								fileValue={null}
+							/>
 						</div>
 						<div className="sticky bottom-0 flex flex-col gap-[8px] bg-[#ffffff] pt-[24px] font-lato text-[#696969]">
 							<SubmitButton label={'Launch App'} formik={formik} />