added in right hand nav and titles to store

This commit is contained in:
2021-07-14 12:17:45 +01:00
parent f5a0ec2021
commit eab46701e3
17 changed files with 1088 additions and 339 deletions
+12 -10
View File
@@ -2,21 +2,23 @@
import "../styles/sass/styles.scss";
import Loading from "../components/loading";
import { wrapper } from "../store/store";
import { useStore } from "react-redux";
import { useStore, Provider } from "react-redux";
import { persistStore } from "redux-persist";
import { PersistGate } from "redux-persist/integration/react";
const MyApp = ({ Component, pageProps }) => {
const store = useStore((state) => state);
const persistor = persistStore(store, {}, function () {
persistor.persist();
});
const store = useStore((state) => state);
const persistor = persistStore(store, {}, function () {
persistor.persist();
});
return (
<PersistGate persistor={store.__persistor} loading={<Loading />}>
<Component {...pageProps} />
</PersistGate>
);
return (
<Provider store={store}>
<PersistGate persistor={store.__persistor} loading={<Loading />}>
<Component {...pageProps} />
</PersistGate>
</Provider>
);
};
export default wrapper.withRedux(MyApp);
+52 -11
View File
@@ -12,15 +12,27 @@ import { wrapper } from "../../store/store";
import Cookies from "cookies";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import jsonpath from "jsonpath";
import { useEffect } from "react";
import {
setAppealType,
setAppealTypeTitle,
setAppealTypeID,
getAppealTypeObj,
} from "../../store/appealType/action";
import { setForm, getFormObj } from "../../store/formData/action";
import { getFormData } from "../../actions";
import { getFormData, getAppealsTypes } from "../../actions";
import xpath from "xpath";
import { reduxForm } from "redux-form";
import BuildSection from "../../components/newappeal/buildsection";
let Home = (props) => {
useEffect(() => {
props.setFormTitle(formTitle);
}, []);
const { footerLinks, pages, formData } = props;
let { t, lang } = useTranslation();
@@ -40,6 +52,31 @@ let Home = (props) => {
var tabs = xpath.select("//form/tabs/tab[*]", doc);
let optionsStr = props.appealType.appealTypeOptions.GlobalOptionSet.Options;
let selectedObj = jsonpath.query(
optionsStr,
"$..LocalizedLabels[?(@.Label)].Label"
);
//let optionsTitleObj = [];
const optionsTitleObj = selectedObj.reduce(
(obj, arrValue) => (
(obj[arrValue] = arrValue
.replace(/[\s\-\+\(\)\,]/g, "")
.toLowerCase()),
obj
),
{}
);
const formTitle = Object.keys(optionsTitleObj).find(
(key) => optionsTitleObj[key] === appealtypes
);
console.log(formTitle);
// crm api query for looking up picklist fields/drop downs
// <url path to >/api/data/v8.2/EntityDefinitions(LogicalName='{appeal type form}')/Attributes(LogicalName='{drop down datafield name}')/Microsoft.Dynamics.CRM.PicklistAttributeMetadata?$select=LogicalName&$expand=GlobalOptionSet($select=Options)
// eg https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/EntityDefinitions(LogicalName='pinswg_householderappealhas')/Attributes(LogicalName='pinswg_casetype')/Microsoft.Dynamics.CRM.PicklistAttributeMetadata?$select=LogicalName&$expand=GlobalOptionSet($select=Options)
@@ -58,15 +95,6 @@ let Home = (props) => {
/// to get dropdowns names
// form/tabs/tab[*]//rows/row//control[@classid="{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}"]/@datafieldname
const Sections = Object.keys(tabs).map((key, index) => (
<BuildSection
formXML={formXML}
whichSection={key}
sectionCount={sectionCount}
key={key}
/>
));
const { onSubmit } = props;
return (
@@ -87,6 +115,7 @@ let Home = (props) => {
formXML={formXML}
sectionCount={sectionCount}
onSubmit={onSubmit}
formTitle={formTitle}
/>
</div>
<Footer footerLinks={footerLinks} />
@@ -99,11 +128,15 @@ export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
console.log("the query", query);
store.dispatch(setAppealTypeID(query.appealtypes));
const appealTypeData = await getAppealsTypes();
const formdata = (await getFormData(query.appealtypes)) || null;
let xmlStr = formdata;
xmlStr = formdata.value[0].formxml;
xmlStr = xmlStr.replace(/\\"/g, "");
store.dispatch(setForm(xmlStr));
store.dispatch(setAppealType(appealTypeData));
}
);
@@ -139,4 +172,12 @@ const mapStateToProps = (state) => {
};
};
export default connect(mapStateToProps)(Home);
const mapDispatchToProps = (dispatch) => {
return {
setFormTitle: (title) => {
dispatch(setAppealTypeTitle(title));
},
};
};
export default connect(mapStateToProps, mapDispatchToProps)(Home);
+11 -2
View File
@@ -26,7 +26,7 @@ const Home = (props) => {
<div>
<Head>
<title>
{t("myportal:page-title")} - {t("common:service-name")}
{t("newappeal:page-title")} - {t("common:service-name")}
</title>
</Head>
<div id="page_wrapper">
@@ -77,4 +77,13 @@ const Home = (props) => {
// };
// };
export default Home; //connect(mapStateToProps)(Home);
const mapStateToProps = (state) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
};
};
export default connect(mapStateToProps)(Home);
+28 -12
View File
@@ -14,7 +14,12 @@ import { useRouter } from "next/router";
import { useState } from "react";
import useTranslation from "next-translate/useTranslation";
import { setAppealType, gtAppealTypeObj } from "../../store/appealType/action";
import {
setAppealType,
setAppealTypeTitle,
setAppealTypeID,
getAppealTypeObj,
} from "../../store/appealType/action";
import { getAppealsTypes } from "../../actions";
import xpath from "xpath";
@@ -28,7 +33,8 @@ const Home = (props) => {
const { appealType } = props;
const optionsObj = props.appealType.appealType.GlobalOptionSet.Options;
const optionsObj =
props.appealType.appealTypeOptions.GlobalOptionSet.Options;
const appealOptions = Object.keys(optionsObj).map((key, index) => (
<option
@@ -47,11 +53,8 @@ const Home = (props) => {
const selectAppealType = (event) => {
event.preventDefault();
console.log(appealTypeSelect);
// /searchresults
router.push({
pathname: "/newappeal/" + appealTypeSelect,
router.replace("/newappeal/" + props.appealType.appealTypeID, null, {
shallow: true,
});
};
@@ -86,9 +89,9 @@ const Home = (props) => {
className="govuk-select"
id="appealTypes"
name="appealTypes"
onChange={handleParam(
setAppealTypeSelect
)}
onChange={(e) =>
props.onChangeSelect(e)
}
>
{appealOptions}
</select>
@@ -113,7 +116,7 @@ const Home = (props) => {
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
const appealTypeData = (await getAppealsTypes()) || null;
const appealTypeData = await getAppealsTypes();
console.log("appeal types", appealTypeData);
store.dispatch(setAppealType(appealTypeData));
}
@@ -128,4 +131,17 @@ const mapStateToProps = (state) => {
};
};
export default connect(mapStateToProps)(Home);
const mapDispatchToProps = (dispatch) => {
return {
onChangeSelect: (event) => {
dispatch(
setAppealTypeTitle(
event.target.options[event.target.selectedIndex].text
)
);
dispatch(setAppealTypeID(event.target.value));
},
};
};
export default connect(mapStateToProps, mapDispatchToProps)(Home);