217 lines
8.3 KiB
JavaScript
217 lines
8.3 KiB
JavaScript
// pages/admin/storage.js
|
|
import { useState } from "react";
|
|
import Head from "next/head";
|
|
import CookieBanner from "../../components/cookieBanner";
|
|
import Header from "../../components/header";
|
|
import Footer from "../../components/footer";
|
|
import { connect } from "react-redux";
|
|
import { wrapper } from "../../store/store";
|
|
|
|
import StorageTab from "../../components/admin/tabs/storage";
|
|
import AccountsTab from "../../components/admin/tabs/accounts";
|
|
import AppealsTab from "../../components/admin/tabs/appeals";
|
|
import DocumentsTab from "../../components/admin/tabs/documents";
|
|
|
|
import { fetchAdminStorageData } from "../../components/admin/utils/serverside";
|
|
import { getNewAppeals } from "../../actions/services/adminService";
|
|
|
|
import { getSearchDetails } from "../../components/utils";
|
|
|
|
import {
|
|
setSearchDetails,
|
|
setSearchResults
|
|
} from "../../store/searchOutput/action";
|
|
import { setCurrentPage } from "../../store/currentView/action";
|
|
|
|
const StoragePage = (props) => {
|
|
const {
|
|
data,
|
|
userData,
|
|
repCompleteCount,
|
|
searchResultsObj,
|
|
docsOffline,
|
|
showFilteredDocs
|
|
} = props;
|
|
const [whichTab, setWhichTab] = useState("documents");
|
|
|
|
return (
|
|
<div>
|
|
<Head>
|
|
<title>Admin Browser</title>
|
|
</Head>
|
|
<div id="page_wrapper">
|
|
<CookieBanner />
|
|
<Header />
|
|
|
|
<div
|
|
className="govuk-width-containera"
|
|
style={{ width: "90%", margin: "auto" }}
|
|
>
|
|
<div className="js-enabled govuk-template__body govuk-frontend-supported">
|
|
<div className="govuk-tabs" data-module="govuk-tabs">
|
|
<h2 className="govuk-tabs__title">Contents</h2>
|
|
|
|
{/* Tabs */}
|
|
<ul className="govuk-tabs__list">
|
|
{[
|
|
"documents",
|
|
"appeals",
|
|
"storage",
|
|
"accounts"
|
|
].map((tab) => (
|
|
<li
|
|
key={tab}
|
|
className={
|
|
whichTab === tab
|
|
? "govuk-tabs__list-item govuk-tabs__list-item--selected"
|
|
: "govuk-tabs__list-item"
|
|
}
|
|
>
|
|
<a
|
|
className="govuk-tabs__tab"
|
|
href={`#${tab}`}
|
|
onClick={() => {
|
|
setWhichTab(tab);
|
|
tab === "appeals" &&
|
|
props.setCurrentPage(1);
|
|
}}
|
|
>
|
|
{" "}
|
|
{tab === "documents" &&
|
|
"Latest Documents"}
|
|
{tab === "appeals" &&
|
|
"Latest Appeals"}
|
|
{tab === "storage" &&
|
|
"Storage Account"}
|
|
{tab === "accounts" &&
|
|
"User Accounts"}
|
|
</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
|
|
{/* Panels */}
|
|
|
|
<div
|
|
className={
|
|
whichTab === "documents"
|
|
? "govuk-tabs__panel"
|
|
: "govuk-tabs__panel govuk-tabs__panel--hidden"
|
|
}
|
|
>
|
|
<DocumentsTab
|
|
documentDetailsObj={
|
|
props.searchResultsObj
|
|
.documentDetailsObj
|
|
}
|
|
docsOffline={docsOffline}
|
|
showFilteredDocs={props.showFilteredDocs}
|
|
/>
|
|
</div>
|
|
<div
|
|
className={
|
|
whichTab === "appeals"
|
|
? "govuk-tabs__panel"
|
|
: "govuk-tabs__panel govuk-tabs__panel--hidden"
|
|
}
|
|
>
|
|
<AppealsTab
|
|
searchResultsObj={searchResultsObj}
|
|
/>
|
|
</div>
|
|
|
|
<div
|
|
className={
|
|
whichTab === "storage"
|
|
? "govuk-tabs__panel"
|
|
: "govuk-tabs__panel govuk-tabs__panel--hidden"
|
|
}
|
|
>
|
|
<StorageTab
|
|
data={data}
|
|
repCompleteCount={repCompleteCount}
|
|
/>
|
|
</div>
|
|
|
|
<div
|
|
className={
|
|
whichTab === "accounts"
|
|
? "govuk-tabs__panel"
|
|
: "govuk-tabs__panel govuk-tabs__panel--hidden"
|
|
}
|
|
>
|
|
<AccountsTab userData={userData} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<Footer />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export const getServerSideProps = wrapper.getServerSideProps(
|
|
(store) => async (ctx) => {
|
|
const { query, req, res } = ctx;
|
|
// IP restriction check
|
|
const ALLOWED_IPS = process.env.ALLOWED_IPS
|
|
? process.env.ALLOWED_IPS.split(",").map((ip) => ip.trim())
|
|
: [];
|
|
const LOCALHOST_IPS = ["127.0.0.1", "::1"];
|
|
const forwarded = req.headers["x-forwarded-for"];
|
|
const ip =
|
|
typeof forwarded === "string"
|
|
? forwarded.split(",")[0]
|
|
: req.socket.remoteAddress;
|
|
|
|
if (![...ALLOWED_IPS, ...LOCALHOST_IPS].includes(ip)) {
|
|
return {
|
|
redirect: { destination: "/403", permanent: false }
|
|
};
|
|
}
|
|
|
|
// 🔹 fetch actual data
|
|
const { data, userData, repCompleteCount } =
|
|
await fetchAdminStorageData();
|
|
|
|
const newAppeals = await getNewAppeals();
|
|
|
|
const searchDetailsObj = await getSearchDetails(newAppeals);
|
|
|
|
store.dispatch(setSearchResults(newAppeals));
|
|
store.dispatch(setSearchDetails(searchDetailsObj));
|
|
const state = store.getState();
|
|
|
|
store.dispatch(setCurrentPage(1));
|
|
|
|
return {
|
|
props: {
|
|
data,
|
|
userData,
|
|
repCompleteCount,
|
|
docsOffline: process.env.DOCAPI_OFFLINE || false,
|
|
showFilteredDocs: process.env.SHOWFILTERDOCS || false
|
|
}
|
|
};
|
|
}
|
|
);
|
|
|
|
const mapDispatchToProps = (dispatch) => {
|
|
return {
|
|
setCurrentPage: (currentPage) => {
|
|
dispatch(setCurrentPage(currentPage));
|
|
}
|
|
};
|
|
};
|
|
|
|
const mapStateToProps = (state) => {
|
|
console.log("===============================\n state:", state);
|
|
return {
|
|
searchResultsObj: state.searchResultsObj
|
|
};
|
|
};
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(StoragePage);
|