From 667c45ebac4ca162affc2b27a6ec3dc28061e6ec Mon Sep 17 00:00:00 2001 From: guru_sainath Date: Tue, 7 May 2024 17:24:45 +0530 Subject: [PATCH] chore: updated space folder structure and updated the store hooks --- admin/next.config.js | 2 +- .../accounts/auth-forms/password.tsx | 7 +- space/components/accounts/auth-forms/root.tsx | 6 +- .../accounts/oauth/oauth-options.tsx | 6 +- .../accounts/user-image-upload-modal.tsx | 6 +- space/components/accounts/user-logged-in.tsx | 9 +- space/components/instance/not-ready-view.tsx | 9 +- .../issues/board-views/kanban/block.tsx | 2 +- .../issues/board-views/kanban/header.tsx | 2 +- .../issues/board-views/kanban/index.tsx | 2 +- .../issues/board-views/list/block.tsx | 2 +- .../issues/board-views/list/header.tsx | 2 +- .../issues/board-views/list/index.tsx | 2 +- .../issues/filters/applied-filters/root.tsx | 2 +- space/components/issues/filters/root.tsx | 2 +- space/components/issues/navbar/index.tsx | 12 +- .../issues/navbar/issue-board-view.tsx | 2 +- .../peek-overview/comment/add-comment.tsx | 9 +- .../comment/comment-detail-card.tsx | 9 +- .../comment/comment-reactions.tsx | 28 ++- .../issues/peek-overview/header.tsx | 2 +- .../issues/peek-overview/issue-activity.tsx | 16 +- .../peek-overview/issue-emoji-reactions.tsx | 21 +-- .../peek-overview/issue-vote-reactions.tsx | 20 +-- space/components/views/auth.tsx | 18 +- space/components/views/project-details.tsx | 17 +- space/hooks/store/index.ts | 2 + space/hooks/store/use-instance.ts | 10 ++ space/hooks/store/user/index.ts | 2 + space/hooks/store/user/use-user-profile.ts | 10 ++ space/hooks/store/user/use-user.ts | 10 ++ space/hooks/use-auth-redirection.tsx | 94 ---------- space/hooks/use-editor-suggestions.tsx | 2 +- space/layouts/instance-layout.tsx | 28 +-- space/lib/mobx/store-provider.tsx | 2 +- space/lib/store-context.tsx | 19 ++ space/next.config.js | 5 +- space/pages/onboarding/index.tsx | 10 +- space/services/api.service.ts | 116 ++++--------- space/services/authentication.service.ts | 14 +- space/services/file.service.ts | 3 - space/services/instance.service.ts | 30 +--- space/store/instance.store.ts | 40 +---- space/store/issue.ts | 2 +- space/store/issue_details.ts | 15 +- space/store/issues/base-issue-filter.store.ts | 2 +- space/store/issues/issue-filters.store.ts | 2 +- space/store/mentions.store.ts | 6 +- space/store/project.ts | 24 ++- space/store/{root.ts => root.store.ts} | 37 ++-- space/store/user.ts | 119 ------------- space/store/user/index.store.ts | 164 ++++++++++++++++++ .../{profile.ts => user/profile.store.ts} | 81 +++++---- space/types/{app.ts => app.d.ts} | 0 space/types/{auth.ts => auth.d.ts} | 0 space/types/{issue.ts => issue.d.ts} | 0 space/types/{project.ts => project.d.ts} | 0 space/types/{theme.ts => theme.d.ts} | 0 space/types/{user.ts => user.d.ts} | 0 59 files changed, 458 insertions(+), 606 deletions(-) create mode 100644 space/hooks/store/index.ts create mode 100644 space/hooks/store/use-instance.ts create mode 100644 space/hooks/store/user/index.ts create mode 100644 space/hooks/store/user/use-user-profile.ts create mode 100644 space/hooks/store/user/use-user.ts delete mode 100644 space/hooks/use-auth-redirection.tsx create mode 100644 space/lib/store-context.tsx rename space/store/{root.ts => root.store.ts} (52%) delete mode 100644 space/store/user.ts create mode 100644 space/store/user/index.store.ts rename space/store/{profile.ts => user/profile.store.ts} (57%) rename space/types/{app.ts => app.d.ts} (100%) rename space/types/{auth.ts => auth.d.ts} (100%) rename space/types/{issue.ts => issue.d.ts} (100%) rename space/types/{project.ts => project.d.ts} (100%) rename space/types/{theme.ts => theme.d.ts} (100%) rename space/types/{user.ts => user.d.ts} (100%) diff --git a/admin/next.config.js b/admin/next.config.js index 85b87e91f..26ff4b870 100644 --- a/admin/next.config.js +++ b/admin/next.config.js @@ -7,7 +7,7 @@ const nextConfig = { images: { unoptimized: true, }, - basePath: process.env.NEXT_PUBLIC_DEPLOY_WITH_NGINX === "1" ? "/god-mode" : "", + basePath: "/god-mode", }; module.exports = nextConfig; diff --git a/space/components/accounts/auth-forms/password.tsx b/space/components/accounts/auth-forms/password.tsx index 0d2872f65..35d8703b6 100644 --- a/space/components/accounts/auth-forms/password.tsx +++ b/space/components/accounts/auth-forms/password.tsx @@ -10,7 +10,8 @@ import { EAuthModes, EAuthSteps, ForgotPasswordPopover, PasswordStrengthMeter } import { API_BASE_URL } from "@/helpers/common.helper"; // services import { getPasswordStrength } from "@/helpers/password.helper"; -import { useMobxStore } from "@/lib/mobx/store-provider"; +// hooks +import { useInstance } from "@/hooks/store"; import { AuthService } from "@/services/authentication.service"; type Props = { @@ -42,9 +43,7 @@ export const PasswordForm: React.FC = (props) => { const [isPasswordInputFocused, setIsPasswordInputFocused] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false); // hooks - const { - instanceStore: { instance }, - } = useMobxStore(); + const { instance } = useInstance(); // router const router = useRouter(); const { next_path } = router.query; diff --git a/space/components/accounts/auth-forms/root.tsx b/space/components/accounts/auth-forms/root.tsx index ed332a88e..1dac88655 100644 --- a/space/components/accounts/auth-forms/root.tsx +++ b/space/components/accounts/auth-forms/root.tsx @@ -4,8 +4,8 @@ import { observer } from "mobx-react-lite"; import { IEmailCheckData } from "@plane/types"; import { EmailForm, UniqueCodeForm, PasswordForm, OAuthOptions, TermsAndConditions } from "@/components/accounts"; // hooks +import { useInstance } from "@/hooks/store"; import useToast from "@/hooks/use-toast"; -import { useMobxStore } from "@/lib/mobx/store-provider"; // services import { AuthService } from "@/services/authentication.service"; @@ -60,9 +60,7 @@ export const AuthRoot = observer(() => { const [authStep, setAuthStep] = useState(EAuthSteps.EMAIL); const [email, setEmail] = useState(""); // hooks - const { - instanceStore: { instance }, - } = useMobxStore(); + const { instance } = useInstance(); // derived values const isSmtpConfigured = instance?.config?.is_smtp_configured; diff --git a/space/components/accounts/oauth/oauth-options.tsx b/space/components/accounts/oauth/oauth-options.tsx index e5e29f078..b8e86c2ca 100644 --- a/space/components/accounts/oauth/oauth-options.tsx +++ b/space/components/accounts/oauth/oauth-options.tsx @@ -2,13 +2,11 @@ import { observer } from "mobx-react-lite"; // components import { GithubOAuthButton, GoogleOAuthButton } from "@/components/accounts"; // hooks -import { useMobxStore } from "@/lib/mobx/store-provider"; +import { useInstance } from "@/hooks/store"; export const OAuthOptions: React.FC = observer(() => { // hooks - const { - instanceStore: { instance }, - } = useMobxStore(); + const { instance } = useInstance(); return ( <> diff --git a/space/components/accounts/user-image-upload-modal.tsx b/space/components/accounts/user-image-upload-modal.tsx index 072e2b480..fc0f4393a 100644 --- a/space/components/accounts/user-image-upload-modal.tsx +++ b/space/components/accounts/user-image-upload-modal.tsx @@ -6,7 +6,7 @@ import { Transition, Dialog } from "@headlessui/react"; // hooks import { Button, TOAST_TYPE, setToast } from "@plane/ui"; // hooks -import { useMobxStore } from "@/lib/mobx/store-provider"; +import { useInstance } from "@/hooks/store"; // services import fileService from "@/services/file.service"; @@ -27,9 +27,7 @@ export const UserImageUploadModal: React.FC = observer((props) => { const [image, setImage] = useState(null); const [isImageUploading, setIsImageUploading] = useState(false); // store hooks - const { - instanceStore: { instance }, - } = useMobxStore(); + const { instance } = useInstance(); const onDrop = (acceptedFiles: File[]) => setImage(acceptedFiles[0]); diff --git a/space/components/accounts/user-logged-in.tsx b/space/components/accounts/user-logged-in.tsx index f9f5aeb39..7bf864431 100644 --- a/space/components/accounts/user-logged-in.tsx +++ b/space/components/accounts/user-logged-in.tsx @@ -1,17 +1,14 @@ import Image from "next/image"; - -// mobx -import { useMobxStore } from "@/lib/mobx/store-provider"; +// hooks +import { useUser } from "@/hooks/store"; // assets import PlaneLogo from "public/plane-logos/black-horizontal-with-blue-logo.svg"; import UserLoggedInImage from "public/user-logged-in.svg"; export const UserLoggedIn = () => { - const { user: userStore } = useMobxStore(); - const user = userStore.currentUser; + const { data: user } = useUser(); if (!user) return null; - return (
diff --git a/space/components/instance/not-ready-view.tsx b/space/components/instance/not-ready-view.tsx index 6718f939a..a28fcf3e7 100644 --- a/space/components/instance/not-ready-view.tsx +++ b/space/components/instance/not-ready-view.tsx @@ -10,14 +10,7 @@ import instanceNotReady from "public/instance/plane-instance-not-ready.webp"; import PlaneBlackLogo from "public/plane-logos/black-horizontal-with-blue-logo.svg"; import PlaneWhiteLogo from "public/plane-logos/white-horizontal-with-blue-logo.svg"; -type TInstanceNotReady = { - isGodModeEnabled: boolean; - handleGodModeStateChange?: (state: boolean) => void; -}; - -export const InstanceNotReady: FC = () => { - // const { isGodModeEnabled, handleGodModeStateChange } = props; - +export const InstanceNotReady: FC = () => { const { resolvedTheme } = useTheme(); const planeLogo = resolvedTheme === "dark" ? PlaneWhiteLogo : PlaneBlackLogo; diff --git a/space/components/issues/board-views/kanban/block.tsx b/space/components/issues/board-views/kanban/block.tsx index 1284f7949..c5b12a9b6 100644 --- a/space/components/issues/board-views/kanban/block.tsx +++ b/space/components/issues/board-views/kanban/block.tsx @@ -10,7 +10,7 @@ import { useMobxStore } from "@/lib/mobx/store-provider"; // components // interfaces -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssue } from "types/issue"; export const IssueKanBanBlock = observer(({ issue }: { issue: IIssue }) => { diff --git a/space/components/issues/board-views/kanban/header.tsx b/space/components/issues/board-views/kanban/header.tsx index ac15dc95c..fc0ed274a 100644 --- a/space/components/issues/board-views/kanban/header.tsx +++ b/space/components/issues/board-views/kanban/header.tsx @@ -7,7 +7,7 @@ import { issueGroupFilter } from "@/constants/data"; // ui // mobx hook import { useMobxStore } from "@/lib/mobx/store-provider"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssueState } from "types/issue"; export const IssueKanBanHeader = observer(({ state }: { state: IIssueState }) => { diff --git a/space/components/issues/board-views/kanban/index.tsx b/space/components/issues/board-views/kanban/index.tsx index a7f3fc6f6..ccfefd874 100644 --- a/space/components/issues/board-views/kanban/index.tsx +++ b/space/components/issues/board-views/kanban/index.tsx @@ -10,7 +10,7 @@ import { Icon } from "@/components/ui"; // interfaces // mobx hook import { useMobxStore } from "@/lib/mobx/store-provider"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssueState, IIssue } from "types/issue"; export const IssueKanbanView = observer(() => { diff --git a/space/components/issues/board-views/list/block.tsx b/space/components/issues/board-views/list/block.tsx index 4a980aba4..b761f5163 100644 --- a/space/components/issues/board-views/list/block.tsx +++ b/space/components/issues/board-views/list/block.tsx @@ -9,7 +9,7 @@ import { IssueBlockState } from "@/components/issues/board-views/block-state"; // mobx hook import { useMobxStore } from "@/lib/mobx/store-provider"; // interfaces -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssue } from "types/issue"; // store diff --git a/space/components/issues/board-views/list/header.tsx b/space/components/issues/board-views/list/header.tsx index cc0a88f5d..f857158d9 100644 --- a/space/components/issues/board-views/list/header.tsx +++ b/space/components/issues/board-views/list/header.tsx @@ -7,7 +7,7 @@ import { StateGroupIcon } from "@plane/ui"; import { issueGroupFilter } from "@/constants/data"; // mobx hook import { useMobxStore } from "@/lib/mobx/store-provider"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssueState } from "types/issue"; export const IssueListHeader = observer(({ state }: { state: IIssueState }) => { diff --git a/space/components/issues/board-views/list/index.tsx b/space/components/issues/board-views/list/index.tsx index 65d79eaac..a0da35522 100644 --- a/space/components/issues/board-views/list/index.tsx +++ b/space/components/issues/board-views/list/index.tsx @@ -6,7 +6,7 @@ import { IssueListHeader } from "@/components/issues/board-views/list/header"; // mobx hook import { useMobxStore } from "@/lib/mobx/store-provider"; // store -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { IIssueState, IIssue } from "types/issue"; export const IssueListView = observer(() => { diff --git a/space/components/issues/filters/applied-filters/root.tsx b/space/components/issues/filters/applied-filters/root.tsx index 6adc7c261..432d187cf 100644 --- a/space/components/issues/filters/applied-filters/root.tsx +++ b/space/components/issues/filters/applied-filters/root.tsx @@ -5,7 +5,7 @@ import { useRouter } from "next/router"; // store import { useMobxStore } from "@/lib/mobx/store-provider"; import { IIssueFilterOptions } from "@/store/issues/types"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { AppliedFiltersList } from "./filters-list"; export const IssueAppliedFilters: FC = observer(() => { diff --git a/space/components/issues/filters/root.tsx b/space/components/issues/filters/root.tsx index 489cf584b..2e9600774 100644 --- a/space/components/issues/filters/root.tsx +++ b/space/components/issues/filters/root.tsx @@ -5,7 +5,7 @@ import { useRouter } from "next/router"; import { useMobxStore } from "@/lib/mobx/store-provider"; import { ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "@/store/issues/helpers"; import { IIssueFilterOptions } from "@/store/issues/types"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { FiltersDropdown } from "./helpers/dropdown"; import { FilterSelection } from "./selection"; // types diff --git a/space/components/issues/navbar/index.tsx b/space/components/issues/navbar/index.tsx index 5d4be93c2..ccd903a80 100644 --- a/space/components/issues/navbar/index.tsx +++ b/space/components/issues/navbar/index.tsx @@ -7,21 +7,21 @@ import { Briefcase } from "lucide-react"; import { Avatar, Button } from "@plane/ui"; import { ProjectLogo } from "@/components/common"; import { IssueFiltersDropdown } from "@/components/issues/filters"; -// ui -// lib +// hooks +import { useUser } from "@/hooks/store"; import { useMobxStore } from "@/lib/mobx/store-provider"; // store -import { RootStore } from "@/store/root"; -import { TIssueBoardKeys } from "types/issue"; +import { RootStore } from "@/store/root.store"; +import { TIssueBoardKeys } from "@/types/issue"; import { NavbarIssueBoardView } from "./issue-board-view"; import { NavbarTheme } from "./theme"; const IssueNavbar = observer(() => { const { project: projectStore, - user: userStore, issuesFilter: { updateFilters }, }: RootStore = useMobxStore(); + const { data: user } = useUser(); // router const router = useRouter(); const { workspace_slug, project_slug, board, peekId, states, priorities, labels } = router.query as { @@ -34,8 +34,6 @@ const IssueNavbar = observer(() => { labels: string; }; - const user = userStore?.currentUser; - useEffect(() => { if (workspace_slug && project_slug) { projectStore.fetchProjectSettings(workspace_slug.toString(), project_slug.toString()); diff --git a/space/components/issues/navbar/issue-board-view.tsx b/space/components/issues/navbar/issue-board-view.tsx index f2d624974..3b81aaf68 100644 --- a/space/components/issues/navbar/issue-board-view.tsx +++ b/space/components/issues/navbar/issue-board-view.tsx @@ -4,7 +4,7 @@ import { useRouter } from "next/router"; import { issueViews } from "@/constants/data"; // mobx import { useMobxStore } from "@/lib/mobx/store-provider"; -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; import { TIssueBoardKeys } from "types/issue"; export const NavbarIssueBoardView = observer(() => { diff --git a/space/components/issues/peek-overview/comment/add-comment.tsx b/space/components/issues/peek-overview/comment/add-comment.tsx index 8ec5b125a..059b224c3 100644 --- a/space/components/issues/peek-overview/comment/add-comment.tsx +++ b/space/components/issues/peek-overview/comment/add-comment.tsx @@ -6,6 +6,7 @@ import { useForm, Controller } from "react-hook-form"; import { EditorRefApi } from "@plane/lite-text-editor"; import { LiteTextEditor } from "@/components/editor/lite-text-editor"; // hooks +import { useUser } from "@/hooks/store"; import useToast from "@/hooks/use-toast"; // lib import { useMobxStore } from "@/lib/mobx/store-provider"; @@ -29,7 +30,8 @@ export const AddComment: React.FC = observer(() => { const { workspace_slug, project_slug } = router.query; // store hooks const { project } = useMobxStore(); - const { user: userStore, issueDetails: issueDetailStore } = useMobxStore(); + const { issueDetails: issueDetailStore } = useMobxStore(); + const { data: currentUser } = useUser(); // derived values const workspaceId = project.workspace?.id; const issueId = issueDetailStore.peekId; @@ -62,6 +64,7 @@ export const AddComment: React.FC = observer(() => { ); }; + // TODO: on click if he user is not logged in redirect to login page return (
@@ -70,7 +73,9 @@ export const AddComment: React.FC = observer(() => { control={control} render={({ field: { value, onChange } }) => ( userStore.requiredLogin(() => handleSubmit(onSubmit)(e))} + onEnterKeyPress={(e) => { + if (currentUser) handleSubmit(onSubmit)(e); + }} workspaceId={workspaceId as string} workspaceSlug={workspace_slug as string} ref={editorRef} diff --git a/space/components/issues/peek-overview/comment/comment-detail-card.tsx b/space/components/issues/peek-overview/comment/comment-detail-card.tsx index e1a139413..11f11849a 100644 --- a/space/components/issues/peek-overview/comment/comment-detail-card.tsx +++ b/space/components/issues/peek-overview/comment/comment-detail-card.tsx @@ -9,10 +9,12 @@ import { LiteTextEditor, LiteTextReadOnlyEditor } from "@/components/editor"; import { CommentReactions } from "@/components/issues/peek-overview"; // helpers import { timeAgo } from "@/helpers/date-time.helper"; +// hooks +import { useUser } from "@/hooks/store"; // mobx store import { useMobxStore } from "@/lib/mobx/store-provider"; // store -import { RootStore } from "@/store/root"; +import { RootStore } from "@/store/root.store"; // types import { Comment } from "@/types/issue"; @@ -27,7 +29,8 @@ export const CommentCard: React.FC = observer((props) => { const workspaceId = project.workspace?.id; // store - const { user: userStore, issueDetails: issueDetailStore } = useMobxStore(); + const { issueDetails: issueDetailStore } = useMobxStore(); + const { data: currentUser } = useUser(); // states const [isEditing, setIsEditing] = useState(false); // refs @@ -139,7 +142,7 @@ export const CommentCard: React.FC = observer((props) => {
- {userStore?.currentUser?.id === comment?.actor_detail?.id && ( + {currentUser?.id === comment?.actor_detail?.id && ( = observer((props) => { const router = useRouter(); const { workspace_slug } = router.query; - - const { issueDetails: issueDetailsStore, user: userStore } = useMobxStore(); + // hooks + const { issueDetails: issueDetailsStore } = useMobxStore(); + const { data: user } = useUser(); const peekId = issueDetailsStore.peekId; - const user = userStore.currentUser; - const commentReactions = peekId ? issueDetailsStore.details[peekId].comments.find((c) => c.id === commentId)?.comment_reactions : []; @@ -64,13 +65,13 @@ export const CommentReactions: React.FC = observer((props) => { else handleAddReaction(reactionHex); }; + // TODO: on onclick redirect to login page if the user is not logged in return (
{ - userStore.requiredLogin(() => { - handleReactionClick(value); - }); + if (user) handleReactionClick(value); + // userStore.requiredLogin(() => {}); }} position="top" selected={userReactions?.map((r) => r.reaction)} @@ -98,14 +99,11 @@ export const CommentReactions: React.FC = observer((props) => {