@moamc/rn-cli 1.0.0

package/templates/apiTemplate.js

@@ -0,0 +1,217 @@
+const generateApiServiceTemplate = (apiConfig) => {
+  const { serviceName, methods } = apiConfig;
+  
+  const methodsCode = methods.map(method => {
+    const { name, endpoint, type, hasAuth = true } = method;
+    const callType = type === 'GET' ? 'makeAuthenticatedGetCall' : 'makeAuthenticatedPostCall';
+    
+    if (type === 'GET') {
+      return `function ${name}(data) {
+\tconst response = coreAPI.${callType}('${endpoint}', ${hasAuth});
+\treturn handleResponse(response);
+}`;
+    } else {
+      return `function ${name}(data) {
+\tconst response = coreAPI.${callType}('${endpoint}', data, ${hasAuth});
+\treturn handleResponse(response);
+}`;
+    }
+  }).join('\n\n');
+
+  const exports = methods.map(m => m.name).join(',\n\t');
+
+  return `import { coreAPI } from '../common/baseConfig';
+import handleResponse from '../handler';
+
+${methodsCode}
+
+export const ${serviceName}Service = {
+\t${exports}
+};
+`;
+};
+
+const generateQueryOptionsTemplate = (apiConfig) => {
+  const { serviceName, methods } = apiConfig;
+  
+  const queryMethods = methods.map(method => {
+    const { name, queryKey, hasParams = true } = method;
+    
+    return `\t${name}: (data) => (queryOptions({
+\t\tqueryKey: ['${queryKey}', data],
+\t\tqueryFn: () => ${serviceName}Service.${name}(data),
+\t\t...baseQueryOptions,
+\t})),`;
+  }).join('\n\n');
+
+  return `import { queryOptions } from '@tanstack/react-query';
+import { ${serviceName}Service } from '../services/${serviceName}/${serviceName}';
+
+const baseQueryOptions = {
+\trefetchOnWindowFocus: false,
+\trefetchOnReconnect: false,
+\trefetchInterval: false,
+\tstaleTime: 5 * 60 * 1000,
+\tgcTime: 10 * 60 * 1000,
+};
+
+export const ${serviceName}QueryOptions = {
+${queryMethods}
+};
+`;
+};
+
+const generateApiIntegratedHookTemplate = (screenName, apiConfig, formFields = []) => {
+  const { serviceName, methods, primaryMethod, hasPostMethod } = apiConfig;
+  const getMethod = methods.find(m => m.type === 'GET');
+  const postMethod = methods.find(m => m.type === 'POST');
+  
+  const formFieldsInit = formFields.map(f => `\t\t${f.name}: '',`).join('\n');
+  
+  if (hasPostMethod) {
+    return `import { useState, useEffect } from 'react';
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import { ${serviceName}QueryOptions } from '../../../../queries/${serviceName}Query';
+import { ${serviceName}Service } from '../../../../services/${serviceName}/${serviceName}';
+import { showToastNotification } from '../../../../helpers/common';
+import { validate${screenName} } from '../validation';
+
+export const use${screenName} = () => {
+\tconst queryClient = useQueryClient();
+\tconst [formData, setFormData] = useState({
+${formFieldsInit}
+\t});
+\tconst [errors, setErrors] = useState({});
+\tconst [touched, setTouched] = useState({});
+
+\t// Fetch data using React Query${getMethod ? `
+\tconst { data, isLoading, error, refetch } = useQuery(
+\t\t${serviceName}QueryOptions.${getMethod.name}(formData)
+\t);` : ''}
+
+\t// Submit mutation
+\tconst submitMutation = useMutation({
+\t\tmutationFn: (data) => ${serviceName}Service.${postMethod.name}(data),
+\t\tonSuccess: (response) => {
+\t\t\tshowToastNotification('Success!');
+\t\t\t// Invalidate and refetch${getMethod ? `
+\t\t\tqueryClient.invalidateQueries({ queryKey: ['${getMethod.queryKey}'] });` : ''}
+\t\t},
+\t\tonError: (error) => {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t},
+\t});${getMethod ? `
+
+\tuseEffect(() => {
+\t\tif (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t}
+\t}, [error]);` : ''}
+
+\tconst handleChange = (value, field) => {
+\t\tconst updatedFormData = { ...formData, [field]: value };
+\t\tsetFormData(updatedFormData);
+\t\tsetTouched(prev => ({ ...prev, [field]: true }));
+\t\t
+\t\t// Re-validate on change
+\t\tconst validationErrors = validate${screenName}(updatedFormData);
+\t\tsetErrors(validationErrors);
+\t};
+
+\tconst handleSubmit = async () => {
+\t\tconst validationErrors = validate${screenName}(formData);
+\t\tif (Object.keys(validationErrors).length > 0) {
+\t\t\tsetErrors(validationErrors);
+\t\t\tsetTouched(Object.keys(formData).reduce((acc, key) => ({ ...acc, [key]: true }), {}));
+\t\t\treturn;
+\t\t}
+
+\t\tsubmitMutation.mutate(formData);
+\t};
+
+\treturn {
+\t\tformData,${getMethod ? `
+\t\tdata,` : ''}
+\t\terrors,
+\t\ttouched,
+\t\tloading: ${getMethod ? 'isLoading || ' : ''}submitMutation.isPending,
+\t\thandleChange,
+\t\thandleSubmit,${getMethod ? `
+\t\trefetch,` : ''}
+\t};
+};
+`;
+  }
+  
+  const method = methods.find(m => m.name === primaryMethod) || methods[0];
+  
+  return `import { useState, useEffect } from 'react';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { ${serviceName}QueryOptions } from '../../../../queries/${serviceName}Query';
+import { showToastNotification } from '../../../../helpers/common';
+import { validate${screenName} } from '../validation';
+
+export const use${screenName} = () => {
+\tconst queryClient = useQueryClient();
+\tconst [formData, setFormData] = useState({
+${formFieldsInit}
+\t});
+\tconst [errors, setErrors] = useState({});
+\tconst [touched, setTouched] = useState({});
+
+\t// Fetch data using React Query
+\tconst { data, isLoading, error, refetch } = useQuery(
+\t\t${serviceName}QueryOptions.${method.name}(formData)
+\t);
+
+\tuseEffect(() => {
+\t\tif (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t}
+\t}, [error]);
+
+\tconst handleChange = (value, field) => {
+\t\tconst updatedFormData = { ...formData, [field]: value };
+\t\tsetFormData(updatedFormData);
+\t\tsetTouched(prev => ({ ...prev, [field]: true }));
+\t\t
+\t\t// Re-validate on change
+\t\tconst validationErrors = validate${screenName}(updatedFormData);
+\t\tsetErrors(validationErrors);
+\t};
+
+\tconst handleSubmit = async () => {
+\t\tconst validationErrors = validate${screenName}(formData);
+\t\tif (Object.keys(validationErrors).length > 0) {
+\t\t\tsetErrors(validationErrors);
+\t\t\tsetTouched(Object.keys(formData).reduce((acc, key) => ({ ...acc, [key]: true }), {}));
+\t\t\treturn;
+\t\t}
+
+\t\ttry {
+\t\t\tawait refetch();
+\t\t\tshowToastNotification('Success!');
+\t\t} catch (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t}
+\t};
+
+\treturn {
+\t\tformData,
+\t\tdata,
+\t\terrors,
+\t\ttouched,
+\t\tloading: isLoading,
+\t\thandleChange,
+\t\thandleSubmit,
+\t\trefetch,
+\t};
+};
+`;
+};
+
+module.exports = {
+  generateApiServiceTemplate,
+  generateQueryOptionsTemplate,
+  generateApiIntegratedHookTemplate,
+};

