Activity
- {workspaceSlug && (
+ {workspace_slug && (
{comments.map((comment: any) => (
-
+
))}
)}
diff --git a/apps/space/components/issues/peek-overview/issue-details.tsx b/apps/space/components/issues/peek-overview/issue-details.tsx
index bbe982a69c..ff725182d0 100644
--- a/apps/space/components/issues/peek-overview/issue-details.tsx
+++ b/apps/space/components/issues/peek-overview/issue-details.tsx
@@ -1,4 +1,3 @@
-// components
import { IssueReactions } from "components/issues/peek-overview";
// types
import { IIssue } from "types";
diff --git a/apps/space/components/issues/peek-overview/issue-emoji-reactions.tsx b/apps/space/components/issues/peek-overview/issue-emoji-reactions.tsx
index 2f51b59550..04bd9f63b5 100644
--- a/apps/space/components/issues/peek-overview/issue-emoji-reactions.tsx
+++ b/apps/space/components/issues/peek-overview/issue-emoji-reactions.tsx
@@ -9,22 +9,21 @@ import { groupReactions, renderEmoji } from "helpers/emoji.helper";
import { ReactionSelector } from "components/ui";
export const IssueEmojiReactions: React.FC = observer(() => {
+ // router
const router = useRouter();
-
const { workspace_slug, project_slug } = router.query as { workspace_slug: string; project_slug: string };
-
- const { user: userStore, issue: issueStore } = useMobxStore();
+ // store
+ const { user: userStore, issue: issueStore, issueDetails: issueDetailsStore } = useMobxStore();
const user = userStore?.currentUser;
- const issueId = issueStore.activePeekOverviewIssueId;
-
- const reactions = issueId ? issueStore.issue_detail[issueId]?.reactions || [] : [];
+ const issueId = issueDetailsStore.peekId;
+ const reactions = issueId ? issueDetailsStore.details[issueId]?.reactions || [] : [];
const groupedReactions = groupReactions(reactions, "reaction");
const handleReactionClick = (reactionHexa: string) => {
if (!workspace_slug || !project_slug || !issueId) return;
- const userReaction = reactions?.find((r) => r.created_by === user?.id && r.reaction === reactionHexa);
+ const userReaction = reactions?.find((r: any) => r.created_by === user?.id && r.reaction === reactionHexa);
if (userReaction)
issueStore.deleteIssueReactionAsync(workspace_slug, userReaction.project, userReaction.issue, reactionHexa);
@@ -34,12 +33,6 @@ export const IssueEmojiReactions: React.FC = observer(() => {
});
};
- useEffect(() => {
- if (user) return;
-
- userStore.getUserAsync();
- }, [user, userStore]);
-
return (
<>
{
}}
key={reaction}
className={`flex items-center gap-1 text-custom-text-100 text-sm h-full px-2 py-1 rounded-md border ${
- reactions?.some((r) => r.actor === user?.id && r.reaction === reaction)
+ reactions?.some((r: any) => r.actor === user?.id && r.reaction === reaction)
? "bg-custom-primary-100/10 border-custom-primary-100"
: "bg-custom-background-80 border-transparent"
}`}
@@ -71,7 +64,7 @@ export const IssueEmojiReactions: React.FC = observer(() => {
{renderEmoji(reaction)}
r.actor === user?.id && r.reaction === reaction)
+ reactions?.some((r: any) => r.actor === user?.id && r.reaction === reaction)
? "text-custom-primary-100"
: ""
}
diff --git a/apps/space/components/issues/peek-overview/issue-reaction.tsx b/apps/space/components/issues/peek-overview/issue-reaction.tsx
index 9dc1fac403..fc1b15e513 100644
--- a/apps/space/components/issues/peek-overview/issue-reaction.tsx
+++ b/apps/space/components/issues/peek-overview/issue-reaction.tsx
@@ -1,18 +1,25 @@
-"use client";
-
-// ui
import { IssueEmojiReactions, IssueVotes } from "components/issues/peek-overview";
+import { useMobxStore } from "lib/mobx/store-provider";
-export const IssueReactions: React.FC = () => (
-
-
-
+export const IssueReactions: React.FC = () => {
+ const { project: projectStore } = useMobxStore();
+ return (
+
+ {projectStore?.deploySettings?.votes && (
+ <>
+
+
+
+
+
+
+ )}
+
+ {projectStore?.deploySettings?.reactions && (
+
+
+
+ )}
-
-
-
-
-
-
-
-);
+ );
+};
diff --git a/apps/space/components/issues/peek-overview/layout.tsx b/apps/space/components/issues/peek-overview/layout.tsx
index ee763d1480..c50bd70663 100644
--- a/apps/space/components/issues/peek-overview/layout.tsx
+++ b/apps/space/components/issues/peek-overview/layout.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useMemo } from "react";
import { useRouter } from "next/router";
import { Dialog, Transition } from "@headlessui/react";
import { observer } from "mobx-react-lite";
@@ -18,20 +18,19 @@ export const IssuePeekOverview: React.FC
= observer((props) => {
const { isOpen, onClose } = props;
// router
const router = useRouter();
- const { workspace_slug, project_slug } = router.query;
+ const { workspace_slug, project_slug, peekId } = router.query;
// store
- const { issueDetails: issueDetailStore } = useMobxStore();
+ const { issueDetails: issueDetailStore, issue: issueStore } = useMobxStore();
- const issueDetails = issueDetailStore.peekId ? issueDetailStore.details[issueDetailStore.peekId] : null;
- console.log("issueDetails", issueDetails);
+ const issueDetails = issueDetailStore.peekId && peekId ? issueDetailStore.details[peekId.toString()] : null;
useEffect(() => {
- if (workspace_slug && project_slug && issueDetailStore.peekId) {
+ if (workspace_slug && project_slug && peekId && issueStore.issues && issueStore.issues.length > 0) {
if (!issueDetails) {
- issueDetailStore.fetchIssueDetails(workspace_slug.toString(), project_slug.toString(), issueDetailStore.peekId);
+ issueDetailStore.fetchIssueDetails(workspace_slug.toString(), project_slug.toString(), peekId.toString());
}
}
- }, [workspace_slug, project_slug, issueDetailStore, issueDetails]);
+ }, [workspace_slug, project_slug, issueDetailStore, issueDetails, peekId, issueStore.issues]);
const handleClose = () => {
onClose();
diff --git a/apps/space/components/issues/peek-overview/side-peek-view.tsx b/apps/space/components/issues/peek-overview/side-peek-view.tsx
index 094565c933..967c2ae692 100644
--- a/apps/space/components/issues/peek-overview/side-peek-view.tsx
+++ b/apps/space/components/issues/peek-overview/side-peek-view.tsx
@@ -11,6 +11,7 @@ import {
} from "components/issues/peek-overview";
// types
import { IIssue } from "types/issue";
+import { RootStore } from "store/root";
type Props = {
handleClose: () => void;
@@ -20,6 +21,8 @@ type Props = {
export const SidePeekView: React.FC = observer((props) => {
const { handleClose, issueDetails } = props;
+ const { project: projectStore } = useMobxStore();
+
return (
@@ -38,9 +41,11 @@ export const SidePeekView: React.FC
= observer((props) => {
{/* divider */}
{/* issue activity/comments */}
-
+ {projectStore?.deploySettings?.comments && (
+
+ )}
)}
diff --git a/apps/space/components/tiptap/index.tsx b/apps/space/components/tiptap/index.tsx
index 418449c089..f0315cad4a 100644
--- a/apps/space/components/tiptap/index.tsx
+++ b/apps/space/components/tiptap/index.tsx
@@ -3,10 +3,10 @@ import { useDebouncedCallback } from "use-debounce";
import { EditorBubbleMenu } from "./bubble-menu";
import { TiptapExtensions } from "./extensions";
import { TiptapEditorProps } from "./props";
-import { useImperativeHandle, useRef } from "react";
+import { useImperativeHandle, useRef, forwardRef } from "react";
import { ImageResizer } from "./extensions/image-resize";
-export interface ITiptapRichTextEditor {
+export interface ITipTapRichTextEditor {
value: string;
noBorder?: boolean;
borderOnFocus?: boolean;
@@ -21,7 +21,7 @@ export interface ITiptapRichTextEditor {
debouncedUpdatesEnabled?: boolean;
}
-const Tiptap = (props: ITiptapRichTextEditor) => {
+const Tiptap = (props: ITipTapRichTextEditor) => {
const {
onChange,
debouncedUpdatesEnabled,
@@ -73,9 +73,10 @@ const Tiptap = (props: ITiptapRichTextEditor) => {
}, 500);
}, 1000);
- const editorClassNames = `relative w-full max-w-screen-lg sm:rounded-lg mt-2 p-3 relative focus:outline-none rounded-md
- ${noBorder ? "" : "border border-custom-border-200"} ${borderOnFocus ? "focus:border border-custom-border-300" : "focus:border-0"
- } ${customClassName}`;
+ const editorClassNames = `relative w-full max-w-full sm:rounded-lg mt-2 p-3 relative focus:outline-none rounded-md
+ ${noBorder ? "" : "border border-custom-border-200"} ${
+ borderOnFocus ? "focus:border border-custom-border-300" : "focus:border-0"
+ } ${customClassName}`;
if (!editor) return null;
editorRef.current = editor;
@@ -97,4 +98,10 @@ const Tiptap = (props: ITiptapRichTextEditor) => {
);
};
-export default Tiptap;
+const TipTapEditor = forwardRef((props, ref) => (
+
+));
+
+TipTapEditor.displayName = "TipTapEditor";
+
+export { TipTapEditor };
diff --git a/apps/space/components/views/project-details.tsx b/apps/space/components/views/project-details.tsx
index 1ef870dc4a..8f46af79c1 100644
--- a/apps/space/components/views/project-details.tsx
+++ b/apps/space/components/views/project-details.tsx
@@ -14,12 +14,23 @@ import { useMobxStore } from "lib/mobx/store-provider";
export const ProjectDetailsView = observer(() => {
const router = useRouter();
- const { workspace_slug, project_slug, states, labels, priorities } = router.query;
+ const { workspace_slug, project_slug, states, labels, priorities, board, peekId } = router.query;
- const { issue: issueStore, project: projectStore, issueDetails: issueDetailStore }: RootStore = useMobxStore();
+ const {
+ issue: issueStore,
+ project: projectStore,
+ issueDetails: issueDetailStore,
+ user: userStore,
+ }: RootStore = useMobxStore();
const activeIssueId = issueDetailStore.peekId;
+ useEffect(() => {
+ if (!userStore.currentUser) {
+ userStore.fetchCurrentUser();
+ }
+ }, [userStore]);
+
useEffect(() => {
if (workspace_slug && project_slug) {
const params = {
@@ -31,11 +42,29 @@ export const ProjectDetailsView = observer(() => {
}
}, [workspace_slug, project_slug, issueStore, states, labels, priorities]);
+ useEffect(() => {
+ if (peekId && workspace_slug && project_slug) {
+ issueDetailStore.setPeekId(peekId.toString());
+ }
+ }, [peekId, issueDetailStore, project_slug, workspace_slug]);
+
+ const handlePeekClose = () => {
+ issueDetailStore.setPeekId(null);
+ router.replace(
+ {
+ pathname: `/${workspace_slug?.toString()}/${project_slug}`,
+ query: {
+ ...(board && { board: board.toString() }),
+ },
+ },
+ undefined,
+ { shallow: true }
+ );
+ };
+
return (
- {workspace_slug && (
-
issueDetailStore.setPeekId(null)} />
- )}
+ {workspace_slug && }
{issueStore?.loader && !issueStore.issues ? (
Loading...
diff --git a/apps/space/pages/index.tsx b/apps/space/pages/index.tsx
index ae93b1ba30..3a8838b1de 100644
--- a/apps/space/pages/index.tsx
+++ b/apps/space/pages/index.tsx
@@ -1,7 +1,157 @@
-import React from "react";
+import React, { useEffect } from "react";
+import Image from "next/image";
+import { useRouter } from "next/router";
+// assets
+import BluePlaneLogoWithoutText from "public/plane-logos/blue-without-text.png";
+// mobx
+import { observer } from "mobx-react-lite";
+import { useMobxStore } from "lib/mobx/store-provider";
+// services
+import authenticationService from "services/authentication.service";
+// hooks
+import useToast from "hooks/use-toast";
+// components
+import { EmailPasswordForm, GithubLoginButton, GoogleLoginButton, EmailCodeForm } from "components/accounts";
-const HomePage = () => (
- Plane Deploy
-);
+const HomePage = () => {
+ const { user: userStore } = useMobxStore();
+
+ const router = useRouter();
+ const { next_path = "/" } = router.query;
+
+ const { setToastAlert } = useToast();
+
+ const onSignInError = (error: any) => {
+ setToastAlert({
+ title: "Error signing in!",
+ type: "error",
+ message: error?.error || "Something went wrong. Please try again later or contact the support team.",
+ });
+ };
+
+ const onSignInSuccess = (response: any) => {
+ const isOnboarded = response?.user?.onboarding_step?.profile_complete || false;
+
+ userStore.setCurrentUser(response?.user);
+
+ if (!isOnboarded) {
+ router.push(`/onboarding?next_path=${next_path}`);
+ return;
+ }
+ console.log("hello");
+ router.push(next_path.toString());
+ };
+
+ const handleGoogleSignIn = async ({ clientId, credential }: any) => {
+ try {
+ if (clientId && credential) {
+ const socialAuthPayload = {
+ medium: "google",
+ credential,
+ clientId,
+ };
+ const response = await authenticationService.socialAuth(socialAuthPayload);
+
+ onSignInSuccess(response);
+ } else {
+ throw Error("Cant find credentials");
+ }
+ } catch (err: any) {
+ onSignInError(err);
+ }
+ };
+
+ const handleGitHubSignIn = async (credential: string) => {
+ try {
+ if (process.env.NEXT_PUBLIC_GITHUB_ID && credential) {
+ const socialAuthPayload = {
+ medium: "github",
+ credential,
+ clientId: process.env.NEXT_PUBLIC_GITHUB_ID,
+ };
+ const response = await authenticationService.socialAuth(socialAuthPayload);
+ onSignInSuccess(response);
+ } else {
+ throw Error("Cant find credentials");
+ }
+ } catch (err: any) {
+ onSignInError(err);
+ }
+ };
+
+ const handlePasswordSignIn = async (formData: any) => {
+ await authenticationService
+ .emailLogin(formData)
+ .then((response) => {
+ try {
+ if (response) {
+ onSignInSuccess(response);
+ }
+ } catch (err: any) {
+ onSignInError(err);
+ }
+ })
+ .catch((err) => onSignInError(err));
+ };
+
+ const handleEmailCodeSignIn = async (response: any) => {
+ try {
+ if (response) {
+ onSignInSuccess(response);
+ }
+ } catch (err: any) {
+ onSignInError(err);
+ }
+ };
+
+ return (
+
+
+
+
+
+ {parseInt(process.env.NEXT_PUBLIC_ENABLE_OAUTH || "0") ? (
+ <>
+
+ Sign in to Plane
+
+
+
+ ) : (
+
+ )}
+
+ {parseInt(process.env.NEXT_PUBLIC_ENABLE_OAUTH || "0") ? (
+
+ By signing up, you agree to the{" "}
+
+ Terms & Conditions
+
+
+ ) : null}
+
+
+