@plusscommunities/pluss-feature-builder-web-a 1.0.2-beta.0

package/src/pages/EditListingPage.jsx

@@ -0,0 +1,58 @@
+import React from "react";
+import { useDispatch, useSelector } from "react-redux";
+import ListingEditor from "../components/ListingEditor.jsx";
+import { ListingSuccessPopup } from "../components/ListingSuccessPopup.jsx";
+import { fetchFeatureDefinitions } from "../actions/featureDefinitionsIndex.js";
+import { fetchSingleListing } from "../actions/listingActions";
+import { selectListingById } from "../selectors/featureBuilderSelectors";
+import { values } from "../values.config.js";
+
+const EditListingPage = ({ match, history }) => {
+	const listingId = match.params.id;
+	const dispatch = useDispatch();
+	const [showSuccessPopup, setShowSuccessPopup] = React.useState(false);
+
+	// Fetch feature definitions
+	React.useEffect(() => {
+		dispatch(fetchFeatureDefinitions());
+	}, [dispatch]);
+
+	// Fetch specific listing for edit mode only if not already in store
+	const listing = useSelector((state) => selectListingById(state, listingId));
+	React.useEffect(() => {
+		if (listingId && !listing) {
+			dispatch(fetchSingleListing(listingId));
+		}
+	}, [dispatch, listingId, listing]);
+
+	const handleSuccess = () => {
+		setShowSuccessPopup(true);
+	};
+
+	const handleSuccessPopupClose = () => {
+		setShowSuccessPopup(false);
+		history.push(values.routeListingScreen);
+	};
+
+	const handleCancel = () => {
+		history.push(values.routeListingScreen);
+	};
+
+	return (
+		<>
+			<ListingEditor
+				mode="edit"
+				listingId={listingId}
+				onSuccess={handleSuccess}
+				onCancel={handleCancel}
+			/>
+			<ListingSuccessPopup
+				isOpen={showSuccessPopup}
+				onClose={handleSuccessPopupClose}
+				mode="edit"
+			/>
+		</>
+	);
+};
+
+export default EditListingPage;