package/templates/constantsTemplate.js

@@ -0,0 +1,33 @@
+const generateConstantsTemplate = (formFields = []) => {
+  const dropdownFields = formFields.filter(f => f.type === 'dropdown' || f.type === 'radio');
+  
+  if (dropdownFields.length === 0) {
+    return `// Add your constants here
+export const DEFAULT_OPTION = [
+\t{ label: 'Yes', value: 'yes' },
+\t{ label: 'No', value: 'no' },
+];
+`;
+  }
+
+  const constants = dropdownFields.map(field => {
+    const constantName = field.name.toUpperCase() + '_OPTIONS';
+    return `export const ${constantName} = [
+\t{ label: 'Option 1', value: '1' },
+\t{ label: 'Option 2', value: '2' },
+\t// Add more options as needed
+];`;
+  }).join('\n\n');
+
+  return `// Dropdown and Radio button options
+${constants}
+
+// Common options
+export const DEFAULT_OPTION = [
+\t{ label: 'Yes', value: 'yes' },
+\t{ label: 'No', value: 'no' },
+];
+`;
+};
+
+module.exports = { generateConstantsTemplate };

package/templates/constantsTemplate.js.backup

@@ -0,0 +1,18 @@
+const generateConstantsTemplate = (formFields = []) => {
+  const dropdownFields = formFields?.filter(f => f.type === 'dropdown') || [];
+
+  if (dropdownFields.length === 0) {
+    return `// Add your constants here
+export const EXAMPLE_CONSTANT = 'value';
+`;
+  }
+
+  const constants = dropdownFields.map(field => {
+    const options = field.options?.map(opt => `\t{ label: '${opt}', value: '${opt.toUpperCase().replace(/\s+/g, '_')}' },`).join('\n') || '';
+    return `export const ${field.name.toUpperCase()}_OPTIONS = [\n${options}\n];`;
+  }).join('\n\n');
+
+  return `// Dropdown options\n${constants}\n`;
+};
+
+module.exports = { generateConstantsTemplate };

