From 9888fec7c0edb765773ecf90df622e72840a1245 Mon Sep 17 00:00:00 2001 From: Maruf Bepary Date: Wed, 15 Mar 2023 16:56:53 +0000 Subject: [PATCH] Added documentation --- src/components/Community/About.tsx | 4 +- .../CommunitySettings/CommunitySettings.tsx | 49 ++++++++++++++++--- src/components/atoms/Icon.tsx | 2 + 3 files changed, 46 insertions(+), 9 deletions(-) diff --git a/src/components/Community/About.tsx b/src/components/Community/About.tsx index e9742d4..6908240 100644 --- a/src/components/Community/About.tsx +++ b/src/components/Community/About.tsx @@ -24,7 +24,7 @@ type AboutProps = { * - Button for creating a new post * * Additional elements are displayed if the current user is an admin: - * - Button for changing image + * - Button for opening the community settings modal * @param {communityData} - data required to be displayed * @returns (React.FC) - About component * @requires AboutHeaderBar - Header bar for the about section. @@ -135,7 +135,7 @@ type AdminSectionAboutProps = { /** * Displays some additional elements if the current user is an admin: - * - Button for changing image + * - Button for opening the community settings modal * @returns {React.FC} - Admin section component */ const AdminSectionAbout: React.FC = ({ diff --git a/src/components/Modal/CommunitySettings/CommunitySettings.tsx b/src/components/Modal/CommunitySettings/CommunitySettings.tsx index 2a6a632..1e0d803 100644 --- a/src/components/Modal/CommunitySettings/CommunitySettings.tsx +++ b/src/components/Modal/CommunitySettings/CommunitySettings.tsx @@ -31,12 +31,27 @@ import { useAuthState } from "react-firebase-hooks/auth"; import { BsFillPeopleFill } from "react-icons/bs"; import { useRecoilState } from "recoil"; +/** + * @param {boolean} open - boolean to determine if the modal is open or not + * @param {function} handleClose - function to close the modal + * @param {Community} communityData - data required to be displayed + */ type CommunitySettingsModalProps = { open: boolean; handleClose: () => void; communityData: Community; }; +/** + * Allows the admin to change the settings of the community. + * The following settings can be changed: + * - Community image + * - Visibility of the community + * @param {open} - boolean to determine if the modal is open or not + * @param {handleClose} - function to close the modal + * @param {communityData} - data required to be displayed + * @returns {React.FC} - CommunitySettingsModal component + */ const CommunitySettingsModal: React.FC = ({ open, handleClose, @@ -74,7 +89,7 @@ const CommunitySettingsModal: React.FC = ({ imageURL: downloadURL, }); // update imageURL in firestore - // update imageURL in recoil state + // update imageURL in current community recoil state setCommunityStateValue((prev) => ({ ...prev, currentCommunity: { @@ -83,8 +98,7 @@ const CommunitySettingsModal: React.FC = ({ } as Community, })); - // update mySnippet - // mySnippets = communityStateValue.mySnippets + // update mySnippet imageURL in recoil state setCommunityStateValue((prev) => ({ ...prev, mySnippets: prev.mySnippets.map((snippet) => { @@ -118,7 +132,7 @@ const CommunitySettingsModal: React.FC = ({ imageURL: "", }); // update imageURL in firestore - // updates the state to change the ui + // update imageURL in current community recoil state setCommunityStateValue((prev) => ({ ...prev, currentCommunity: { @@ -127,7 +141,7 @@ const CommunitySettingsModal: React.FC = ({ } as Community, })); // update imageURL in recoil state - // update mySnippet + // update mySnippet imageURL in recoil state setCommunityStateValue((prev) => ({ ...prev, mySnippets: prev.mySnippets.map((snippet) => { @@ -147,11 +161,16 @@ const CommunitySettingsModal: React.FC = ({ const [selectedPrivacyType, setSelectedPrivacyType] = useState(""); + /** + * Changes the privacy type of the current community. + * @param {string} privacyType - privacy type to be changed to + */ const onUpdateCommunityPrivacyType = async (privacyType: string) => { try { await updateDoc(doc(firestore, "communities", communityData.id), { privacyType, }); + // update privacyType in current community recoil state setCommunityStateValue((prev) => ({ ...prev, currentCommunity: { @@ -164,10 +183,23 @@ const CommunitySettingsModal: React.FC = ({ } }; - const handlePrivacyTypeChange = (e: React.ChangeEvent) => { - setSelectedPrivacyType(e.target.value); + /** + * Handles changes to the privacy type select input. + * @param {React.ChangeEvent} event - event when user selects a file + */ + const handlePrivacyTypeChange = ( + event: React.ChangeEvent + ) => { + setSelectedPrivacyType(event.target.value); // set selected privacy type }; + /** + * Handles applying changes to the community settings. + * Changes can be: + * - Changing the privacy type + * - Changing the community image + * - Deleting the community image + */ const handleSaveButtonClick = () => { // Save privacy type change if (selectedPrivacyType) { @@ -182,6 +214,9 @@ const CommunitySettingsModal: React.FC = ({ closeModal(); }; + /** + * Closes the modal and resets the state. + */ const closeModal = () => { setSelectedFile(""); setSelectedPrivacyType(""); diff --git a/src/components/atoms/Icon.tsx b/src/components/atoms/Icon.tsx index 169edcf..979c4bd 100644 --- a/src/components/atoms/Icon.tsx +++ b/src/components/atoms/Icon.tsx @@ -7,6 +7,7 @@ import { IconType } from "react-icons"; * @param {IconType} icon - Icon to be displayed * @param {number} fontSize - Font size of the icon * @param {() => void} onClick - Function to be executed when the button is clicked + * @param {string} iconColor - Color of the icon */ type IconProps = { icon: IconType; @@ -21,6 +22,7 @@ type IconProps = { * @param {IconType} icon - Icon to be displayed * @param {number} fontSize - Font size of the icon * @param {() => void} onClick - Function to be executed when the button is clicked + * @param {string} iconColor - Color of the icon (default: black) * * @returns {React.FC} - Icon with a hover effect */