+
+ );
+};
+
+export default LcReportAttendee;
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcHistory.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcHistory.tsx
index 6fa11b128..b41071d0e 100644
--- a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcHistory.tsx
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcHistory.tsx
@@ -1,86 +1,241 @@
import styles from "../LcDashboard.module.css";
-import { LcAttendees } from "./LcAttendees";
-import { useEffect, useState } from "react";
-import { getLCMeetingReport } from "../../../services/LearningCircleAPIs";
-import { convertDateToDayAndMonthAndYear } from "../../../../../utils/common";
+import {
+ fetchURLQRCode,
+ interestedMeetup,
+ joinMeetup
+} from "../../../services/LearningCircleAPIs";
+import { convertToFormatedDate } from "../../../../../utils/common";
import {
convert24to12,
extract24hTimeFromDateTime,
getDayOfWeek
} from "../../../services/utils";
-import { useParams } from "react-router-dom";
import MuLoader from "@/MuLearnComponents/MuLoader/MuLoader";
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
+import toast from "react-hot-toast";
+import { useNavigate, useSearchParams } from "react-router-dom";
+import { useEffect, useState } from "react";
type Props = {
id: string | undefined;
- lc: LcDetail | undefined;
+ lc: LcMeetupDetailInfo | undefined;
+ setLc: UseStateFunc
+
+
+
+
+ Brief description *
+ +
+
+ Meeting Tasks
++ Please check which tasks you've done, and upload an + image or a link that shows the work you have done. +
+ {meetup?.tasks.map((task, index) => ( +
+
+ ))}
+
+ {
+ e.target.checked
+ ? setCompletedTasks([
+ ...(completedTasks as any),
+ task.id
+ ])
+ : setCompletedTasks(
+ completedTasks.filter(
+ id => id !== task.id
+ )
+ );
+ }}
+ />
+
+ {task.title}
+
+
+
+
+ handleTaskSubmit(task.id ?? "")
+ }
+ >
+ Submit
+
+
+
+ {
+ e.preventDefault();
+ filePickerRefs.current[
+ task.id ?? ""
+ ]?.click();
+ }}
+ disabled={isTaskPOWSubmitting}
+ >
+ Upload Image
+
+
+
+ {taskImages[task.id ?? ""]?.name ?? ""}
+
+
+ OR
+ {
+ setTaskUrls({
+ ...taskUrls,
+ [task.id ?? ""]: e.target.value
+ });
+ }}
+ className={styles.input}
+ disabled={isTaskPOWSubmitting}
+ placeholder="Enter URL"
+ />
+
+ (filePickerRefs.current[task.id ?? ""] =
+ el)
+ }
+ type="file"
+ onChange={e => {
+ if (e.target.files) {
+ if (
+ e.target.files[0].size > 5000000
+ ) {
+ toast.error(
+ "File size should not exceed 5MB"
+ );
+ return;
+ }
+ if (
+ e.target.files[0].type !=
+ "image/jpeg" &&
+ e.target.files[0].type !=
+ "image/png"
+ ) {
+ toast.error(
+ "Please upload png or jpeg image"
+ );
+ return;
+ }
+ setTaskImages({
+ ...taskImages,
+ [task.id ?? ""]:
+ e.target.files[0]
+ });
+ }
+ }}
+ style={{ display: "none" }}
+ className={styles.input}
+ placeholder="Upload File"
+ disabled={isTaskPOWSubmitting}
+ />
+
- {data ? (
+
-
-
Learning Circle Meetup
+ {props.lc ? ( <>
-
- - {convertDateToDayAndMonthAndYear( - data?.meet_time - )} -
-{getDayOfWeek(data?.meet_time)}
+{props.lc?.title}
+{getDayOfWeek(props.lc?.meet_time)}
+
+ {props.lc.is_lc_member && (
+
+
+ )}
+ {props.lc.is_started &&
+ props.lc.is_lc_member ? (
+ { + navigator.clipboard.writeText( + props.lc?.meet_code ?? + "NOTCOPIED" + ); + toast.success("Code Copied"); + }} + > + {" "} + + {props.lc.meet_code} +
+{ + navigator.clipboard.writeText( + (window.location.href ?? + "NOTCOPIED") + + "/?code=" + + props.lc?.meet_code + ); + toast.success("Link Copied"); + }} + > + {" "} + + Copy Link +
++ {props.lc.total_interested}{" "} + Interests Submitted +
++ {props.lc.total_joined} Joined +
+
+ 
+
+ ) : (
+ <>
+ )}
{
- + Share this QR Code for joining the + meet. +
+- Venuesdf:{" "} - {data.meet_place || +
+ Venue:{" "} + {props.lc.meet_place || props.lc?.meet_place}
} -+
Time:{" "} - {convert24to12( - extract24hTimeFromDateTime( - data.meet_time - ) - )} + {convertToFormatedDate(props.lc.meet_time) + + " " + + convert24to12( + extract24hTimeFromDateTime( + props.lc.meet_time + ) + )}
Agenda
-{data.agenda}
-
- {
+ e.preventDefault();
+ navigate(
+ "/dashboard/learning-circle/meetup/" +
+ props.lc?.id +
+ "/attendee-report"
+ );
+ }}
+ >
+ {props.lc.is_attendee_report_submitted
+ ? "Report Submitted"
+ : "Submit Report"}
+
+ ) : null}
+
+ {props.lc.joined_at
+ ? "Joined"
+ : props.lc.is_started
+ ? props.lc.is_lc_member || meetupCode
+ ? "Join"
+ : "I'm Interested to Join"
+ : props.lc.is_lc_member
+ ? "Join & Start Meetup"
+ : props.lc.is_interested
+ ? "Undo Interested"
+ : "I'm Interested Join"}
+
) : (
-
+ Attendees
- {Array.isArray(data.attendees_details) && - data.attendees_details.map(attendee => ( -
-
- {props.lc.agenda}
+ {props.lc.pre_requirements ? ( + <> +Prerequisites
+{props.lc.pre_requirements}
+ + ) : ( + <> + )} +Tasks
+
+ {props.lc.tasks.map((task, index) => (
+
+ {index + 1}
+ {task.title}
))}
+
- 
-
+ {props.lc.image ? (
+
+ {props.lc.joined_at ? (
+
+ 
+
+ ) : null}
+ {
- const nextMeet = getNextMeetingDate(
- props.lc?.day || [],
- props.lc?.meet_time === null ? "00:00" : String(props.lc?.meet_time)
- );
-
- const [selectedMeeting, setSelectedMeeting] = useState("");
-
+ const [meetups, setMeetups] = useState([]);
+ const [pastMeetups, setPastMeetups] = useState([]);
+ const [reportPending, setReportPending] = useState([]);
+ const [selectedMeeting, setSelectedMeeting] = useState("");
+ useEffect(() => {
+ getLcMeetups(props.id ?? "").then(res => {
+ if (res) {
+ if (res.hasError) {
+ toast.error(res.message.general[0]);
+ } else {
+ setMeetups(res.meetups);
+ setPastMeetups(res.past);
+ setReportPending(res.report_pending);
+ }
+ }
+ });
+ }, [props.lc]);
+ const navigate = useNavigate();
return (
>;
+ lc: LcDetail | undefined;
+ id: string | undefined;
+};
+
+const LcMeetCreate = (props: Props) => {
+ const [tasks, setTasks] = useState([]);
+ const taskInputRef = createRef();
+ const [isLoading, setIsLoading] = useState(false);
+ const formik = useFormik({
+ initialValues: {
+ title: "",
+ location: "",
+ meet_time: "",
+ meet_place: "",
+ agenda: "",
+ need_pre_requirements: false,
+ pre_requirements: null,
+ is_public: true,
+ limit_attendees: false,
+ max_attendees: -1,
+ is_online: false
+ },
+ onSubmit: values => {
+ if (tasks.length === 0) {
+ toast.error("Please add tasks");
+ return;
+ }
+ setIsLoading(true);
+ createMeetup({ ...values, tasks: tasks }, props.id ?? "")
+ .then(res => {
+ setIsLoading(false);
+ if (res) {
+ if (res.hasError) {
+ toast.error(res.message.general[0]);
+ } else {
+ toast.success(res.message.general[0]);
+ }
+ }
+ })
+ .catch(err => {
+ setIsLoading(false);
+ toast.error("Failed to create meetup");
+ });
+
+ props.setTemp(prev => ({
+ ...prev,
+ isCreateMeeting: false
+ }));
+ },
+ validate: values => {
+ if (values.location === "") {
+ return { location: "Location is required" };
+ } else if (!values.location.startsWith("http")) {
+ return {
+ location:
+ "Location should be link to maps location or online meet link."
+ };
+ }
+ }
+ });
+
+ return (
+ <>
+ ();
+ const [selectedCategory, setSelectedCategories] = useState<{
+ label: string;
+ value: string;
+ }>();
+ useEffect(() => {
+ getMeetups(
+ setMeetups,
+ undefined,
+ user_id ? user_id : undefined,
+ selectedCategory?.value == "all"
+ ? undefined
+ : selectedCategory?.value
+ )
+ .then(() => {})
+ .catch(error => {
+ console.log(error);
+ toast.error("Failed to fetch meetups");
+ });
+ }, [user_id, selectedCategory]);
+ const categories = [
+ { label: "All Categories", value: "all" },
+ { label: "Coder", value: "coder" },
+ { label: "Hardware", value: "hardware" },
+ { label: "Manager", value: "manager" },
+ { label: "Creative", value: "creative" }
+ ];
+
+ return (
+ >;
@@ -12,94 +18,58 @@ type Props = {
};
const LcReport = (props: Props) => {
- const [formData, setFormData] = useState({
- day: "",
- meet_time: "",
- agenda: "",
- attendees: []
- });
+ const [reportText, setReportText] = useState("");
const [uploadedImage, setUploadedImage] = useState(null);
-
- useEffect(() => {
- const now = new Date();
- const hours = now.getHours().toString().padStart(2, "0");
- const minutes = now.getMinutes().toString().padStart(2, "0");
- const year = now.getFullYear().toString();
- const month = (now.getMonth() + 1).toString().padStart(2, "0");
- const day = now.getDate().toString().padStart(2, "0");
- setFormData(prevState => ({
- ...prevState,
- day: `${year}-${month}-${day}`,
- meet_time: `${hours}:${minutes}:00`
- }));
- }, []);
-
+ const [attendees, setAttendees] = useState([]);
+ const [attendeeRating, setAttendeeRating] = useState<{
+ [user_id: string]: number;
+ }>({});
+ const [attendeeDetailsExpanded, setAttendeeDetailsExpanded] = useState<{
+ [user_id: string]: boolean;
+ }>({});
const handleImageUpload = (event: React.ChangeEvent) => {
const file = event.target.files && event.target.files[0];
+
if (file) {
setUploadedImage(file);
}
};
-
- const handleMemberClick = (memberId: string) => {
- setFormData(prevState => {
- // Check if the attendee is already in the list
- const isAlreadySelected = prevState.attendees.includes(memberId);
-
- // If already selected, remove them; otherwise, add them
- const updatedAttendees = isAlreadySelected
- ? prevState.attendees.filter(id => id !== memberId) // Remove the attendee
- : [...prevState.attendees, memberId]; // Add the attendee
-
- return {
- ...prevState,
- attendees: updatedAttendees
- };
- });
- };
-
- const validateForm = (state: LcReport) => {
- let errors: { [key: string]: string } = {};
- if (!state.day) {
- errors.day = "Date is required";
- }
- if (!state.meet_time) {
- errors.time = "Time is required";
- }
- if (!state.agenda.trim()) {
- errors.agenda = "Agenda is required";
- }
- if (state.attendees.length === 0) {
- errors.attendees = "At least one attendee is required";
- }
- if (!uploadedImage) {
- errors.image = "Image is required";
- } else {
- const allowedTypes = ["image/jpeg", "image/png", "image/gif"];
- if (!allowedTypes.includes(uploadedImage.type)) {
- errors.image =
- "Invalid image type. Please upload a JPEG, PNG, or GIF.";
- }
- }
- {
- Object.keys(errors).length > 0
- ? toast.error(Object.values(errors).join("\n"))
- : null;
- }
- return Object.keys(errors).length > 0 ? false : true;
- };
+ useEffect(() => {
+ getMeetupAttendees(props.id ?? "")
+ .then(res => {
+ setAttendees(res);
+ })
+ .catch(err => {
+ toast.error("Failed to fetch attendees");
+ });
+ }, []);
const handleSubmit = (event: any) => {
event.preventDefault();
- if (validateForm(formData)) {
+ if (!uploadedImage) {
+ toast.error("Please upload an image");
+ return;
+ }
+ if (reportText.length > 0) {
const data = new FormData();
- data.append("agenda", formData.agenda);
- data.append("attendees", formData.attendees.join(","));
- data.append("time", formData.meet_time);
+ data.append("report_text", reportText);
if (uploadedImage) {
data.append("images", uploadedImage);
}
-
+ var ratings = {};
+ for (var attendee of attendees) {
+ if (!attendeeRating[attendee.attendee_id]) {
+ toast.error("Please rate all attendees");
+ return;
+ } else {
+ ratings = {
+ ...ratings,
+ [attendee.attendee_id]:
+ attendeeRating[attendee.attendee_id]
+ };
+ }
+ }
+ data.append("ratings", JSON.stringify(ratings));
toast.promise(reportMeeting(props.id, data), {
loading: "Reporting...",
success: response => {
@@ -122,13 +92,29 @@ const LcReport = (props: Props) => {
}
);
-
- return Failed to report meeting!;
+ return error?.response?.data?.message ? (
+
+ {
+ (error?.response?.data?.message?.general ?? [
+ "Failed to report meeting"
+ ])[0]
+ }
+
+ ) : (
+ Failed to report meeting!
+ );
}
});
+ } else {
+ toast.error("Please fill the notes");
}
};
-
+ const changeRating = (attendee_id: string, newRating: number): void => {
+ setAttendeeRating(prevState => ({
+ ...prevState,
+ [attendee_id]: newRating
+ }));
+ };
const handleRemoveImage = () => {
setUploadedImage(null);
};
@@ -136,72 +122,116 @@ const LcReport = (props: Props) => {
return (
();
+ useEffect(() => {
+ console.log(user_id);
+ getMeetups(setMeetups, undefined, "user")
+ .then(() => {})
+ .catch(error => {
+ console.log(error);
+ toast.error("Failed to fetch meetups");
+ });
+ }, [user_id]);
+
+ return (
+ ();
const [isLoading, setIsLoading] = useState(true);
-
+ const [curpage, setCurPage] = useState(0);
+ const [meetingCodeModalOpen, setMeetingCodeModalOpen] = useState(false);
useEffect(() => {
getUserLearningCircles(setUserCircleList).then(() => {
setIsLoading(false);
});
}, []);
-
+ const [meetupCode, setMeetupCode] = useState("");
const handleJoin = () => {
navigate("/dashboard/learning-circle/find-circle");
};
@@ -27,8 +34,46 @@ const LearningCircleLandingPage = () => {
navigate("/dashboard/learning-circle/create-circle");
};
+ const joinMeet = () => {
+ if (meetupCode.length !== 6) {
+ toast.error("Invalid meetup code");
+ return;
+ }
+ joinMeetup(meetupCode);
+ setMeetingCodeModalOpen(false);
+ };
+
+ const handleJoinMeetup = () => {
+ setMeetingCodeModalOpen(true);
+ };
return (
<>
+ {
+ setMeetingCodeModalOpen(false);
+ }}
+ title={"Enter Meeting Code"}
+ type={"success"}
+ onDone={joinMeet}
+ >
+
{isLoading ? (
{
onClick={handleJoin}
/>
-
- ();
+ useEffect(() => {
+ getMeetupInfo(setData, params.id ?? "")
+ .then(res => {
+ console.log(res);
+ })
+ .catch(() => {
+ toast.error("Failed to fetch data");
+ });
+ }, []);
+ return data ? (
+
+ | UseStateFunc,
+ meetId: string
+) => {
+ try {
+ console.log(meetId);
+ const response = await privateGateway.get(
+ dynamicRoute(dashboardRoutes.getMeetupInfo, meetId)
+ );
+ console.log(response);
+ const message: any = response?.data;
+ setMeetup(message.response);
+ } catch (err: unknown) {
+ const error = err as AxiosError;
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+
+export const submitAttendeeTaskImage = async (
+ meetId: string,
+ taskId: string,
+ formData: FormData
+) => {
+ try {
+ const response = await privateGateway.post(
+ dynamicRoute(
+ dashboardRoutes.submitAttendeeTaskImage,
+ meetId,
+ taskId
+ ),
+ formData,
+ {
+ headers: {
+ "content-type": "multipart/form-data"
+ }
+ }
+ );
+ console.log(response);
+ const message: any = response?.data?.message?.general[0];
+ toast.success(message);
+ return true;
+ } catch (err: unknown) {
+ const error = err as AxiosError;
+ if ((error?.response?.data as any)?.message?.general[0]) {
+ toast.error((error?.response?.data as any)?.message?.general[0]);
+ }
+ console.log(error);
+ return false;
+ }
+};
+
+export const submitAttendeeReport = async (
+ meetId: string,
+ formData: FormData
+) => {
+ try {
+ console.log(meetId);
+ const response = await privateGateway.post(
+ dynamicRoute(dashboardRoutes.submitAttendeeReport, meetId),
+ formData
+ );
+ console.log(response);
+ const message: any = response?.data;
+ toast.success(message.message?.general[0] ?? "Failed to submit report");
+ } catch (err: unknown) {
+ const error = err as AxiosError;
+ toast.error((error?.response?.data as any)?.message?.general[0]);
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+export const getMeetups = async (
+ setMeetup:
+ | UseStateFunc
+ | UseStateFunc,
+ meetId: string | undefined = undefined,
+ userId: string | undefined = undefined,
+ category: string | undefined = undefined
+) => {
+ try {
+ console.log(meetId);
+ const response = await privateGateway.get(
+ dashboardRoutes.getMeetups + (userId ? userId : ""),
+ {
+ params: meetId
+ ? {
+ meet_id: meetId
+ }
+ : category
+ ? {
+ category: category
+ }
+ : {}
+ }
+ );
+ console.log(response);
+ const message: any = response?.data;
+ setMeetup(message.response);
+ } catch (err: unknown) {
+ const error = err as AxiosError;
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+
export const getUserOrg = (setOrg: {
(value: SetStateAction): void;
(arg0: any): void;
@@ -235,6 +402,52 @@ export const updateLcNote = async (data: LcNote) => {
}
};
+export const getMeetupAttendees = async (id: string | undefined) => {
+ try {
+ console.log(dynamicRoute(lcRoutes.getLcAttendees, id as string));
+ const response = await privateGateway.get(
+ dynamicRoute(lcRoutes.getLcAttendees, id as string)
+ );
+ const message: any = response?.data;
+ return message.response;
+ } catch (err) {
+ const error = err as AxiosError;
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+
+export const getLcMeetups = async (id: string | undefined) => {
+ try {
+ const response = await privateGateway.get(
+ dynamicRoute(lcRoutes.getLcMeetups, id as string)
+ );
+ const message: any = response?.data;
+ return message.response;
+ } catch (err) {
+ const error = err as AxiosError;
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+
+export const createMeetup = async (data: LcMeetup, id: string) => {
+ try {
+ const response = await privateGateway.post(
+ dynamicRoute(lcRoutes.createMeet, id as string),
+ data
+ );
+ const message: any = response?.data;
+ return message;
+ } catch (err) {
+ const error = err as AxiosError;
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
export const setLCMeetTime = async (
data: LcMeetSchedule,
id: string | undefined
@@ -254,6 +467,38 @@ export const setLCMeetTime = async (
}
};
+export const getVerifiableMeetups = async () => {
+ try {
+ const response = await privateGateway.get(lcRoutes.verifyList);
+ const message: any = response?.data;
+ return message.response;
+ } catch (err) {
+ const error = err as AxiosError;
+ toast.error("Failed to get list of meetups.");
+ if (error?.response) {
+ throw error;
+ }
+ }
+};
+
+export const fetchURLQRCode = async (setBlob: any, target_url: string) => {
+ try {
+ const url = `https://quickchart.io/qr?text=${target_url}¢erImageUrl=https://avatars.githubusercontent.com/u/98015594?s=88&v=4`;
+ const response = await axios
+ .get(url, {
+ responseType: "arraybuffer"
+ })
+ .then(response => {
+ const blob = new Blob([response.data], {
+ type: "image/png"
+ });
+ setBlob(URL.createObjectURL(blob));
+ });
+ } catch (error) {
+ console.error(error);
+ }
+};
+
export const reportMeeting = async (id: string | undefined, data: FormData) => {
try {
const response = await privateGateway.post(
diff --git a/src/modules/Dashboard/modules/LearningCircle/services/LearningCircleInterface.d.ts b/src/modules/Dashboard/modules/LearningCircle/services/LearningCircleInterface.d.ts
index ae9f183f7..54ae26804 100644
--- a/src/modules/Dashboard/modules/LearningCircle/services/LearningCircleInterface.d.ts
+++ b/src/modules/Dashboard/modules/LearningCircle/services/LearningCircleInterface.d.ts
@@ -45,6 +45,7 @@ interface LcDashboardTempData {
isTeam: boolean;
isSchedule: boolean;
reRender: boolean;
+ isCreateMeeting: boolean;
}
interface LcMeetSchedule {
@@ -52,7 +53,47 @@ interface LcMeetSchedule {
meet_place: string;
day: string;
}
+type LcTask = {
+ id: string | undefined;
+ title: string;
+ is_completed: boolean;
+ is_image: boolean;
+ image_url: string | null;
+ proof_url: string | null;
+};
+interface LcMeetup {
+ title: string;
+ location: string;
+ meet_time: string;
+ meet_place: string;
+ agenda: string;
+ need_pre_requirements: boolean;
+ pre_requirements: string | null;
+ is_public: boolean;
+ limit_attendees: boolean;
+ max_attendees: number;
+ tasks: LcTask[];
+ is_online: boolean;
+}
+type LcMeetupInfo = LcMeetup & {
+ id: string;
+ is_started: boolean;
+ is_report_submitted: boolean;
+ meet_code: string | null;
+ image: string | null;
+};
+
+type LcMeetupDetailInfo = LcMeetupInfo & {
+ tasks: LcTask[];
+ is_interested: boolean;
+ joined_at: string | null;
+ total_interested: number;
+ total_joined: number;
+ lc_members: number;
+ is_lc_member: boolean;
+ is_attendee_report_submitted: boolean;
+};
interface LcNote {
note: string;
id: string | undefined;
@@ -64,13 +105,6 @@ interface ChecklistItem {
isChecked: boolean;
}
-interface LcReport {
- agenda: string;
- attendees: string[];
- day: string;
- meet_time: string;
-}
-
interface LcPastReports {
id: string;
meet_time: string;
@@ -91,6 +125,10 @@ interface LcHistory {
}
interface LcAttendees {
+ attendee_id: string;
fullname: string;
profile_pic: string;
+ title: string;
+ report: string;
+ proof_of_work: LcTask[];
}
diff --git a/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.module.css b/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.module.css
new file mode 100644
index 000000000..2d04c5326
--- /dev/null
+++ b/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.module.css
@@ -0,0 +1,61 @@
+@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&display=swap");
+
+.wrapper {
+ padding: 1rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.tableWrapper {
+ background-color: white;
+ border-radius: 10px;
+ padding: 2rem;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.wrapper form {
+ width: 20rem;
+}
+
+.inputBox {
+ width: 100%;
+ height: 2.5rem;
+ margin-top: 1.5rem;
+}
+
+.inputBox span {
+ color: red;
+ font-size: small;
+ margin-left: 15px;
+}
+
+.inputBox input {
+ width: 100%;
+ height: 100%;
+ background: #f3f3f4;
+ border-radius: 8px;
+ border: none;
+ padding: 1rem;
+}
+
+.submit {
+ margin-top: 20px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.submit button {
+ width: 100%;
+ color: white;
+}
+
+.text {
+ font-weight: 700;
+}
+
+.errorsSpan {
+ color: red;
+ font-size: small;
+}
diff --git a/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.tsx b/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.tsx
new file mode 100644
index 000000000..bb29ca52d
--- /dev/null
+++ b/src/modules/Dashboard/modules/Settings/pages/Organization/Organization.tsx
@@ -0,0 +1,226 @@
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
+import styles from "./Organization.module.css";
+import { Form, Formik } from "formik";
+import * as z from "yup";
+import { FormikTextInputWithoutLabel as SimpleInput } from "@/MuLearnComponents/FormikComponents/FormikComponents";
+import { useEffect, useState } from "react";
+import {
+ getColleges,
+ getDepartments,
+ getRoles,
+ submitUserData
+} from "../../../../../Common/Authentication/services/newOnboardingApis";
+import ReactSelect, { SingleValue } from "react-select";
+import { useLocation, useNavigate } from "react-router-dom";
+import { selectOrganization } from "../../settingsApis";
+
+// Define the Option type for ReactSelect
+type Option = {
+ value: string;
+ label: string;
+};
+
+const inputObject = {
+ college: "College Name",
+ department: "Department",
+ graduationYear: "Graduation Year"
+};
+
+const scheme = z.object({
+ college: z
+ .string()
+ .required(`${inputObject.college} is Required`)
+ .min(3, `${inputObject.college} must be at least 3 characters`)
+ .max(100, `${inputObject.college} must be at most 100 characters`),
+ department: z
+ .string()
+ .required(`${inputObject.department} is Required`)
+ .min(2, `${inputObject.department} must be at least 2 characters`)
+ .max(100, `${inputObject.department} must be at most 100 characters`),
+ graduationYear: z
+ .number()
+ .integer()
+ .positive()
+ .when("role", {
+ is: "student",
+ then: s =>
+ s
+ .required(`${inputObject.graduationYear} is Required`)
+ .min(2000, `${inputObject.graduationYear} > 2000`)
+ .max(2030, `${inputObject.graduationYear} < 2030`)
+ })
+});
+
+export default function CollegePage({}: {}) {
+ const navigate = useNavigate();
+ const location = useLocation();
+ let userData: any = location.state as Object;
+
+ const [isloading, setIsLoading] = useState(true);
+ const [colleges, setColleges] = useState([{ id: "", title: "" }]);
+ const [departments, setDepartments] = useState([{ id: "", title: "" }]);
+ const [roles, setRoles] = useState([{ id: "", title: "" }]);
+
+ const [selectedCollege, setSelectedCollege] = useState
@@ -40,8 +49,8 @@ const LcHome = (props: Props) => {
...props.temp,
isReport: false,
isHistory: false,
- isTeam: false,
- isSchedule: false
+ isTeam: false
+ // isSchedule: false
})
}
>
@@ -59,7 +68,321 @@ const LcHome = (props: Props) => {
Team
- {props.temp.isReport ? (
+
+
+ {/* {props.temp.isReport ? (
+
+
+ {props.temp.isReport ? (
+
+ {!props.temp.isSchedule &&
+ !props.temp.isTeam &&
+ !props.temp.isReport ? (
+ <>
+ {(reportPending ?? []).length > 0 ? (
+
+ {meetups.length > 0 ? (
+ meetups.map(meetup => (
+ {
+ props.setTemp(prev => ({
+ ...prev,
+ isCreateMeeting: true
+ }));
+ }}
+ >
+ Schedule Meet
+
+
+ )}
+
+
+ {/*
+
+ ))
+ ) : (
+ <>
+
+
+
+
+
+
+ {meetup.is_started
+ ? "Ongoing"
+ : "Upcoming"}
+
+
+
+ + {meetup.title} +
++ {meetup.agenda} +
+
+
+ + Venue Details +
+
+
+
+
+ {
+ meetup.meet_place
+ }
+
+
+
+ {
+ meetup.location
+ }
+
+
+ {
+ props.setTemp(
+ prev => ({
+ ...prev,
+ isReport:
+ true
+ })
+ );
+ setSelectedMeeting(
+ meetup.id
+ );
+ }}
+ >
+ Submit Report
+
+ {
+ navigate(
+ "/dashboard/learning-circle/meetup/" +
+ meetup.id
+ );
+ }}
+ >
+ More Info
+
+
+
+
+
+ Next meeting not scheduled.
+
+ Kindly schedule a meeting.
+
+
*/}
+
+ )}
+
+ {props.lc?.meet_place && (
+
+ {props.lc?.meet_time && (
+
+ )}
+ Venue: {props.lc?.meet_place}
+ )} + {props.lc?.meet_time && ( +Time: {nextMeet?.formattedTime}
+ )} +
+
+ ) : (
+ <>
+ )}
+ Pending Report Submissions
+
+ {reportPending.map((report, index) => (
+
+
+
+ ))}
+
+
+ {index + 1}.
++ {convertToFormatedDate( + report.meet_time + )} +
+
+
+ + {convertToFormatedDate( + report.meet_time + )}{" "} + {convert24to12( + extract24hTimeFromDateTime( + report.meet_time + ) + )} +
+ +
+ {props.lc?.previous_meetings &&
+ props.lc?.previous_meetings.length > 0 && (
+
+
+ ) : (
+ <>
+ )}
+ Your past meetings
+ )} +
+ {pastMeetups.map((report, index) => (
+
+ {
+ navigate(
+ "/dashboard/learning-circle/meetup/" +
+ report.id
+ );
+ }}
+ >
+
+ ))}
+
+
+ {index + 1}.
++ {convertToFormatedDate( + report.meet_time + )} +
+
+
+ + {convertToFormatedDate( + report.meet_time + )}{" "} + {convert24to12( + extract24hTimeFromDateTime( + report.meet_time + ) + )} +
+ +
- {props.temp.isSchedule ? (
- {
<>
{nextMeet &&
- props.lc?.meet_place &&
- props.lc?.meet_time ? (
+ props.lc?.meet_place &&
+ props.lc?.meet_time ? (
- {props.lc?.meet_time && ()}
+ {props.lc?.meet_time && (
+
+ )}
)}
@@ -151,52 +476,11 @@ const LcHome = (props: Props) => {
Next meeting on
@@ -103,7 +426,7 @@ const LcHome = (props: Props) => { onClick={() => { props.setTemp(prev => ({ ...prev, - isSchedule: true + isCreateMeeting: true })); }} > @@ -125,16 +448,18 @@ const LcHome = (props: Props) => { )}
Your past meetings
)}
- {props.lc?.previous_meetings.map(
- (report, index) => (
-
{
- props.setTemp({
- ...props.temp,
- isReport: false,
- isHistory: true
- });
- setSelectedMeeting(report.id);
- }}
- >
-
- )
- )}
+
-
- {index + 1}.
-- {convertToFormatedDate( - report.meet_time - )} -
-
-
- - {convert24to12( - extract24hTimeFromDateTime( - report.meet_time - ) - )} -
- -
+ Create a Meetup
+
+
+ Enter details to schedule a meet
+
+
+
+
+ );
+};
+
+export default LcMeetCreate;
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcMeetups.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcMeetups.tsx
new file mode 100644
index 000000000..d64786360
--- /dev/null
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcMeetups.tsx
@@ -0,0 +1,144 @@
+import styles from "../../LearningCircle.module.css";
+import imageBottom from "../../../assets/images/LC3.webp";
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
+import { useNavigate } from "react-router-dom";
+import { useEffect, useState } from "react";
+import { BsChevronRight } from "react-icons/bs";
+import { getMeetups } from "../../../services/LearningCircleAPIs";
+import toast from "react-hot-toast";
+import { convertToFormatedDate } from "../../../../../utils/common";
+import {
+ convert24to12,
+ extract24hTimeFromDateTime
+} from "../../../services/utils";
+import Select from "react-select";
+
+const LcMeetups = ({ user_id }: { user_id: string | null }) => {
+ const navigate = useNavigate();
+ const [meetups, setMeetups] = useState
+
+ );
+};
+
+export default LcMeetups;
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcReport.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcReport.tsx
index 7a80f72e5..a8637eb7c 100644
--- a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcReport.tsx
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/LcReport.tsx
@@ -1,9 +1,15 @@
import { Dispatch, SetStateAction, useEffect, useState } from "react";
import styles from "../LcDashboard.module.css";
import UploadImage from "../../../assets/images/uploadIcon.svg";
-import { LcAttendees } from "./LcAttendees";
-import { reportMeeting } from "../../../services/LearningCircleAPIs";
+import {
+ getMeetupAttendees,
+ reportMeeting
+} from "../../../services/LearningCircleAPIs";
import toast from "react-hot-toast";
+import StarRatings from "react-star-ratings";
+import { BiDownArrow } from "react-icons/bi";
+import { BsEye } from "react-icons/bs";
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
type Props = {
setTemp: Dispatch
+
+ -
+ {meetups && meetups.length > 0 ? (
+ <>
+ Meetups
+
-
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourLc.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourLc.tsx
new file mode 100644
index 000000000..e1cca1351
--- /dev/null
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourLc.tsx
@@ -0,0 +1,107 @@
+import styles from "../../LearningCircle.module.css";
+import imageBottom from "../../../assets/images/LC3.webp";
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
+import { useNavigate } from "react-router-dom";
+import { useEffect, useState } from "react";
+import { BsChevronRight } from "react-icons/bs";
+import { getUserLearningCircles } from "../../../services/LearningCircleAPIs";
+
+const YourLc = ({ userCircleList }: { userCircleList: LcType[] }) => {
+ const navigate = useNavigate();
+
+ return (
+
-
-
-
- setFormData(prevState => ({
- ...prevState,
- day: e.target.value
- }))
- }
- style={{
- backgroundColor: "#f0f0f0",
- color: "lightgrey"
- }}
- />
-
-
-
-
- setFormData(prevState => ({
- ...prevState,
- meet_time: e.target.value + ":00"
- }))
- }
- />
-
-
-
Agenda
+Brief description *
-
Attendees
-
- {props.lc?.members.map(member => (
+
Attendees List
+
+ {attendees.map(attendee => (
))}
- {/* */}
handleMemberClick(member.id)}
+ className={styles.attendee}
+ key={attendee.attendee_id}
+ onClick={() => {
+ setAttendeeDetailsExpanded(prevState => ({
+ ...prevState,
+ [attendee.attendee_id]:
+ !prevState?.[attendee.attendee_id]
+ }));
+ }}
>
-
+
+
+
+ {
+ changeRating(
+ attendee.attendee_id,
+ rating
+ );
+ }}
+ numberOfStars={5}
+ name="rating"
+ starDimension="15px"
+ starSpacing="1px"
+ />
+
+
+
Report
++ {attendee.report} +
+Tasks Completed
+ {attendee.proof_of_work.map( + (task, index) => ( +
+
+ )
)}
- />
+
+ {index + 1} |
+ {task.title}
+
+
+ {
+ if (task.is_image) {
+ window.open(
+ import.meta
+ .env
+ .VITE_BACKEND_URL +
+ (task.image_url ??
+ "404"),
+ "_blank"
+ );
+ } else {
+ window.open(
+ task.proof_url ??
+ "",
+ "_blank"
+ );
+ }
+ }}
+ >
+
+
+
+
+ );
+};
+
+export default YourLc;
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourMeetups.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourMeetups.tsx
new file mode 100644
index 000000000..621d56052
--- /dev/null
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LcDashboard/components/YourMeetups.tsx
@@ -0,0 +1,108 @@
+import styles from "../../LearningCircle.module.css";
+import imageBottom from "../../../assets/images/LC3.webp";
+import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
+import { useNavigate } from "react-router-dom";
+import { useEffect, useState } from "react";
+import { BsChevronRight } from "react-icons/bs";
+import { getMeetups } from "../../../services/LearningCircleAPIs";
+import toast from "react-hot-toast";
+import { convertToFormatedDate } from "../../../../../utils/common";
+import {
+ convert24to12,
+ extract24hTimeFromDateTime
+} from "../../../services/utils";
+
+const YourMeetups = ({ user_id }: { user_id: string | null }) => {
+ const navigate = useNavigate();
+ const [meetups, setMeetups] = useState
+
+ -
+ {userCircleList && userCircleList.length > 0 ? (
+ <>
+ Your learning circles
+ {userCircleList?.map((circle, pos) => (
+
- { + navigate( + `/dashboard/learning-circle/dashboard/${circle.id}` + ); + }} + > + + + +
+
+ ))}
+
+ ) : (
+
+ 
+ Nothing yet!
+
+ )}
+ You haven't joined any learning circles yet.
+
+
+ );
+};
+
+export default YourMeetups;
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircle.module.css b/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircle.module.css
index 8d1abd845..30888fa70 100644
--- a/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircle.module.css
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircle.module.css
@@ -29,6 +29,7 @@
}
.learningCircleLandingPageMiddle {
+ width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
@@ -164,6 +165,9 @@
.learningCircleLandingPageLevel div {
font-size: 0.8rem;
}
+ .learningCircleLandingPage .learningCircleLandingPageButton button {
+ font-size: 15px;
+ }
}
@media (width<=820px) {
@@ -1264,3 +1268,118 @@
transform: scaleX(-1);
}
}
+.SwitchNav {
+ display: flex;
+ gap: 5px;
+ align-items: center;
+ .items {
+ padding: 8px 20px;
+ background-color: #f3f3f4;
+ color: black;
+ font-weight: 600;
+ border-radius: 15px;
+ &.active {
+ background-color: white;
+ border-radius: 15px 15px 0px 0px;
+ }
+ }
+ .plusItem {
+ border-left: 2px solid #8b8e92;
+ color: black;
+ font-size: 25px;
+ padding: 0px;
+ height: fit-content;
+ padding-left: 10px;
+ line-height: 1;
+ }
+}
+
+.ContentWrapper {
+ width: 100%;
+ padding: 30px;
+ background-color: white;
+ display: flex;
+ flex-direction: column;
+ gap: 15px;
+ align-items: start;
+}
+.inputBox {
+ background: #fff;
+ margin: 0px 10px;
+ input {
+ width: 100%;
+ background-color: rgba(238, 242, 255, 1);
+ border: none;
+ border-radius: 10px;
+ padding: 10px;
+ }
+}
+.modalinfo {
+ margin: 10px;
+ color: #22222290;
+ font-size: 15px;
+}
+.meetupGrid {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: 20px;
+ .meetupCard {
+ background: #fdfdfd;
+ color: #222;
+ padding: 20px;
+ box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.05);
+ border-radius: 10px;
+ .meetupTitle {
+ font-size: 20px;
+ font-weight: 600;
+ color: #5570f2;
+ margin: 10px;
+ }
+ .meetupAgenda {
+ font-size: 15px;
+ margin: 10px;
+ text-align: justify;
+ }
+ .buttons {
+ display: flex;
+ margin: 10px;
+ gap: 10px;
+ width: 100%;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: 20px;
+ a {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ padding: 10px 20px;
+ border: 1px dashed var(--blue);
+ border-radius: 10px;
+ }
+ }
+ .tags {
+ display: flex;
+ gap: 10px;
+ padding: 10px 0;
+ .tag {
+ display: flex;
+ align-items: center;
+ padding: 5px;
+ border: 1px dashed #5570f2;
+ border-radius: 10px;
+ color: #222;
+ font-size: 10px;
+ }
+ }
+ }
+ @media screen and (max-width: 768px) {
+ grid-template-columns: 1fr;
+ .meetupCard {
+ .tags {
+ .tag {
+ font-size: 10px;
+ }
+ }
+ }
+ }
+}
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircleLandingPage.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircleLandingPage.tsx
index 59fd3de51..863c2e9f3 100644
--- a/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircleLandingPage.tsx
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/LearningCircleLandingPage.tsx
@@ -1,24 +1,31 @@
import styles from "./LearningCircle.module.css";
import imageTop from "../assets/images/LC2.webp";
-import imageBottom from "../assets/images/LC3.webp";
import { PowerfulButton } from "@/MuLearnComponents/MuButtons/MuButton";
import { useNavigate } from "react-router-dom";
import { useEffect, useState } from "react";
-import { BsChevronRight } from "react-icons/bs";
-import { getUserLearningCircles } from "../services/LearningCircleAPIs";
+import {
+ getUserLearningCircles,
+ joinMeetup
+} from "../services/LearningCircleAPIs";
import MuLoader from "@/MuLearnComponents/MuLoader/MuLoader";
+import YourLc from "./LcDashboard/components/YourLc";
+import LcMeetups from "./LcDashboard/components/LcMeetups";
+import MuModal from "@/MuLearnComponents/MuModal/MuModal";
+import toast from "react-hot-toast";
+import YourMeetups from "./LcDashboard/components/YourMeetups";
const LearningCircleLandingPage = () => {
const navigate = useNavigate();
const [userCircleList, setUserCircleList] = useState
+
+ -
+ {meetups && meetups.length > 0 ? (
+ <>
+ Meetups
+
+ {meetups.map((meetup, pos) => (
+
+
+ ) : (
+
+
+ ))}
+ + {meetup.title} +
+
+
+ + {convertToFormatedDate( + meetup.meet_time + ) + + " " + + convert24to12( + extract24hTimeFromDateTime( + meetup.meet_time + ) + )} +
++ {meetup.is_online + ? "Online" + : "Offline"} +
++ {meetup.meet_place} +
++ {meetup.agenda.slice(0, 150) + + "..."} +
+
+ {
+ navigate(
+ `/dashboard/learning-circle/meetup/${meetup.id}`
+ );
+ }}
+ >
+ More info
+
+
+
+ No Meetups!
+
+ )}
+ No meetups are currently running now
+
+ {
+ setMeetupCode(e.target.value.toUpperCase());
+ }}
+ />
+
+ + Enter the 6 digit code provided by the meetup organizer to + join the meetup and earn karma points. +
+
-
)}
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/Meetup/LcMeetup.module.css b/src/modules/Dashboard/modules/LearningCircle/pages/Meetup/LcMeetup.module.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/modules/Dashboard/modules/LearningCircle/pages/Meetup/LcMeetup.tsx b/src/modules/Dashboard/modules/LearningCircle/pages/Meetup/LcMeetup.tsx
new file mode 100644
index 000000000..4e43e1806
--- /dev/null
+++ b/src/modules/Dashboard/modules/LearningCircle/pages/Meetup/LcMeetup.tsx
@@ -0,0 +1,25 @@
+import { useParams } from "react-router-dom";
+import LcHistory from "../LcDashboard/components/LcHistory";
+import { useEffect, useState } from "react";
+import { getMeetupInfo } from "../../services/LearningCircleAPIs";
+import toast from "react-hot-toast";
+import MuLoader from "@/MuLearnComponents/MuLoader/MuLoader";
+
+export default function LcMeetupIfo() {
+ const params = useParams();
+ const [data, setData] = useState-
- {userCircleList && userCircleList.length > 0 ? (
- <>
- Your learning circles
- {userCircleList?.map((circle, pos) => (
-
- { - navigate( - `/dashboard/learning-circle/dashboard/${circle.id}` - ); - }} - > - - - -
-
- ))}
-
- ) : (
-
-
- Nothing yet!
-
- )}
- - You haven't joined any learning circles - yet. -
-
+
+
+
+
+
+ {curpage === 0 ? (
+