diff --git a/src/views/pages/ApplicationsView/ApplicationSteps.js b/src/views/pages/ApplicationsView/ApplicationSteps.js
index 03200bd1..7fed7364 100644
--- a/src/views/pages/ApplicationsView/ApplicationSteps.js
+++ b/src/views/pages/ApplicationsView/ApplicationSteps.js
@@ -17,6 +17,10 @@ import {
SelectValidator
} from 'react-material-ui-form-validator';
+import { getStates, getDistrict, getColleges } from './educationFormUtil';
+
+// import axios from 'axios';
+
const useStyles = makeStyles(theme => ({
root: {
width: '100%'
@@ -93,7 +97,7 @@ export function ApplicationSteps({ applicationId, setCourseTitle }) {
const isMountedRef = useIsMountedRef();
const baseUrl =
'https://us-central1-codeforcauseorg.cloudfunctions.net/widgets/applications/request';
- const [activeStep, setActiveStep] = React.useState(-1);
+ const [activeStep, setActiveStep] = React.useState(1);
const [formData, setFormData] = React.useState({
personal: {},
education: {},
@@ -177,7 +181,10 @@ export function ApplicationSteps({ applicationId, setCourseTitle }) {
)}
{activeStep === steps.length + 1 && (
- Application have been submitted successfully. We will email/call you for further process.
+
+ Application have been submitted successfully. We will email/call you
+ for further process.
+
)}
@@ -308,6 +315,9 @@ function FormEducationInfo({
}) {
const classes = useStyles();
const [formData, updateFormData] = useState(data.education);
+ const [districtToCollegePair, updateDistrictToCollegePair] = useState({});
+ const [districts, updateDistricts] = useState([]);
+ const [collegeList, updateCollege] = useState([]);
const handleChange = event => {
updateFormData({
@@ -339,9 +349,42 @@ function FormEducationInfo({
setActiveStep(2);
};
+ const handleStateFieldChange = event => {
+ updateFormData({
+ ...formData,
+ [event.target.name]: event.target.value
+ });
+ updateDistrictToCollegePair(getDistrict(event.target.value));
+ updateDistricts([]);
+ updateCollege([]);
+ };
+
+ const handleDistrictFieldChange = event => {
+ updateFormData({
+ ...formData,
+ [event.target.name]: event.target.value
+ });
+ updateCollege(getColleges(districtToCollegePair, event.target.value));
+ };
+
+ const handleDistrictFocus = () => {
+ if (formData.state !== undefined) {
+ updateDistricts(Object.keys(districtToCollegePair));
+ }
+ };
+
+ function notIndia() {
+ return (
+ formData.country === undefined ||
+ formData.country.trim().toLowerCase() !== 'india'
+ );
+ }
+
const years = Array(25)
- .fill(2000)
- .map((x, y) => x + y);
+ .fill(2024)
+ .map((x, y) => x - y);
+
+ const states = getStates();
return (
@@ -361,33 +404,6 @@ function FormEducationInfo({
return ;
})}
-
-
-
-
-
+ {notIndia() ? (
+
+ ) : (
+
+ {states.sort().map(state => {
+ return ;
+ })}
+
+ )}
+
+ {notIndia() ? (
+
+ ) : (
+
+ {districts.length === 0 ? (
+
+ ) : (
+ districts.sort().map(dis => {
+ return ;
+ })
+ )}
+
+ )}
+
+ {notIndia() ? (
+
+ ) : (
+
+ {collegeList.length === 0 ? (
+
+ ) : (
+ collegeList.sort().map(college => {
+ return ;
+ })
+ )}
+
+ )}
+
diff --git a/src/views/pages/ApplicationsView/educationFormUtil.js b/src/views/pages/ApplicationsView/educationFormUtil.js
new file mode 100644
index 00000000..93f2f4c3
--- /dev/null
+++ b/src/views/pages/ApplicationsView/educationFormUtil.js
@@ -0,0 +1,27 @@
+import Data from '../../../data/colleges.json';
+
+export function getStates() {
+ return Object.keys(Data);
+}
+
+export function getDistrict(state) {
+ const disToC = Object.keys(Data)
+ .filter(st => st === state)
+ .reduce((obj, key) => {
+ obj[key] = Data[key];
+ return obj;
+ }, {});
+
+ return Object.values(disToC)[0];
+}
+
+export function getColleges(districtToCollegePair, district) {
+ const colleges = Object.keys(districtToCollegePair)
+ .filter(dis => dis === district)
+ .reduce((obj, key) => {
+ obj[key] = districtToCollegePair[key];
+ return obj;
+ }, {});
+
+ return Object.values(colleges)[0];
+}