package/templates/fieldGeneratorTemplate.js

@@ -0,0 +1,165 @@
+// Field type configurations
+const FIELD_TYPES = {
+  TEXT: 'text',
+  EMAIL: 'email',
+  NUMBER: 'number',
+  DATE: 'date',
+  DROPDOWN: 'dropdown',
+  RADIO: 'radio',
+  CHECKBOX: 'checkbox',
+  FILE: 'file'
+};
+
+const FIELD_WIDTHS = {
+  FULL: 'full',
+  HALF: 'half'
+};
+
+const generateFormField = (field) => {
+  const { name, type, label, width = 'full' } = field;
+  
+  const containerStyle = width === 'half' ? 'styles.headWidth' : '{ width: \'100%\' }';
+  
+  switch (type) {
+    case FIELD_TYPES.DATE:
+      return generateDateField(name, label, containerStyle);
+    
+    case FIELD_TYPES.DROPDOWN:
+      return generateDropdownField(name, label, containerStyle);
+    
+    case FIELD_TYPES.RADIO:
+      return generateRadioField(name, label, containerStyle);
+    
+    case FIELD_TYPES.CHECKBOX:
+      return generateCheckboxField(name, label);
+    
+    case FIELD_TYPES.FILE:
+      return generateFileField(name, label, containerStyle);
+    
+    case FIELD_TYPES.TEXT:
+    case FIELD_TYPES.EMAIL:
+    case FIELD_TYPES.NUMBER:
+    default:
+      return generateTextInputField(name, label, type, containerStyle);
+  }
+};
+
+const generateTextInputField = (name, label, type, containerStyle) => {
+  const keyboardType = type === 'number' ? 'numeric' : type === 'email' ? 'email-address' : 'default';
+  const autoCapitalize = type === 'email' ? 'none' : 'sentences';
+  
+  return `\t\t\t\t\t<View style={${containerStyle}}>
+\t\t\t\t\t\t<FloatingTextInput
+\t\t\t\t\t\t\tlabel="${label}"
+\t\t\t\t\t\t\tvalue={formData?.${name} || ''}
+\t\t\t\t\t\t\tonChangeText={(e) => handleChange(e, '${name}')}
+\t\t\t\t\t\t\ttextInputStyles={styles.floatContentStyle}
+\t\t\t\t\t\t\tinputContainerStyle={styles.floatStyle}
+\t\t\t\t\t\t\tlabelStyles={styles.floatLabelStyle}
+\t\t\t\t\t\t\terror={touched?.${name} && errors?.${name}}
+\t\t\t\t\t\t\tkeyboardType="${keyboardType}"${type === 'email' ? `\n\t\t\t\t\t\t\totherTextInputProps={{ autoCapitalize: '${autoCapitalize}' }}` : ''}
+\t\t\t\t\t\t/>
+\t\t\t\t\t</View>`;
+};
+
+const generateDateField = (name, label, containerStyle) => {
+  return `\t\t\t\t\t<TouchableRipple
+\t\t\t\t\t\tpointerEvents="box-only"
+\t\t\t\t\t\tstyle={${containerStyle}}
+\t\t\t\t\t\tonPress={() => handleCalendar('${name}')}
+\t\t\t\t\t>
+\t\t\t\t\t\t<FloatingTextInput
+\t\t\t\t\t\t\tlabel="${label}"
+\t\t\t\t\t\t\tvalue={formikState?.values?.${name} || ''}
+\t\t\t\t\t\t\ttextInputStyles={customStyle.floatContentStyle}
+\t\t\t\t\t\t\tinputContainerStyle={customStyle.floatStyle}
+\t\t\t\t\t\t\tlabelStyle={customStyle.floatLabelStyle}
+\t\t\t\t\t\t\terror={(touched == '${name}' || touched == null) && formikState.errors.${name}}
+\t\t\t\t\t\t\teditable={false}
+\t\t\t\t\t\t\ttrailingIconName={!((touched == '${name}' || touched == null) && formikState.errors.${name}) && 'calendar'}
+\t\t\t\t\t\t\ticonColor={colorConstant?.amcBlue}
+\t\t\t\t\t\t\totherTextInputProps={{ selection: { start: 0 } }}
+\t\t\t\t\t\t/>
+\t\t\t\t\t</TouchableRipple>`;
+};
+
+const generateDropdownField = (name, label, containerStyle) => {
+  return `\t\t\t\t\t<TouchableRipple
+\t\t\t\t\t\tpointerEvents="box-only"
+\t\t\t\t\t\tstyle={${containerStyle}}
+\t\t\t\t\t\tonPress={() => openBottomSheet('${name}')}
+\t\t\t\t\t>
+\t\t\t\t\t\t<FloatingTextInput
+\t\t\t\t\t\t\tlabel="${label}"
+\t\t\t\t\t\t\tvalue={formData?.${name}?.label || ''}
+\t\t\t\t\t\t\ttextInputStyles={styles.floatContentStyle}
+\t\t\t\t\t\t\tinputContainerStyle={styles.floatStyle}
+\t\t\t\t\t\t\tlabelStyles={styles.floatLabelStyle}
+\t\t\t\t\t\t\teditable={false}
+\t\t\t\t\t\t\ttrailingIconName="menu-down"
+\t\t\t\t\t\t\ticonColor={colorConstant?.amcBlack}
+\t\t\t\t\t\t\totherTextInputProps={{ selection: { start: 0 } }}
+\t\t\t\t\t\t/>
+\t\t\t\t\t</TouchableRipple>`;
+};
+
+const generateRadioField = (name, label, containerStyle) => {
+  return `\t\t\t\t\t<View style={${containerStyle}}>
+\t\t\t\t\t\t<Text style={customStyle?.optionText}>${label}</Text>
+\t\t\t\t\t\t<RadioForm
+\t\t\t\t\t\t\thelperTextStyle={{ height: 0 }}
+\t\t\t\t\t\t\toption={${name.toUpperCase()}_OPTIONS}
+\t\t\t\t\t\t\tvalue={formikState?.values?.${name}}
+\t\t\t\t\t\t\ttextStyle={customStyle?.optionInnerText}
+\t\t\t\t\t\t\tradioInputContainer={customStyle.optionContainer}
+\t\t\t\t\t\t\tactiveRadioContainer={customStyle.activeOptionContainer}
+\t\t\t\t\t\t\tactiveRadioText={customStyle.activeOptionText}
+\t\t\t\t\t\t\tonChange={(e) => handleChange(e, '${name}')}
+\t\t\t\t\t\t/>
+\t\t\t\t\t</View>`;
+};
+
+const generateCheckboxField = (name, label) => {
+  return `\t\t\t\t\t<View style={customStyle.lastHeadContainer}>
+\t\t\t\t\t\t<View style={customStyle.checkBoxContainer}>
+\t\t\t\t\t\t\t<CheckBox
+\t\t\t\t\t\t\t\tsetcheckBoxBtn={() => handleChange(!formikState?.values?.${name}, '${name}')}
+\t\t\t\t\t\t\t\tlightBackground={false}
+\t\t\t\t\t\t\t\tlabelStyle={customStyle.StartToday}
+\t\t\t\t\t\t\t\tposition={'leading'}
+\t\t\t\t\t\t\t\tlabel={''}
+\t\t\t\t\t\t\t\tgreyColor={true}
+\t\t\t\t\t\t\t\tcheckBoxBtn={formikState?.values?.${name}}
+\t\t\t\t\t\t\t/>
+\t\t\t\t\t\t</View>
+\t\t\t\t\t\t<Text style={customStyle.bottomContainertTextLower}>${label}</Text>
+\t\t\t\t\t</View>`;
+};
+
+const generateFileField = (name, label, containerStyle) => {
+  return `\t\t\t\t\t<TouchableRipple
+\t\t\t\t\t\tpointerEvents="box-only"
+\t\t\t\t\t\tstyle={${containerStyle}}
+\t\t\t\t\t\tonPress={() => handleDocumentPicker('${name}')}
+\t\t\t\t\t>
+\t\t\t\t\t\t<FloatingTextInput
+\t\t\t\t\t\t\tlabel="${label}"
+\t\t\t\t\t\t\tvalue={formikState?.values?.${name}?.name || formikState?.values?.${name} && 'File selected' || 'Choose'}
+\t\t\t\t\t\t\ttextInputStyles={customStyle.floatContentStyle}
+\t\t\t\t\t\t\tlabelStyles={customStyle.labelStyles}
+\t\t\t\t\t\t\teditable={false}
+\t\t\t\t\t\t\tnumberOfLines={1}
+\t\t\t\t\t\t\terror={(touched == '${name}' || touched == null) && formikState.errors.${name}}
+\t\t\t\t\t\t\ttrailingIconName="attachment"
+\t\t\t\t\t\t\ticonColor={colorConstant?.amcBlack}
+\t\t\t\t\t\t\totherTextInputProps={{ selection: { start: 0 } }}
+\t\t\t\t\t\t\tdisabled={true}
+\t\t\t\t\t\t/>
+\t\t\t\t\t</TouchableRipple>`;
+};
+
+module.exports = {
+  generateFormField,
+  FIELD_TYPES,
+  FIELD_WIDTHS
+};

