+
+
+
+
Starts:
+
+ {formatDateShortMonth(startTime)}
+
+
+ {formatDateShortHour(startTime)}
-
+
+
Ends:
+
+ {formatDateShortMonth(endTime)}
+
+
+ {formatDateShortHour(endTime)}
+
+
+
+
+
+
+
{currentTask.tasks.map((task, key) => (
{
unAuthAtlasSpace={unAuthAtlasSpace}
isUserInHub={isUserInHub}
disabled={taskDisabled}
+ authAtlasSpace={authAtlasSpace}
+ isAdmin={didUserCanAdministrate}
/>
))}
-
-
-
+
+
+
{isAccepted && (
)}
-
{isAccepted && !userAlreadyRewarded && (
@@ -385,8 +484,52 @@ const Task = () => {
+
+
+ {type === "ongoing" && (
+
+
+
+ Time Remaining
+
+
+
+
+ )}
+ {type === "starting" && (
+
+ )}
+
+
+
+ Rewards
+
+
+ {/*
+ 1500 Points
+
*/}
+
+ {rewardAmount} USDC
+
+
+
+
+
-
);
};
diff --git a/src/atlas_frontend/src/components/Task/tasks/GenericTask.tsx b/src/atlas_frontend/src/components/Task/tasks/GenericTask.tsx
index b150eda..012bb0c 100644
--- a/src/atlas_frontend/src/components/Task/tasks/GenericTask.tsx
+++ b/src/atlas_frontend/src/components/Task/tasks/GenericTask.tsx
@@ -1,26 +1,34 @@
import React from "react";
-import { useState } from "react";
+import { useMemo, useState } from "react";
import type {
_SERVICE,
TaskType,
} from "../../../../../declarations/atlas_space/atlas_space.did";
import Button from "../../Shared/Button";
-import { useForm, type SubmitHandler } from "react-hook-form";
+import { useFieldArray, useForm, type SubmitHandler } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import * as yup from "yup";
import {
- getRejectionInfo,
getSpaceTasks,
submitSubtaskSubmission,
} from "../../../canisters/atlasSpace/api";
import toast from "react-hot-toast";
import type { Principal } from "@dfinity/principal";
-import { useAuthAtlasSpaceActor } from "../../../hooks/identityKit";
import { useAuth } from "@nfid/identitykit/react";
-import { useDispatch } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
import type { ActorSubclass } from "@dfinity/agent";
import { getErrorWithInfoToast } from "../../../utils/errors";
import { runWithLoading } from "../../../utils/loading";
+import { deserialize } from "../../../store/store";
+import {
+ BlockchainUser,
+ selectUserBlockchainData,
+ type StorableUser,
+} from "../../../store/slices/userSlice";
+import ReviewSubmission from "../../Submissions/ReviewSubmission";
+import { FaCaretRight } from "react-icons/fa6";
+import { shortPrincipal } from "../../../utils/icp";
+import { FiCopy } from "react-icons/fi";
interface GenericTaskProps {
genericTask: TaskType["GenericTask"];
@@ -30,23 +38,17 @@ interface GenericTaskProps {
unAuthAtlasSpace: ActorSubclass<_SERVICE> | null;
isUserInHub: boolean;
disabled?: boolean;
+ authAtlasSpace: ActorSubclass<_SERVICE> | null;
+ isAdmin?: boolean;
}
-interface GenericTaskFormInput {
+interface TextFormData {
taskSubmission: string;
}
-const maxDescriptionLength = 500;
-
-const schema = yup.object({
- taskSubmission: yup
- .string()
- .max(maxDescriptionLength)
- .trim()
- .min(2)
- .required()
- .label("Task submission"),
-});
+interface ListFormData {
+ items: { value: string }[];
+}
const GenericTask = ({
genericTask,
@@ -56,24 +58,66 @@ const GenericTask = ({
unAuthAtlasSpace,
isUserInHub,
disabled = false,
+ authAtlasSpace,
+ isAdmin = false,
}: GenericTaskProps) => {
const dispatch = useDispatch();
- const { user } = useAuth();
+ const { user, connect } = useAuth();
const [openSubmission, setSubmission] = useState(false);
- const { register, handleSubmit} = useForm({
- resolver: yupResolver(schema),
+ const answerFormatKey = "TitleAndDescription" in genericTask.task_content
+ ? (Object.keys(genericTask.task_content.TitleAndDescription.answer_format)[0] as
+ | "Small"
+ | "Paragraph"
+ | "Long"
+ | "List")
+ : null;
+
+ const maxTextLength = useMemo(() => {
+ switch (answerFormatKey) {
+ case "Small":
+ return 254;
+ case "Paragraph":
+ return 600;
+ case "Long":
+ return 2500;
+ default:
+ return 254;
+ }
+ }, [answerFormatKey]);
+
+ const textSchema = yup.object({
+ taskSubmission: yup
+ .string()
+ .trim()
+ .min(2)
+ .max(maxTextLength)
+ .required("Field is required"),
+ });
+
+ const textForm = useForm
({
+ resolver: yupResolver(textSchema),
defaultValues: {
- taskSubmission: "",
+ taskSubmission: ""
},
});
- const { connect } = useAuth();
- const authAtlasSpace = useAuthAtlasSpaceActor(spacePrincipal);
+ const [openReview, SetReview] = useState(false);
+
+ const userBlockchainData = deserialize(
+ useSelector(selectUserBlockchainData)
+ );
+ const userInfo = userBlockchainData
+ ? new BlockchainUser(userBlockchainData)
+ : null;
+ const isUserAdmin = isAdmin || (userInfo?.canAdministrate(spacePrincipal) ?? false);
+
+ const copyPrincipal = (user: string) => {
+ navigator.clipboard.writeText(user);
+ toast.success("Copied full principal");
+ };
- const handleSubmitResponse: SubmitHandler = async ({
- taskSubmission,
- }) => {
+ const onSubmitText: SubmitHandler = async ({ taskSubmission }) => {
if (!authAtlasSpace || !unAuthAtlasSpace) return;
-
+
await runWithLoading(async () => {
const call = submitSubtaskSubmission({
authAtlasSpace,
@@ -88,7 +132,61 @@ const GenericTask = ({
});
setSubmission(false);
- getSpaceTasks({
+ await getSpaceTasks({
+ spaceId: spacePrincipal.toString(),
+ unAuthAtlasSpace,
+ dispatch,
+ });
+ }, dispatch, () => setSubmission(false));
+ };
+
+ const listSchema = yup.object({
+ items: yup
+ .array()
+ .of(
+ yup.object({
+ value: yup
+ .string()
+ .trim()
+ .max(254, "Item too long")
+ .required("Item cannot be empty"),
+ })
+ )
+ .max(25, "Max 25 items allowed")
+ .required(),
+});
+
+const listForm = useForm({
+ resolver: yupResolver(listSchema),
+ defaultValues: {
+ items: [{ value: "" }]
+ },
+});
+
+ const { fields, append, remove } = useFieldArray({
+ control: listForm.control,
+ name: "items",
+ });
+
+ const onSubmitList = async () => {
+ if (!authAtlasSpace || !unAuthAtlasSpace) return;
+
+ const items = listForm.getValues().items.map(item => item.value.trim());
+ await runWithLoading(async () => {
+ const call = submitSubtaskSubmission({
+ authAtlasSpace,
+ taskId: BigInt(taskId),
+ subtaskId: BigInt(subtaskId),
+ submission: { List: { items } },
+ });
+ await toast.promise(call, {
+ loading: "Submitting list...",
+ success: "Submitted response.",
+ error: getErrorWithInfoToast("Failed to submit response."),
+ });
+
+ setSubmission(false);
+ await getSpaceTasks({
spaceId: spacePrincipal.toString(),
unAuthAtlasSpace,
dispatch,
@@ -101,6 +199,7 @@ const GenericTask = ({
([principal]) => principal.toString() === user.principal.toString()
) ?? [])
: [];
+ const allSubmissions = genericTask.submission;
const currentSubmissionState = submissionData?.state
? Object.keys(submissionData?.state)[0]
@@ -112,73 +211,151 @@ const GenericTask = ({
);
const rawState = Object.keys(submissionData?.state || {})[0] ?? null;
-
const validStates = ["Rejected", "WaitingForReview", "Accepted"] as const;
type SubmissionState = typeof validStates[number];
+ const STATUS_LABELS: Record = {
+ WaitingForReview: "Waiting for review",
+ Accepted: "Accepted",
+ Rejected: "Rejected",
+ };
+
+ const prettyStatus = STATUS_LABELS[rawState] ?? rawState;
+
const submissionState = validStates.includes(rawState as SubmissionState)
? (rawState as SubmissionState)
: null;
+
+ const badgeCls = (s?: string) =>
+ ({
+ Accepted: "bg-green-500/20 text-green-300 border border-green-500/30",
+ Rejected: "bg-red-500/20 text-red-300 border border-red-500/30",
+ WaitingForReview: "bg-primary/20 border border-white/10",
+ } as Record)[s ?? ""];
+
+ const userState = Object.keys(submissionData?.state ?? {})[0];
- const { reasonText, showRejectionReason } = getRejectionInfo(
- submissionData ?? null,
- submissionState
- )
+ const resize = (el: HTMLTextAreaElement) => {
+ el.style.height = "auto";
+ el.style.height = `${el.scrollHeight}px`;
+ };
return (
-
-
-
+
+
+
{submissionState === "WaitingForReview" && (
-
+
)}
{submissionState === "Accepted" && (
-
+
)}
-
-
+
-
- {"TitleAndDescription" in genericTask.task_content
- ? genericTask.task_content.TitleAndDescription.task_title
- : "N/A"}
-
-
+
+
+ {"TitleAndDescription" in genericTask.task_content
+ ? genericTask.task_content.TitleAndDescription.task_title
+ : "N/A"}
+
+ {user && !isUserAdmin && submissionData && (
+
+ {prettyStatus}
+
+ )}
+
+
+ {user && !isUserAdmin && submissionData && (
+
+
+ {prettyStatus}
+
+
+ )}
+
+ {"TitleAndDescription" in genericTask.task_content
+ ? genericTask.task_content.TitleAndDescription.task_title
+ : "N/A"}
+
+
+
{"TitleAndDescription" in genericTask.task_content
? genericTask.task_content.TitleAndDescription.task_description
: "N/A"}
- {showRejectionReason && (
-
-
Rejected reason:
-
- {reasonText}
-
-
- )}
{canSubmit && openSubmission && !disabled && (
-
- )}
+ <>
+ {answerFormatKey !== "List" ? (
+
-