Add gujarati lang text to create scheme page

iYojna · Oct 17, 2022 · 6647096 · 6647096
1 parent fe71b56
commit 6647096
Show file tree

Hide file tree

Showing 8 changed files with 216 additions and 64 deletions.
diff --git a/components/CreateFormStatus.tsx b/components/CreateFormStatus.tsx
@@ -1,11 +1,16 @@
 import React from 'react'
 import styles from '../styles/Components/create-form-status.module.css'
+import useLangStore from '../utils/store'
+import langSt from '../utils/uiText.json'
 
 type CreateFormStatusType = {
 	currentStep: number
 }
 
 const CreateFormStatus = ({ currentStep }: CreateFormStatusType) => {
+	const language = useLangStore((state) => state.language)
+	const isLangGuj = language === 'gj'
+
 	return (
 		<div className={styles.create__form__status__wrapper}>
 			<div className={styles.part__1}>
@@ -37,7 +42,7 @@ const CreateFormStatus = ({ currentStep }: CreateFormStatusType) => {
 							color: `rgba(0,0,0,${currentStep === 1 ? '0.85' : '0.45'})`,
 						}}
 					>
-						Scheme Details
+						{isLangGuj ? langSt.gj.schemeDetails : langSt.en.schemeDetails}
 					</p>
 				</div>
 				<div className={styles.title__wrapper}>
@@ -47,7 +52,9 @@ const CreateFormStatus = ({ currentStep }: CreateFormStatusType) => {
 							color: `rgba(0,0,0,${currentStep === 2 ? '0.85' : '0.45'})`,
 						}}
 					>
-						Scheme Eligibility Criteria
+						{isLangGuj
+							? langSt.gj.schemeEligibility
+							: langSt.en.schemeEligibility}
 					</p>
 				</div>
 			</div>

diff --git a/components/CustomInput.tsx b/components/CustomInput.tsx
@@ -1,6 +1,7 @@
 import React from 'react'
 import { DatePicker, Input, Select } from 'antd'
 import styles from '../styles/Components/CustomInput.module.css'
+import useLangStore from '../utils/store'
 
 const { Option } = Select
 const { TextArea } = Input
@@ -14,6 +15,10 @@ interface IProps {
 }
 
 const CustomInput = ({ placeholder, type, data, label, onChange }: IProps) => {
+	const language = useLangStore((state) => state.language)
+
+	const isLangGuj = language === 'gj'
+
 	return (
 		<div className={styles.input__wrapper}>
 			<label className={styles.input__label}>{label}</label>
@@ -23,17 +28,18 @@ const CustomInput = ({ placeholder, type, data, label, onChange }: IProps) => {
 						placeholder={placeholder}
 						className={styles.input__element__comp}
 						onChange={onChange}
-					/>
-				) : null}
+						/>
+						) : null}
 				{type === 'date' ? (
 					<DatePicker
-						className={styles.input__element__comp}
-						onChange={onChange}
+					className={styles.input__element__comp}
+					onChange={onChange}
 					/>
-				) : null}
+					) : null}
 				{type === 'drop-down' ? (
 					<Select
-						defaultValue="Select"
+						// defaultValue={isLangGuj ? "પસંદ કરો" : "Select"}
+						defaultActiveFirstOption={true}
 						className={styles.input__element__dropdown}
 						onChange={onChange}
 					>

diff --git a/components/Header.tsx b/components/Header.tsx
@@ -77,7 +77,7 @@ const CustomHeader = () => {
 					>
 						<a onClick={(e) => e.preventDefault()}>
 							<Space>
-								{language !== "gj" ? langSt.gj.language : langSt.en.language}
+								{language === "gj" ? langSt.gj.language : langSt.en.language}
 								<DownOutlined />
 							</Space>
 						</a>

diff --git a/components/Layout.tsx b/components/Layout.tsx
@@ -22,41 +22,42 @@ const CustomLayout = ({ children }: IProps) => {
 	const router = useRouter()
 	const [collapsed, setCollapsed] = useState(false)
 
-	const language = useLangStore((state) => state.language);
+	const language = useLangStore((state) => state.language)
+	const isLangGuj = language === "gj";
 
 	const navItems = React.useMemo(
 		() => [
 			{
 				key: 0,
 				icon: React.createElement(UserOutlined),
-				label: 'Login/Signup',
+				label: isLangGuj ? "લૉગિન/સાઇનઅપ" : 'Login/Signup',
 				onClick: () => router.push('/auth'),
 			},
 			{
 				key: 1,
 				icon: React.createElement(HomeOutlined),
-				label: 'Dashboard',
+				label: isLangGuj ? "ડેશબોર્ડ" : 'Dashboard',
 				onClick: () => router.push('/dashboard'),
 			},
 			{
 				key: 2,
 				icon: React.createElement(FormOutlined),
-				label: 'Schemes',
+				label: isLangGuj ? "યોજનાઓ" : 'Schemes',
 				children: [
 					{
 						key: 0,
-						label: 'Add Scheme',
+						label: isLangGuj ? "સ્કીમ ઉમેરો" : 'Add Scheme',
 						onClick: () => router.push('/schemes/create'),
 					},
 					{
 						key: 1,
-						label: 'All Schemes',
+						label: isLangGuj ? "બધી યોજનાઓ" : 'All Schemes',
 						onClick: () => router.push('/schemes'),
 					},
 				],
 			},
 		],
-		[router]
+		[router, isLangGuj]
 	)
 	return (
 		<Layout style={{ height: '100vh', overflowY: 'clip' }}>

diff --git a/components/create-form/create-form-step-1.tsx b/components/create-form/create-form-step-1.tsx
@@ -2,6 +2,8 @@ import React from 'react'
 import styles from '../../styles/Pages/create-form-step1.module.css'
 import CustomInput from '../../components/CustomInput'
 import useFormStore from './formStore'
+import useLangStore from '../../utils/store'
+import langSt from "../../utils/uiText.json";
 
 const CreateFormStep1 = () => {
 	const {
@@ -12,23 +14,27 @@ const CreateFormStep1 = () => {
 		onDescriptionChange: state.onDescriptionChange,
 	}))
 
+	const language = useLangStore((state) => state.language)
+
+	const isLangGuj = language === "gj";
+
 	return (
 		<div className={styles.create__form__body}>
 			<div className={styles.form__element}>
 				<div className={styles.form__input__wrapper}>
 					<CustomInput
 						data={undefined}
-						label={'Scheme Title'}
-						placeholder={'Enter the Scheme Name'}
+						label={isLangGuj?langSt.gj.schemeTitle:langSt.en.schemeTitle}
+						placeholder={isLangGuj?langSt.gj.schemeTitlePlaceholder:langSt.en.schemeTitlePlaceholder}
 						type={'text'}
 						onChange={(e) => onTitleChange(e.target.value)}
 					/>
 				</div>
 				<div className={styles.form__input__wrapper}>
 					<CustomInput
 						data={undefined}
-						label={'Description'}
-						placeholder={'Write your instructions here'}
+						label={isLangGuj?langSt.gj.description:langSt.en.description}
+						placeholder={isLangGuj?langSt.gj.descriptionPlaceholder:langSt.en.descriptionPlaceholder}
 						type={'textarea'}
 						onChange={(e) => onDescriptionChange(e.target.value)}
 					/>