package/templates/helpersTemplate.js

@@ -0,0 +1,10 @@
+const generateHelpersTemplate = () => {
+  return `// Add your helper functions here
+
+export const exampleHelper = (data) => {
+\treturn data;
+};
+`;
+};
+
+module.exports = { generateHelpersTemplate };

package/templates/hookTemplate.js

@@ -0,0 +1,132 @@
+const generateInitialValues = (formFields = []) => {
+  if (!formFields || formFields.length === 0) {
+    return '\t\tloader: false,';
+  }
+
+  const fields = formFields.map(field => {
+    let defaultValue;
+    switch (field.type) {
+      case 'checkbox':
+        defaultValue = 'false';
+        break;
+      case 'dropdown':
+      case 'radio':
+        defaultValue = 'null';
+        break;
+      case 'file':
+        defaultValue = 'null';
+        break;
+      default:
+        defaultValue = "''";
+    }
+    return `\t\t${field.name}: ${defaultValue},`;
+  }).join('\n');
+
+  const hasDropdown = formFields.some(f => f.type === 'dropdown');
+  const hasDate = formFields.some(f => f.type === 'date');
+  
+  let additionalFields = '';
+  if (hasDropdown) {
+    additionalFields += '\n\t\topenBottomNote: false,\n\t\tdropDownType: \'\',';
+  }
+  if (hasDate) {
+    additionalFields += '\n\t\topenCalendar: false,\n\t\tcalendarField: \'\',';
+  }
+
+  return `\t\tloader: false,\n${fields}${additionalFields}`;
+};
+
+const generateHookTemplate = (hookName, hasForm = false, formFields = [], eventName = null) => {
+  if (hasForm) {
+    const hasDropdown = formFields.some(f => f.type === 'dropdown');
+    const hasDate = formFields.some(f => f.type === 'date');
+    
+    return `import { useState } from 'react';
+import { showToastNotification } from '../../../../helpers/common';${hasDate ? '\nimport moment from \'moment\';' : ''}
+import { validate${hookName} } from '../validation';
+
+export const use${hookName} = () => {
+\tconst [formData, setFormData] = useState({
+${formFields.map(f => `\t\t${f.name}: '',`).join('\n')}
+\t});
+\tconst [errors, setErrors] = useState({});
+\tconst [touched, setTouched] = useState({});
+\tconst [loading, setLoading] = useState(false);${hasDropdown ? '\n\tconst [bottomSheetType, setBottomSheetType] = useState(null);' : ''}${hasDate ? '\n\tconst [openCalendar, setOpenCalendar] = useState(false);' : ''}
+
+\tconst handleChange = (value, field) => {
+\t\tconst updatedFormData = { ...formData, [field]: value };
+\t\tsetFormData(updatedFormData);
+\t\tsetTouched(prev => ({ ...prev, [field]: true }));
+\t\t
+\t\t// Re-validate on change
+\t\tconst validationErrors = validate${hookName}(updatedFormData);
+\t\tsetErrors(validationErrors);
+\t};
+
+\tconst handleSubmit = async () => {
+\t\tconst validationErrors = validate${hookName}(formData);
+\t\tif (Object.keys(validationErrors).length > 0) {
+\t\t\tsetErrors(validationErrors);
+\t\t\tsetTouched(Object.keys(formData).reduce((acc, key) => ({ ...acc, [key]: true }), {}));
+\t\t\t// Validation errors are shown inline below each field
+\t\t\treturn;
+\t\t}
+
+\t\tsetLoading(true);
+\t\ttry {
+\t\t\t// Add your API call here
+\t\t\tshowToastNotification('Success!');
+\t\t} catch (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t} finally {
+\t\t\tsetLoading(false);
+\t\t}
+\t};${hasDropdown ? `
+
+\tconst openBottomSheet = (type) => {
+\t\tsetBottomSheetType(type);
+\t};` : ''}
+
+\treturn {
+\t\tformData,
+\t\terrors,
+\t\ttouched,
+\t\tloading,
+\t\thandleChange,
+\t\thandleSubmit,${hasDropdown ? '\n\t\topenBottomSheet,\n\t\tbottomSheetType,' : ''}${hasDate ? '\n\t\topenCalendar,\n\t\tsetOpenCalendar,' : ''}
+\t};
+};
+`;
+  }
+
+  return `import { useState, useEffect } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { showToastNotification } from '../../../../helpers/common';
+
+export const use${hookName} = ({ navigation }) => {
+\tconst [loading, setLoading] = useState(false);
+
+\tconst { data, isLoading, error } = useQuery({
+\t\tqueryKey: ['${hookName.toLowerCase()}'],
+\t\tqueryFn: async () => {
+\t\t\t// Add your API call here
+\t\t\treturn null;
+\t\t},
+\t\tenabled: true,
+\t});
+
+\tuseEffect(() => {
+\t\tif (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t}
+\t}, [error]);
+
+\treturn {
+\t\tloading: isLoading,
+\t\tdata,
+\t};
+};
+`;
+};
+
+module.exports = { generateHookTemplate };

