@@ -432,6 +436,37 @@ class SummitDashboardPage extends React.Component {
}
}
+SummitDashboardPage.propTypes = {
+ currentSummit: PropTypes.shape({
+ id: PropTypes.number,
+ name: PropTypes.string,
+ time_zone: PropTypes.shape({
+ name: PropTypes.string
+ }),
+ start_date: PropTypes.number,
+ end_date: PropTypes.number,
+ registration_begin_date: PropTypes.number,
+ registration_end_date: PropTypes.number,
+ selection_plans: PropTypes.arrayOf(PropTypes.object),
+ locations: PropTypes.arrayOf(PropTypes.object),
+ speakers_count: PropTypes.number,
+ presentations_submitted_count: PropTypes.number,
+ published_events_count: PropTypes.number,
+ presentation_voters_count: PropTypes.number,
+ presentation_votes_count: PropTypes.number,
+ speaker_announcement_email_accepted_count: PropTypes.number,
+ speaker_announcement_email_rejected_count: PropTypes.number,
+ speaker_announcement_email_alternate_count: PropTypes.number,
+ speaker_announcement_email_accepted_alternate_count: PropTypes.number,
+ speaker_announcement_email_accepted_rejected_count: PropTypes.number,
+ speaker_announcement_email_alternate_rejected_count: PropTypes.number
+ }).isRequired,
+ member: PropTypes.object,
+ match: PropTypes.shape({
+ url: PropTypes.string
+ }).isRequired
+};
+
const mapStateToProps = ({ currentSummitState, loggedUserState }) => ({
currentSummit: currentSummitState.currentSummit,
member: loggedUserState.member
diff --git a/src/pages/summits/summit-directory-page.js b/src/pages/summits/summit-directory-page.js
index 2b4118710..f5d84a303 100644
--- a/src/pages/summits/summit-directory-page.js
+++ b/src/pages/summits/summit-directory-page.js
@@ -11,169 +11,247 @@
* limitations under the License.
* */
-import React from "react";
+import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import T from "i18n-react/dist/i18n-react";
-import Swal from "sweetalert2";
import { formatEpoch } from "openstack-uicore-foundation/lib/utils/methods";
-import { Pagination } from "react-bootstrap";
-import history from "../../history";
+import MuiTable from "openstack-uicore-foundation/lib/components/mui/table";
+import MuiSearchInput from "openstack-uicore-foundation/lib/components/mui/search-input";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Checkbox from "@mui/material/Checkbox";
+import Chip from "@mui/material/Chip";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import FormGroup from "@mui/material/FormGroup";
+import Grid2 from "@mui/material/Grid2";
+import AddIcon from "@mui/icons-material/Add";
import {
loadSummits,
clearCurrentSummit,
deleteSummit
} from "../../actions/summit-actions";
import Member from "../../models/member";
+import { DEFAULT_CURRENT_PAGE } from "../../utils/constants";
-import "../../styles/summit-directory-page.less";
-
-class SummitDirectoryPage extends React.Component {
- constructor(props) {
- super(props);
-
- props.clearCurrentSummit();
- props.loadSummits();
-
- this.handlePageChange = this.handlePageChange.bind(this);
- }
+const SummitDirectoryPage = ({
+ summits,
+ member,
+ currentPage,
+ perPage,
+ totalSummits,
+ loadSummits,
+ clearCurrentSummit,
+ deleteSummit,
+ history
+}) => {
+ const [searchTerm, setSearchTerm] = useState("");
+ const [hidePastEvents, setHidePastEvents] = useState(false);
+ const safeSummits = Array.isArray(summits) ? summits : [];
+ const safeMember =
+ member && typeof member === "object"
+ ? { ...member, groups: Array.isArray(member.groups) ? member.groups : [] }
+ : { groups: [] };
+ useEffect(() => {
+ clearCurrentSummit();
+ loadSummits(DEFAULT_CURRENT_PAGE, perPage, searchTerm, hidePastEvents);
+ }, []);
- handlePageChange(page) {
- const { perPage } = this.props;
- this.props.loadSummits(page, perPage);
+ let memberObj;
+ try {
+ memberObj = new Member(safeMember);
+ } catch (e) {
+ memberObj = {
+ canEditSummit: () => false,
+ canAddSummits: () => false,
+ canDeleteSummits: () => false
+ };
}
+ const canEditSummit =
+ typeof memberObj.canEditSummit === "function"
+ ? memberObj.canEditSummit()
+ : false;
+ const canAddSummits =
+ typeof memberObj.canAddSummits === "function"
+ ? memberObj.canAddSummits()
+ : false;
+ const canDeleteSummits =
+ typeof memberObj.canDeleteSummits === "function"
+ ? memberObj.canDeleteSummits()
+ : false;
- onSelectedSummit(event, summit) {
- event.preventDefault();
- history.push(`/app/summits/${summit.id}/dashboard`);
- return false;
- }
+ try {
+ const handlePageChange = (page) => {
+ loadSummits(page, perPage, searchTerm, hidePastEvents);
+ };
- onEditSummit(summit, ev) {
- const { history } = this.props;
- ev.preventDefault();
+ const handlePerPageChange = (newPerPage) => {
+ loadSummits(DEFAULT_CURRENT_PAGE, newPerPage, searchTerm, hidePastEvents);
+ };
- history.push(`/app/summits/${summit.id}`);
- }
+ const handleSearch = (value) => {
+ setSearchTerm(value);
+ loadSummits(DEFAULT_CURRENT_PAGE, perPage, value, hidePastEvents);
+ };
- onNewSummit(ev) {
- const { history } = this.props;
- ev.preventDefault();
+ const handleHidePastEventsChange = (ev) => {
+ const { checked } = ev.target;
+ setHidePastEvents(checked);
+ loadSummits(DEFAULT_CURRENT_PAGE, perPage, searchTerm, checked);
+ };
- history.push("/app/summits/new");
- }
+ const handleNewSummit = () => {
+ history.push("/app/summits/new");
+ };
- onDeleteSummit(summit, ev) {
- const { deleteSummit } = this.props;
+ const handleEditSummit = (summit) => {
+ history.push(`/app/summits/${summit.id}`);
+ };
- ev.preventDefault();
+ const handleSelectSummit = (summit) => {
+ history.push(`/app/summits/${summit.id}/dashboard`);
+ };
- Swal.fire({
- title: T.translate("general.are_you_sure"),
- text: `${T.translate("directory.remove_warning")} ${summit.name}`,
- type: "warning",
- showCancelButton: true,
- confirmButtonColor: "#DD6B55",
- confirmButtonText: T.translate("general.yes_delete")
- }).then((result) => {
- if (result.value) {
- deleteSummit(summit.id);
+ const columns = [
+ {
+ columnKey: "id",
+ header: T.translate("directory.id"),
+ width: 80
+ },
+ {
+ columnKey: "name",
+ header: T.translate("directory.summit_name")
+ },
+ {
+ columnKey: "sponsor_qty",
+ header: T.translate("directory.sponsors"),
+ render: (row) => row.sponsor_qty ?? 0
+ },
+ {
+ columnKey: "sponsor_forms_qty",
+ header: T.translate("directory.forms"),
+ render: (row) => row.sponsor_forms_qty ?? 0
+ },
+ {
+ columnKey: "sponsor_attachments_qty",
+ header: T.translate("directory.attachments"),
+ render: (row) => row.sponsor_attachments_qty ?? 0
+ },
+ {
+ columnKey: "start_date",
+ header: T.translate("directory.start_date"),
+ render: (row) => formatEpoch(row.start_date, "MMMM Do YYYY")
+ },
+ {
+ columnKey: "end_date",
+ header: T.translate("directory.end_date"),
+ render: (row) => formatEpoch(row.end_date, "MMMM Do YYYY")
+ },
+ {
+ columnKey: "invite_only_registration",
+ header: "",
+ width: 120,
+ render: (row) =>
+ row.invite_only_registration ? (
+
+ ) : null
}
- });
- }
-
- render() {
- const { summits, member, lastPage, currentPage, totalSummits } = this.props;
- const memberObj = new Member(member);
-
- const canEditSummit = memberObj.canEditSummit();
- const canAddSummits = memberObj.canAddSummits();
- const canDeleteSummits = memberObj.canDeleteSummits();
+ ];
return (
-
-
- {" "}
- {T.translate("directory.summits")} ({totalSummits})
-
- {canAddSummits && (
-
-
-
-
-
- )}
-
+
+ )}
+
+
+
deleteSummit(id) : undefined}
+ onSelect={handleSelectSummit}
+ getName={(row) => row.name}
+ deleteDialogTitle={T.translate("general.are_you_sure")}
+ deleteDialogBody={(name) =>
+ `${T.translate("directory.remove_warning")} ${name}`
+ }
+ deleteDialogConfirmText={T.translate("general.yes_delete")}
+ confirmButtonColor="error"
+ />
+
+ );
+ } catch (err) {
+ return (
+
+
{T.translate("directory.error_loading")}
+
{err.message}