package/templates/hookTemplate.js.backup

@@ -0,0 +1,113 @@
+const generateInitialValues = (formFields = []) => {
+  if (!formFields || formFields.length === 0) {
+    return '\t\tloader: false,';
+  }
+
+  const fields = formFields.map(field => {
+    const defaultValue = field.type === 'checkbox' ? 'false' : field.type === 'dropdown' ? 'null' : "''";
+    return `\t\t${field.name}: ${defaultValue},`;
+  }).join('\n');
+
+  return `\t\tloader: false,\n${fields}`;
+};
+
+const generateHookTemplate = (hookName, hasForm = false, formFields = []) => {
+  if (hasForm) {
+    const initialValues = generateInitialValues(formFields);
+
+    return `import { useState } from 'react';
+import { useFormik } from 'formik';
+import { useQueryClient } from '@tanstack/react-query';
+import { showToastNotification } from '../../../helpers/common';
+import { validationSchema } from './validation';
+
+export const use${hookName} = ({ navigation, params, user }) => {
+\tconst queryClient = useQueryClient();
+\tconst [touched, setTouched] = useState([null]);
+
+\tconst initialValues = {
+${initialValues}
+\t};
+
+\tconst onSubmit = async (values, formikAction) => {
+\t\tformikState.setFieldValue('loader', true);
+
+\t\ttry {
+\t\t\t// Add your API call here
+\t\t\t// const response = await queryClient.fetchQuery(...);
+\t\t\t
+\t\t\tshowToastNotification('Success!');
+\t\t\tnavigation.goBack();
+\t\t} catch (error) {
+\t\t\tformikState.setFieldValue('loader', false);
+\t\t\tconst errorMessage = error?.message || 'Something went wrong';
+\t\t\tshowToastNotification(errorMessage);
+\t\t}
+\t};
+
+\tconst formikState = useFormik({
+\t\tinitialValues,
+\t\tenableReinitialize: true,
+\t\tvalidationSchema,
+\t\tonSubmit,
+\t});
+
+\tconst handleChange = (data, type) => {
+\t\tformikState.setFieldValue(type, data);
+\t\tlet touchedType = touched;
+\t\tif (touchedType.length === 1 && touchedType[0] === null) {
+\t\t\ttouchedType = [];
+\t\t}
+\t\tif (!touchedType.includes(type)) {
+\t\t\tsetTouched([...touchedType, type]);
+\t\t}
+\t};
+
+\tconst handleSubmitValue = () => {
+\t\tsetTouched([null]);
+\t\tformikState.handleSubmit();
+\t};
+
+\treturn {
+\t\tformikState,
+\t\ttouched,
+\t\thandleChange,
+\t\thandleSubmitValue,
+\t};
+};
+`;
+  }
+
+  return `import { useState, useEffect } from 'react';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { showToastNotification } from '../../../helpers/common';
+
+export const use${hookName} = ({ navigation, params, user }) => {
+\tconst queryClient = useQueryClient();
+\tconst [loading, setLoading] = useState(false);
+
+\tconst { data, isLoading, error } = useQuery({
+\t\tqueryKey: ['${hookName.toLowerCase()}'],
+\t\tqueryFn: async () => {
+\t\t\t// Add your API call here
+\t\t\t// return await queryClient.fetchQuery(...);
+\t\t\treturn null;
+\t\t},
+\t\tenabled: true,
+\t});
+
+\tuseEffect(() => {
+\t\tif (error) {
+\t\t\tshowToastNotification(error?.message || 'Something went wrong');
+\t\t}
+\t}, [error]);
+
+\treturn {
+\t\tloading: isLoading,
+\t\tdata,
+\t};
+};
+`;
+};
+
+module.exports = { generateHookTemplate };