binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: session auth implementation (#4411)

Browse source 
* feat: session authentication and god-mode implementation (#4302)

* dev: move authentication to base class for credentials

* chore: new account creation

* dev: return error as query parameter

* dev: accounts and profile endpoints for user

* fix: user store updates

* fix: store fixes

* fix: type fixes

* dev: set is_password_autoset and is_email_verifier for auth providers

* dev: move all auth configuration to different apps

* dev: fix circular imports

* dev: remove unused imports

* dev: fix imports for authentication

* dev: update endpoints to use rest framework api viewa

* fix: onboarding fixes

* dev: session model changes

* fix: session model and add check for last name first name and avatar

* dev: fix referer redirect

* dev: remove auth imports

* dev: fix imports

* dev: update migrations

* fix: instance admin login

* comflict: conflicts resolved

* dev: fix import errors and email check endpoint

* fix: error messages and redirects after login

* dev: configs api

* fix: is github enabled boolean

* dev: merge config and instance api

* conflict: merge conflict resolved

* dev: instance admin sign up endpoint

* dev: enable magic link login

* dev: configure instance variables for github and google enabled

* chore: typo fixes

* fix: god mode docker file changes

* build-error: resolved build errors

* fix: docker compose changes

* dev: add email credential check endpoint

* fix: minor package changes

* fix: docker related changes

* dev: add nginx rules in the nginx template

* dev: refactor the url patterns

* fix: docker changes

* fix: docker files for god-mode

* fix: static export

* fix: nginx conf

* dev: smtp sender refused exception

* fix: godmode fixes

* chore: god mode revamp.

* dev: add csrf secured flag

* fix: oauth redirect uri and session settings

* chore: god mode app changes.  (#3982)

* chore: send test email functionality.

* style: authentication methods page UI revamp.

* chore: create workspace popup.

* fix: user me endpoint

* dev: fix redirection after authentication

* dev: handle god mode redirection

* fix: redirections

* fix: auth related hooks

* fix: store related fixes

* dev: fix session authentication for rest apis

* fix: linting errors

* fix: removing references of useStore=

* dev: fix redirection and password validation

* dev: add useUser hook

* fix: build fixes and lint issues

* fix: removing useApplication hook

* fix: build errors

* fix: delete unused files

* fix: auth build fixes

* fix: bugfixes

* dev: alter avatar to support more than 255 chars

* dev: fix profile endpoint and increase session expiry time and update session on every request

* chore: resolved the migration

* chore: resolved merge conflicts

* dev: error codes and error messages for the auth flow

* dev: instance admin sign up and sign in endpoint

* dev: use zxcvbn to validate password strength

* dev: add extra parameters when error handling on instance god mode

* chore: auth init

* chore: signin/ signup form ui updates and password strength meter.

* chore: update password fields.

* chore: validations and error handling.

* chore: updated sign-up form

* chore: updated workflow and updated the code structure

* chore: instance empty state for god-mode.

* chore: instance and auth wrappers update

* fix: renaming godmode

* fix: docker changes

* chore: updated authentication wrappers

* chore: updated the authentication workflow and rendered all pages

* fix: build errors

* fix: docker related fixes

* fix: tailing slash added to space and admin for valid nginx locations

* chore: seperate pages for signup and login

* git-action modified for admin file changes

* feature build action updated for admin app

* self host modified

* chore: resolved build errors and handled signin and signup in a seperate route

* chore: sign-in and sign-up revamp.

* fix: migration conflicts

* dev: migrations

* chore: handled redirection

* dev: admin url

* dev: create seperate endpoint for instance admin me

* dev: instance admin endpoint

* git action fixed

* chore: handled auth wrappers

* dev: add serializer and remove print logs

* fix: build errors

* dev: fix migrations

* dev: instance folder structuring

* fix: linting errors

* chore: resolved build errors

* chore: updated store and auth workflow and updates api service types

* chore: Replaced Next Link with Anchoer tag for god-mode redirection

* add 3333 port to allowed origins

* make password login working again

* dev: fix redirection, add admin signout endpoint and fix email credential check endpoint

* fix unique code sign in

* fix small build error

* enable sign out

* dev: add google client secret variable to configure instance

* dev: add referer for redirection

* fix origin urls for oauths

* admin setup and login separation

* dev: fix user redirection and tour completed endpoint

* fix build errors

* dev: add set password endpoint

* dev: remove user creation logic for redirection

* fix unique code page

* fix forgot password

* chore: onboarding revamp.

* dev: fix workspace slug redirection in login

* chore: invited user onboarding flow update.

* chore: fix switch or delete account modal.

* fix members exception

* refactor auth flows and add invitations to auth flow

* fix sig in sign up url

* fix action url

* fix build errors

* dev: fix user set password when logging in

* dev: reset password endpoint

* chore: confirm password validation for signup and onboarding.

* enable reset password

* fix build error

* chore: minor UI updates.

* chore: forgot and reset password UI revamp.

* fix authentication re directions

* dev: auth redirections

* change url paths for signup and signin

* dev: make the user logged in when changing passwords

* dev: next path redirection for web and space app

* dev: next path for magic sign in endpoint

* dev: github space endpoint

* chore: minor ui updates and fixes in web app.

* set password screen

* fix multiple unique code generation

* dev: next path base redirection

* dev: remove print logs

* dev: auth space endpoints

* fix build errors

* dev: invalidate cache on configuration update, god mode exception errors and authentication failed code

* dev: fix space endpoints and add extra endpoints

* chore: space auth revamp.

* dev: add sign up for space app

* fix: build errors.

* fix: auth redirection logic.

* chore: space app onboarding revamp.

---------

Co-authored-by: pablohashescobar <nikhilschacko@gmail.com>
Co-authored-by: NarayanBavisetti <narayan3119@gmail.com>
Co-authored-by: gurusainath <gurusainath007@gmail.com>
Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
Co-authored-by: Manish Gupta <59428681+mguptahub@users.noreply.github.com>
Co-authored-by: Manish Gupta <manish@mgupta.me>
Co-authored-by: = <=>
Co-authored-by: rahulramesha <rahulramesham@gmail.com>

* chore: updated file structure for admin

* chore: updated admin-sidebar

* chore: auth error handling

* chore: onboarding UI updates and dark mode fixes.

* chore: add `user personalization` step to onboarding profile setup screen.

* chore: fix minor UI bugs

* chore: authentication workflow changes

* chore: handled signin workflow

* style: switch or delete account workflow

* chore: god mode redirection URL

* feat(dashboard): improve label readability (#4321)

change none label for all time in dashbard filters

* chore: god-mode redirection

* chore: onboarding ui updates and accept invitation workflow updates.

* chore: rename unique code auth form.

* style: space auth ux copy.

* chore: updated intance and auth wrapper logic

* chore: update default layout style.

* chore: update confirm password.

* chore: backend redirection

* style: update banner ui

* chore: minor ui updates and validation fix.

* chore: removed old auth hook

* chore: handled auth wrapper

* chore: handled store loaders in the user

* chore: handled logs

* chore: add loading spinners for all auth and onboarding form buttons.

* chore: add background pattern in admin auth forms and minor ui fixes.

* chore: UI changes and revamp components for authentication

* chore: auth UI consistency in web, space and admin.

* chore: resolved build errors

* chore: removed old auth hooks

* chore: handled lint errors in use accounts

* chore: updated authentication wrapper logic in web app

* [WEB -1149] dev: update dependencies (#4333)

* dev: upgrade dependencies remove unwanted dependency and add ruff as local dependency

* dev: add comments

* chore: authentication wrapper fetch user

* chore: updated store loader

* chore: removed old auth wrapper and replaced the imports with new auth wrapper

* chore: join workspace invitation workflow updates

* chore: build error resolved in deploy

* chore: handled onboarding step error in web app

* chore: SMTP Name and Password validation removed

* chore: handled seo and signout logic and new user popup

* chore: added redirection to plane in the sidebar

* chore: resolved build errors

* dev: admin session cookie update

* chore: updated cookie session time for admin

* dev: add start date and end date to projects (#4355)

* chore: add email security dropdown and remove SMTP username and password validation.

* chore: add tooltip to admin sidebar help-section.

* chore: add dropdown to collapsed admin sidebar.

* chore: profile themning

* chore: updated page error messages and theme in command palette

* dev: add email validation in email check apis

* dev: remove start date and end date from project

* chore: updated space folder structure and updated the store hooks

* dev: error codes for authentication

* chore: handled authentication in space and web apps

* chore: banner redirect handling the email

* dev: god mode error codes

* chore: updated error codes

* chore: updated onboarding images

* dev: signout endpoints and saving login domain while creating sessions

* feat: Self Host Data Backup (#4383)

* feat: implemented backup , support for docker-compose tool, readme updated

* minor fix in shell script

* codacy fixes

* chore: handled build errors in web

* chore: updated react, react-dom, and next versions

* chore: updated password autioset in the signin

* dev: add logo prop to views and pages

* chore: updated api service and handled the set password in store

* chore: handled build errors and code cleanup

* dev: return 401 when the session is not valid

* dev: users/me exception for api

* chore: installed lodash in space app

* dev: add auth route in nginx

---------

Co-authored-by: pablohashescobar <nikhilschacko@gmail.com>
Co-authored-by: NarayanBavisetti <narayan3119@gmail.com>
Co-authored-by: gurusainath <gurusainath007@gmail.com>
Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
Co-authored-by: Manish Gupta <59428681+mguptahub@users.noreply.github.com>
Co-authored-by: Manish Gupta <manish@mgupta.me>
Co-authored-by: rahulramesha <rahulramesham@gmail.com>
Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
Co-authored-by: Daniel Alba <56451942+redrum15@users.noreply.github.com>
Co-authored-by: Nikhil <118773738+pablohashescobar@users.noreply.github.com>
This commit is contained in:
sriram veeraghanta 2024-05-08 23:01:20 +05:30 • committed by GitHub
parent ae43d05714
commit 59335618b4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
903 changed files with 25736 additions and 16041 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/components/issues/archived-issues-header.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// types
import type { IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueFilterOptions } from "@plane/types";

12
web/components/issues/attachment/attachment-upload.tsx
View file

@ -1,12 +1,12 @@
import { useCallback, useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useDropzone } from "react-dropzone";
// constants
import { MAX_FILE_SIZE } from "@/constants/common";
// helpers
import { generateFileName } from "@/helpers/attachment.helper";
// hooks
import { useApplication } from "@/hooks/store";
import { useInstance } from "@/hooks/store";
// types
import { TAttachmentOperations } from "./root";
@ -21,9 +21,7 @@ type Props = {
export const IssueAttachmentUpload: React.FC<Props> = observer((props) => {
const { workspaceSlug, disabled = false, handleAttachmentOperations } = props;
// store hooks
const {
config: { envConfig },
} = useApplication();
const { instance } = useInstance();
// states
const [isLoading, setIsLoading] = useState(false);
@ -52,12 +50,12 @@ export const IssueAttachmentUpload: React.FC<Props> = observer((props) => {
const { getRootProps, getInputProps, isDragActive, isDragReject, fileRejections } = useDropzone({
onDrop,
maxSize: envConfig?.file_size_limit ?? MAX_FILE_SIZE,
maxSize: instance?.config?.file_size_limit ?? MAX_FILE_SIZE,
multiple: false,
disabled: isLoading || disabled,
});
const maxFileSize = envConfig?.file_size_limit ?? MAX_FILE_SIZE;
const maxFileSize = instance?.config?.file_size_limit ?? MAX_FILE_SIZE;
const fileError =
fileRejections.length > 0 ? `Invalid file type or size (max ${maxFileSize / 1024 / 1024} MB)` : null;

2
web/components/issues/attachment/attachments-list.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { useIssueDetail } from "@/hooks/store";
// components

2
web/components/issues/issue-detail/cycle-select.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
// components
import { CycleDropdown } from "@/components/dropdowns";

2
web/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { useIssueDetail } from "@/hooks/store";
// components

2
web/components/issues/issue-detail/issue-activity/activity/activity-list.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { useIssueDetail } from "@/hooks/store";
// components

2
web/components/issues/issue-detail/issue-activity/comments/comment-card.tsx
View file

@ -42,7 +42,7 @@ export const IssueCommentCard: FC<TIssueCommentCard> = (props) => {
const {
comment: { getCommentById },
} = useIssueDetail();
const { currentUser } = useUser();
const { data: currentUser } = useUser();
// refs
const editorRef = useRef<EditorRefApi>(null);
const showEditorRef = useRef<EditorReadOnlyRefApi>(null);

2
web/components/issues/issue-detail/issue-activity/comments/root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { EmptyState } from "@/components/empty-state";
// hooks

2
web/components/issues/issue-detail/label/select/label-select.tsx
View file

@ -1,5 +1,5 @@
import { Fragment, useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { usePopper } from "react-popper";
import { Check, Search, Tag } from "lucide-react";
import { Combobox } from "@headlessui/react";

2
web/components/issues/issue-detail/links/links.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// computed
import { useIssueDetail, useUser } from "@/hooks/store";
import { IssueLinkDetail } from "./link-detail";

4
web/components/issues/issue-detail/main-content.tsx
View file

@ -1,5 +1,5 @@
import { useEffect, useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// types
import { TIssue } from "@plane/types";
// ui
@ -33,7 +33,7 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
// states
const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved");
// hooks
const { currentUser } = useUser();
const { data: currentUser } = useUser();
const { projectStates } = useProjectState();
const {
issue: { getIssueById },

2
web/components/issues/issue-detail/module-select.tsx
View file

@ -1,6 +1,6 @@
import React, { useState } from "react";
import xor from "lodash/xor";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
// components
import { ModuleDropdown } from "@/components/dropdowns";

2
web/components/issues/issue-detail/parent-select.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import Link from "next/link";
import { Pencil, X } from "lucide-react";
// hooks

2
web/components/issues/issue-detail/reactions/issue-comment.tsx
View file

@ -90,7 +90,7 @@ export const IssueCommentReaction: FC<TIssueCommentReaction> = observer((props)
};
return (
<div className="mt-4 relative flex items-center gap-1.5">
<div className="relative mt-4 flex items-center gap-1.5">
{!disabled && (
<ReactionSelector
size="md"

3
web/components/issues/issue-detail/reactions/issue.tsx
View file

@ -90,11 +90,10 @@ export const IssueReaction: FC<TIssueReaction> = observer((props) => {
};
return (
<div className="mt-4 relative flex items-center gap-1.5">
<div className="relative mt-4 flex items-center gap-1.5">
{!disabled && (
<ReactionSelector size="md" position="top" value={userReactions} onSelect={issueReactionOperations.react} />
)}
{reactionIds &&
Object.keys(reactionIds || {}).map(
(reaction) =>

2
web/components/issues/issue-detail/relation-select.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import Link from "next/link";
import { CircleDot, CopyPlus, Pencil, X, XCircle } from "lucide-react";
import { TIssueRelationTypes, ISearchIssueResponse } from "@plane/types";

20
web/components/issues/issue-detail/root.tsx
View file

@ -1,24 +1,24 @@
import { FC, useMemo } from "react";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// types
import { TIssue } from "@plane/types";
// components
// ui
import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/ui";
// components
import { EmptyState } from "@/components/common";
import { IssuePeekOverview } from "@/components/issues";
// constants
import { ISSUE_UPDATED, ISSUE_DELETED, ISSUE_ARCHIVED } from "@/constants/event-tracker";
import { EIssuesStoreType } from "@/constants/issue";
import { EUserProjectRoles } from "@/constants/project";
import { useApplication, useEventTracker, useIssueDetail, useIssues, useUser } from "@/hooks/store";
// hooks
import { useAppTheme, useEventTracker, useIssueDetail, useIssues, useUser } from "@/hooks/store";
// images
import emptyIssue from "public/empty-state/issue.svg";
// local components
import { IssueMainContent } from "./main-content";
import { IssueDetailsSidebar } from "./sidebar";
// ui
// images
// hooks
// types
// ui
// constants
export type TIssueOperations = {
fetch: (workspaceSlug: string, projectId: string, issueId: string) => Promise<void>;
@ -77,7 +77,7 @@ export const IssueDetailRoot: FC<TIssueDetailRoot> = observer((props) => {
const {
membership: { currentProjectRole },
} = useUser();
const { theme: themeStore } = useApplication();
const { issueDetailSidebarCollapsed } = useAppTheme();
const issueOperations: TIssueOperations = useMemo(
() => ({
@ -389,7 +389,7 @@ export const IssueDetailRoot: FC<TIssueDetailRoot> = observer((props) => {
</div>
<div
className="fixed right-0 z-[5] h-full w-full min-w-[300px] overflow-hidden border-l border-custom-border-200 bg-custom-sidebar-background-100 py-5 sm:w-1/2 md:relative md:w-1/3 lg:min-w-80 xl:min-w-96"
style={themeStore.issueDetailSidebarCollapsed ? { right: `-${window?.innerWidth || 0}px` } : {}}
style={issueDetailSidebarCollapsed ? { right: `-${window?.innerWidth || 0}px` } : {}}
>
<IssueDetailsSidebar
workspaceSlug={workspaceSlug}

26
web/components/issues/issue-detail/sidebar.tsx
View file

@ -1,18 +1,18 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import {
CalendarCheck2,
CalendarClock,
CircleDot,
CopyPlus,
LayoutPanelTop,
LinkIcon,
Signal,
Tag,
Trash2,
Triangle,
LayoutPanelTop,
XCircle,
CircleDot,
CopyPlus,
CalendarClock,
CalendarCheck2,
} from "lucide-react";
// hooks
// components
@ -22,29 +22,29 @@ import {
DiceIcon,
DoubleCircleIcon,
RelatedIcon,
TOAST_TYPE,
Tooltip,
UserGroupIcon,
TOAST_TYPE,
setToast,
} from "@plane/ui";
import {
DateDropdown,
EstimateDropdown,
PriorityDropdown,
MemberDropdown,
PriorityDropdown,
StateDropdown,
} from "@/components/dropdowns";
// ui
// helpers
import {
ArchiveIssueModal,
DeleteIssueModal,
IssueLinkRoot,
IssueRelationSelect,
IssueCycleSelect,
IssueLabel,
IssueLinkRoot,
IssueModuleSelect,
IssueParentSelect,
IssueLabel,
ArchiveIssueModal,
IssueRelationSelect,
} from "@/components/issues";
// helpers
// types
@ -81,7 +81,7 @@ export const IssueDetailsSidebar: React.FC<Props> = observer((props) => {
const router = useRouter();
// store hooks
const { getProjectById } = useProject();
const { currentUser } = useUser();
const { data: currentUser } = useUser();
const { areEstimatesEnabledForCurrentProject } = useEstimate();
const {
issue: { getIssueById },

2
web/components/issues/issue-detail/subscription.tsx
View file

@ -1,6 +1,6 @@
import { FC, useState } from "react";
import isNil from "lodash/isNil";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { Bell, BellOff } from "lucide-react";
// UI
import { Button, Loader, TOAST_TYPE, setToast } from "@plane/ui";

2
web/components/issues/issue-layouts/calendar/base-calendar-root.tsx
View file

@ -1,6 +1,6 @@
import { FC } from "react";
import { DragDropContext, DropResult } from "@hello-pangea/dnd";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { TGroupedIssues } from "@plane/types";
// components

15
web/components/issues/issue-layouts/calendar/calendar.tsx
View file

@ -1,5 +1,6 @@
import { useState } from "react";
import { observer } from "mobx-react-lite";
// types
import type {
IIssueDisplayFilterOptions,
IIssueDisplayProperties,
@ -9,28 +10,28 @@ import type {
TIssueKanbanFilters,
TIssueMap,
} from "@plane/types";
// hooks
// ui
import { Spinner } from "@plane/ui";
// components
import { CalendarHeader, CalendarIssueBlocks, CalendarWeekDays, CalendarWeekHeader } from "@/components/issues";
// constants
import { MONTHS_LIST } from "@/constants/calendar";
import { EIssueFilterType, EIssuesStoreType } from "@/constants/issue";
import { EUserProjectRoles } from "@/constants/project";
// helpers
import { cn } from "@/helpers/common.helper";
import { renderFormattedPayloadDate } from "@/helpers/date-time.helper";
// hooks
import { useIssues, useUser } from "@/hooks/store";
import { useCalendarView } from "@/hooks/store/use-calendar-view";
import useSize from "@/hooks/use-window-size";
// components
// ui
// types
// store
import { ICycleIssuesFilter } from "@/store/issue/cycle";
import { IModuleIssuesFilter } from "@/store/issue/module";
import { IProjectIssuesFilter } from "@/store/issue/project";
import { IProjectViewIssuesFilter } from "@/store/issue/project-views";
import { TRenderQuickActions } from "../list/list-view-types";
import type { ICalendarWeek } from "./types";
// helpers
// constants
type Props = {
issuesFilterStore: IProjectIssuesFilter | IModuleIssuesFilter | ICycleIssuesFilter | IProjectViewIssuesFilter;
@ -108,7 +109,7 @@ export const CalendarChart: React.FC<Props> = observer((props) => {
updateFilters={updateFilters}
/>
<div
className={cn("flex md:h-full w-full flex-col overflow-y-auto", {
className={cn("flex w-full flex-col overflow-y-auto md:h-full", {
"vertical-scrollbar scrollbar-lg": windowWidth > 768,
})}
>

17
web/components/issues/issue-layouts/calendar/day-tile.tsx
View file

@ -1,13 +1,14 @@
import { Droppable } from "@hello-pangea/dnd";
import { observer } from "mobx-react-lite";
// types
import { TGroupedIssues, TIssue, TIssueMap } from "@plane/types";
// components
import { CalendarIssueBlocks, ICalendarDate } from "@/components/issues";
// helpers
// constants
import { MONTHS_LIST } from "@/constants/calendar";
// helpers
import { cn } from "@/helpers/common.helper";
import { renderFormattedPayloadDate } from "@/helpers/date-time.helper";
// constants
// types
import { ICycleIssuesFilter } from "@/store/issue/cycle";
import { IModuleIssuesFilter } from "@/store/issue/module";
@ -69,7 +70,7 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
<div className="group relative flex h-full w-full flex-col bg-custom-background-90">
{/* header */}
<div
className={`hidden md:flex items-center justify-end flex-shrink-0 px-2 py-1.5 text-right text-xs ${
className={`hidden flex-shrink-0 items-center justify-end px-2 py-1.5 text-right text-xs md:flex ${
calendarLayout === "month" // if month layout, highlight current month days
? date.is_current_month
? "font-medium"
@ -83,7 +84,7 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
>
{date.date.getDate() === 1 && MONTHS_LIST[date.date.getMonth() + 1].shortTitle + " "}
{isToday ? (
<span className="flex items-center justify-center h-5 w-5 rounded-full bg-custom-primary-100 text-white">
<span className="flex h-5 w-5 items-center justify-center rounded-full bg-custom-primary-100 text-white">
{date.date.getDate()}
</span>
) : (
@ -92,7 +93,7 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
</div>
{/* content */}
<div className="h-full w-full hidden md:block">
<div className="hidden h-full w-full md:block">
<Droppable droppableId={formattedDatePayload} isDropDisabled={readOnly}>
{(provided, snapshot) => (
<div
@ -127,14 +128,14 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
<div
onClick={() => setSelectedDate(date.date)}
className={cn(
"text-sm py-2.5 h-full w-full font-medium mx-auto flex flex-col justify-start items-center md:hidden cursor-pointer",
"mx-auto flex h-full w-full cursor-pointer flex-col items-center justify-start py-2.5 text-sm font-medium md:hidden",
{
"bg-custom-background-100": date.date.getDay() !== 0 && date.date.getDay() !== 6,
}
)}
>
<div
className={cn("h-6 w-6 rounded-full flex items-center justify-center ", {
className={cn("flex h-6 w-6 items-center justify-center rounded-full ", {
"bg-custom-primary-100 text-white": isSelectedDate,
"bg-custom-primary-100/10 text-custom-primary-100 ": isToday && !isSelectedDate,
})}
@ -142,7 +143,7 @@ export const CalendarDayTile: React.FC<Props> = observer((props) => {
{date.date.getDate()}
</div>
{totalIssues > 0 && <div className="flex flex-shrink-0 h-1.5 w-1.5 bg-custom-primary-100 rounded mt-1" />}
{totalIssues > 0 && <div className="mt-1 flex h-1.5 w-1.5 flex-shrink-0 rounded bg-custom-primary-100" />}
</div>
</div>
</>

2
web/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { usePopper } from "react-popper";
import { ChevronLeft, ChevronRight } from "lucide-react";
import { Popover, Transition } from "@headlessui/react";

2
web/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { usePopper } from "react-popper";
import { Check, ChevronUp, MoreVerticalIcon } from "lucide-react";

2
web/components/issues/issue-layouts/calendar/header.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { ChevronLeft, ChevronRight } from "lucide-react";

14
web/components/issues/issue-layouts/calendar/issue-block.tsx
View file

@ -6,7 +6,7 @@ import { TIssue } from "@plane/types";
import { Tooltip, ControlLink } from "@plane/ui";
// hooks
import { cn } from "@/helpers/common.helper";
import { useApplication, useIssueDetail, useProject, useProjectState } from "@/hooks/store";
import { useAppRouter, useIssueDetail, useProject, useProjectState } from "@/hooks/store";
import useOutsideClickDetector from "@/hooks/use-outside-click-detector";
// helpers
// types
@ -27,9 +27,7 @@ export const CalendarIssueBlock: React.FC<Props> = observer((props) => {
const blockRef = useRef(null);
const menuActionRef = useRef<HTMLDivElement | null>(null);
// hooks
const {
router: { workspaceSlug, projectId },
} = useApplication();
const { workspaceSlug, projectId } = useAppRouter();
const { getProjectIdentifierById } = useProject();
const { getProjectStates } = useProjectState();
const { getIsIssuePeeked, setPeekIssue } = useIssueDetail();
@ -81,7 +79,7 @@ export const CalendarIssueBlock: React.FC<Props> = observer((props) => {
<div
ref={blockRef}
className={cn(
"group/calendar-block flex h-10 md:h-8 w-full items-center justify-between gap-1.5 rounded border-b md:border-[0.5px] border-custom-border-200 hover:border-custom-border-400 md:px-1 px-4 py-1.5 ",
"group/calendar-block flex h-10 w-full items-center justify-between gap-1.5 rounded border-b border-custom-border-200 px-4 py-1.5 hover:border-custom-border-400 md:h-8 md:border-[0.5px] md:px-1 ",
{
"bg-custom-background-90 shadow-custom-shadow-rg border-custom-primary-100": isDragging,
"bg-custom-background-100 hover:bg-custom-background-90": !isDragging,
@ -96,15 +94,15 @@ export const CalendarIssueBlock: React.FC<Props> = observer((props) => {
backgroundColor: stateColor,
}}
/>
<div className="flex-shrink-0 text-sm md:text-xs text-custom-text-300">
<div className="flex-shrink-0 text-sm text-custom-text-300 md:text-xs">
{getProjectIdentifierById(issue?.project_id)}-{issue.sequence_id}
</div>
<Tooltip tooltipContent={issue.name} isMobile={isMobile}>
<div className="truncate text-sm font-medium md:font-normal md:text-xs">{issue.name}</div>
<div className="truncate text-sm font-medium md:text-xs md:font-normal">{issue.name}</div>
</Tooltip>
</div>
<div
className={`flex-shrink-0 md:hidden h-5 w-5 group-hover/calendar-block:block ${
className={`h-5 w-5 flex-shrink-0 group-hover/calendar-block:block md:hidden ${
isMenuActive ? "!block" : ""
}`}
onClick={(e) => {

7
web/components/issues/issue-layouts/calendar/issue-blocks.tsx
View file

@ -1,6 +1,7 @@
import { useState } from "react";
import { Draggable } from "@hello-pangea/dnd";
import { observer } from "mobx-react-lite";
// types
import { TIssue, TIssueMap } from "@plane/types";
// components
import { CalendarQuickAddIssueForm, CalendarIssueBlockRoot } from "@/components/issues";
@ -79,7 +80,7 @@ export const CalendarIssueBlocks: React.FC<Props> = observer((props) => {
)}
{enableQuickIssueCreate && !disableIssueCreation && !readOnly && (
<div className="px-1 md:px-2 py-1 border-custom-border-200 border-b md:border-none">
<div className="border-b border-custom-border-200 px-1 py-1 md:border-none md:px-2">
<CalendarQuickAddIssueForm
formKey="target_date"
groupId={formattedDatePayload}
@ -94,10 +95,10 @@ export const CalendarIssueBlocks: React.FC<Props> = observer((props) => {
</div>
)}
{totalIssues > 4 && (
<div className="hidden md:flex items-center px-2.5 py-1">
<div className="hidden items-center px-2.5 py-1 md:flex">
<button
type="button"
className="w-min whitespace-nowrap rounded text-xs px-1.5 py-1 text-custom-text-400 font-medium hover:bg-custom-background-80 hover:text-custom-text-300"
className="w-min whitespace-nowrap rounded px-1.5 py-1 text-xs font-medium text-custom-text-400 hover:bg-custom-background-80 hover:text-custom-text-300"
onClick={() => setShowAllIssues(!showAllIssues)}
>
{showAllIssues ? "Hide" : totalIssues - 4 + " more"}

2
web/components/issues/issue-layouts/calendar/quick-add-issue-form.tsx
View file

@ -1,5 +1,5 @@
import { useEffect, useRef, useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { useForm } from "react-hook-form";
// components

2
web/components/issues/issue-layouts/calendar/roots/cycle-root.tsx
View file

@ -1,5 +1,5 @@
import { useCallback } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
//hooks
import { CycleIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/calendar/roots/module-root.tsx
View file

@ -1,5 +1,5 @@
import { useCallback } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
// components

2
web/components/issues/issue-layouts/calendar/roots/project-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { ProjectIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/calendar/roots/project-view-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { ProjectIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/calendar/week-days.tsx
View file

@ -57,7 +57,7 @@ export const CalendarWeekDays: React.FC<Props> = observer((props) => {
return (
<div
className={`grid md:divide-x-[0.5px] divide-custom-border-200 ${showWeekends ? "grid-cols-7" : "grid-cols-5"} ${
className={`grid divide-custom-border-200 md:divide-x-[0.5px] ${showWeekends ? "grid-cols-7" : "grid-cols-5"} ${
calendarLayout === "month" ? "" : "h-full"
}`}
>

2
web/components/issues/issue-layouts/calendar/week-header.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// constants
import { DAYS_LIST } from "@/constants/calendar";

2
web/components/issues/issue-layouts/empty-states/archived-issues.tsx
View file

@ -1,5 +1,5 @@
import size from "lodash/size";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

16
web/components/issues/issue-layouts/empty-states/cycle.tsx
View file

@ -1,18 +1,18 @@
import { useState } from "react";
import isEmpty from "lodash/isEmpty";
import { observer } from "mobx-react-lite";
// types
import { ISearchIssueResponse, TIssueLayouts } from "@plane/types";
// hooks
// ui
import { TOAST_TYPE, setToast } from "@plane/ui";
import { ExistingIssuesListModal } from "@/components/core";
// components
import { ExistingIssuesListModal } from "@/components/core";
import { EmptyState } from "@/components/empty-state";
// types
// constants
import { EmptyStateType } from "@/constants/empty-state";
import { EIssuesStoreType } from "@/constants/issue";
import { useApplication, useCycle, useEventTracker, useIssues } from "@/hooks/store";
// hooks
import { useCommandPalette, useCycle, useEventTracker, useIssues } from "@/hooks/store";
type Props = {
workspaceSlug: string | undefined;
@ -30,9 +30,7 @@ export const CycleEmptyState: React.FC<Props> = observer((props) => {
// store hooks
const { getCycleById } = useCycle();
const { issues } = useIssues(EIssuesStoreType.CYCLE);
const {
commandPalette: { toggleCreateIssueModal },
} = useApplication();
const { toggleCreateIssueModal } = useCommandPalette();
const { setTrackElement } = useEventTracker();
const cycleDetails = cycleId ? getCycleById(cycleId.toString()) : undefined;
@ -67,8 +65,8 @@ export const CycleEmptyState: React.FC<Props> = observer((props) => {
const emptyStateType = isCompletedAndEmpty
? EmptyStateType.PROJECT_CYCLE_COMPLETED_NO_ISSUES
: isEmptyFilters
? EmptyStateType.PROJECT_EMPTY_FILTER
: EmptyStateType.PROJECT_CYCLE_NO_ISSUES;
? EmptyStateType.PROJECT_EMPTY_FILTER
: EmptyStateType.PROJECT_CYCLE_NO_ISSUES;
const additionalPath = isCompletedAndEmpty ? undefined : activeLayout ?? "list";
const emptyStateSize = isEmptyFilters ? "lg" : "sm";

2
web/components/issues/issue-layouts/empty-states/draft-issues.tsx
View file

@ -1,5 +1,5 @@
import size from "lodash/size";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

8
web/components/issues/issue-layouts/empty-states/global-view.tsx
View file

@ -1,8 +1,8 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { Plus, PlusIcon } from "lucide-react";
// hooks
import { EmptyState } from "@/components/common";
import { useApplication, useEventTracker, useProject } from "@/hooks/store";
import { useCommandPalette, useEventTracker, useProject } from "@/hooks/store";
// components
// assets
import emptyIssue from "public/empty-state/issue.svg";
@ -10,9 +10,7 @@ import emptyProject from "public/empty-state/project.svg";
export const GlobalViewEmptyState: React.FC = observer(() => {
// store hooks
const {
commandPalette: { toggleCreateIssueModal, toggleCreateProjectModal },
} = useApplication();
const { toggleCreateIssueModal, toggleCreateProjectModal } = useCommandPalette();
const { setTrackElement } = useEventTracker();
const { workspaceProjectIds } = useProject();

11
web/components/issues/issue-layouts/empty-states/module.tsx
View file

@ -1,18 +1,17 @@
import { useState } from "react";
import { observer } from "mobx-react-lite";
// types
import { ISearchIssueResponse, TIssueLayouts } from "@plane/types";
// hooks
// ui
import { TOAST_TYPE, setToast } from "@plane/ui";
// ui
// components
import { ExistingIssuesListModal } from "@/components/core";
import { EmptyState } from "@/components/empty-state";
// types
// constants
import { EmptyStateType } from "@/constants/empty-state";
import { EIssuesStoreType } from "@/constants/issue";
import { useApplication, useEventTracker, useIssues } from "@/hooks/store";
// hooks
import { useCommandPalette, useEventTracker, useIssues } from "@/hooks/store";
type Props = {
workspaceSlug: string | undefined;
@ -29,9 +28,7 @@ export const ModuleEmptyState: React.FC<Props> = observer((props) => {
const [moduleIssuesListModal, setModuleIssuesListModal] = useState(false);
// store hooks
const { issues } = useIssues(EIssuesStoreType.MODULE);
const {
commandPalette: { toggleCreateIssueModal },
} = useApplication();
const { toggleCreateIssueModal } = useCommandPalette();
const { setTrackElement } = useEventTracker();
const handleAddIssuesToModule = async (data: ISearchIssueResponse[]) => {

12
web/components/issues/issue-layouts/empty-states/project-issues.tsx
View file

@ -1,22 +1,22 @@
import size from "lodash/size";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// types
import { IIssueFilterOptions } from "@plane/types";
// hooks
// components
import { EmptyState } from "@/components/empty-state";
// constants
import { EmptyStateType } from "@/constants/empty-state";
import { EIssueFilterType, EIssuesStoreType } from "@/constants/issue";
import { useApplication, useEventTracker, useIssues } from "@/hooks/store";
// types
// hooks
import { useCommandPalette, useEventTracker, useIssues } from "@/hooks/store";
export const ProjectEmptyState: React.FC = observer(() => {
// router
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
// store hooks
const { commandPalette: commandPaletteStore } = useApplication();
const { toggleCreateIssueModal } = useCommandPalette();
const { setTrackElement } = useEventTracker();
const { issuesFilter } = useIssues(EIssuesStoreType.PROJECT);
@ -56,7 +56,7 @@ export const ProjectEmptyState: React.FC = observer(() => {
? undefined
: () => {
setTrackElement("Project issue empty state");
commandPaletteStore.toggleCreateIssueModal(true, EIssuesStoreType.PROJECT);
toggleCreateIssueModal(true, EIssuesStoreType.PROJECT);
}
}
secondaryButtonOnClick={issueFilterCount > 0 ? handleClearAllFilters : undefined}

8
web/components/issues/issue-layouts/empty-states/project-view.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { PlusIcon } from "lucide-react";
// components
import { EmptyState } from "@/components/common";
@ -6,13 +6,13 @@ import { EmptyState } from "@/components/common";
import { EIssuesStoreType } from "@/constants/issue";
import { EUserProjectRoles } from "@/constants/project";
// hooks
import { useApplication, useEventTracker, useUser } from "@/hooks/store";
import { useCommandPalette, useEventTracker, useUser } from "@/hooks/store";
// assets
import emptyIssue from "public/empty-state/issue.svg";
export const ProjectViewEmptyState: React.FC = observer(() => {
// store hooks
const { commandPalette: commandPaletteStore } = useApplication();
const { toggleCreateIssueModal } = useCommandPalette();
const { setTrackElement } = useEventTracker();
const {
membership: { currentProjectRole },
@ -33,7 +33,7 @@ export const ProjectViewEmptyState: React.FC = observer(() => {
icon: <PlusIcon className="h-3 w-3" strokeWidth={2} />,
onClick: () => {
setTrackElement("View issue empty state");
commandPaletteStore.toggleCreateIssueModal(true, EIssuesStoreType.PROJECT_VIEW);
toggleCreateIssueModal(true, EIssuesStoreType.PROJECT_VIEW);
},
}
: undefined

2
web/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { X } from "lucide-react";
import { TCycleGroups } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/date.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// icons
import { X } from "lucide-react";
// helpers

20
web/components/issues/issue-layouts/filters/applied-filters/filters-list.tsx
View file

@ -1,7 +1,8 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { X } from "lucide-react";
// types
import { IIssueFilterOptions, IIssueLabel, IState } from "@plane/types";
// hooks
// components
import {
AppliedCycleFilters,
AppliedDateFilters,
@ -13,13 +14,12 @@ import {
AppliedStateFilters,
AppliedStateGroupFilters,
} from "@/components/issues";
import { EUserProjectRoles } from "@/constants/project";
import { replaceUnderscoreIfSnakeCase } from "@/helpers/string.helper";
import { useApplication, useUser } from "@/hooks/store";
// components
// helpers
// types
// constants
import { EUserProjectRoles } from "@/constants/project";
// helpers
import { replaceUnderscoreIfSnakeCase } from "@/helpers/string.helper";
// hooks
import { useAppRouter, useUser } from "@/hooks/store";
type Props = {
appliedFilters: IIssueFilterOptions;
@ -36,9 +36,7 @@ const dateFilters = ["start_date", "target_date"];
export const AppliedFiltersList: React.FC<Props> = observer((props) => {
const { appliedFilters, handleClearAllFilters, handleRemoveFilter, labels, states, alwaysAllowEditing } = props;
// store hooks
const {
router: { moduleId, cycleId },
} = useApplication();
const { moduleId, cycleId } = useAppRouter();
const {
membership: { currentProjectRole },
} = useUser();

2
web/components/issues/issue-layouts/filters/applied-filters/label.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// icons
import { X } from "lucide-react";

2
web/components/issues/issue-layouts/filters/applied-filters/members.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { X } from "lucide-react";
// ui
import { Avatar } from "@plane/ui";

2
web/components/issues/issue-layouts/filters/applied-filters/module.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { X } from "lucide-react";
// hooks
import { DiceIcon } from "@plane/ui";

2
web/components/issues/issue-layouts/filters/applied-filters/priority.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// icons
import { X } from "lucide-react";

2
web/components/issues/issue-layouts/filters/applied-filters/project.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { X } from "lucide-react";
// hooks
import { ProjectLogo } from "@/components/project";

2
web/components/issues/issue-layouts/filters/applied-filters/roots/archived-issue.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/cycle-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/draft-issue.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx
View file

@ -1,6 +1,6 @@
import isEmpty from "lodash/isEmpty";
import isEqual from "lodash/isEqual";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions, TStaticViewTypes } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/module-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/profile-issues-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/project-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/roots/project-view-root.tsx
View file

@ -1,6 +1,6 @@
import isEmpty from "lodash/isEmpty";
import isEqual from "lodash/isEqual";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { IIssueFilterOptions } from "@plane/types";
// hooks

2
web/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// icons
import { X } from "lucide-react";

2
web/components/issues/issue-layouts/filters/applied-filters/state.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// icons
import { X } from "lucide-react";

2
web/components/issues/issue-layouts/filters/header/filters/assignee.tsx
View file

@ -22,7 +22,7 @@ export const FilterAssignees: React.FC<Props> = observer((props: Props) => {
const [previewEnabled, setPreviewEnabled] = useState(true);
// store hooks
const { getUserDetails } = useMember();
const { currentUser } = useUser();
const { data: currentUser } = useUser();
const appliedFiltersCount = appliedFilters?.length ?? 0;

2
web/components/issues/issue-layouts/filters/header/filters/created-by.tsx
View file

@ -22,7 +22,7 @@ export const FilterCreatedBy: React.FC<Props> = observer((props: Props) => {
const [previewEnabled, setPreviewEnabled] = useState(true);
// store hooks
const { getUserDetails } = useMember();
const { currentUser } = useUser();
const { data: currentUser } = useUser();
const sortedOptions = useMemo(() => {
const filteredOptions = (memberIds || []).filter((memberId) =>

6
web/components/issues/issue-layouts/filters/header/filters/cycle.tsx
View file

@ -5,7 +5,7 @@ import { TCycleGroups } from "@plane/types";
// components
import { Loader, CycleGroupIcon } from "@plane/ui";
import { FilterHeader, FilterOption } from "@/components/issues";
import { useApplication, useCycle } from "@/hooks/store";
import { useAppRouter, useCycle } from "@/hooks/store";
// ui
// types
@ -19,9 +19,7 @@ export const FilterCycle: React.FC<Props> = observer((props) => {
const { appliedFilters, handleUpdate, searchQuery } = props;
// hooks
const {
router: { projectId },
} = useApplication();
const { projectId } = useAppRouter();
const { getCycleById, getProjectCycleIds } = useCycle();
// states

10
web/components/issues/issue-layouts/filters/header/filters/filters-selection.tsx
View file

@ -1,5 +1,5 @@
import { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { Search, X } from "lucide-react";
import { IIssueFilterOptions, IIssueLabel, IState } from "@plane/types";
// hooks
@ -18,7 +18,7 @@ import {
FilterModule,
} from "@/components/issues";
import { ILayoutDisplayFiltersOptions } from "@/constants/issue";
import { useApplication } from "@/hooks/store";
import { useAppRouter } from "@/hooks/store";
// components
// types
// constants
@ -46,9 +46,7 @@ export const FilterSelection: React.FC<Props> = observer((props) => {
moduleViewDisabled = false,
} = props;
// hooks
const {
router: { moduleId, cycleId },
} = useApplication();
const { moduleId, cycleId } = useAppRouter();
// states
const [filtersSearchQuery, setFiltersSearchQuery] = useState("");
@ -74,7 +72,7 @@ export const FilterSelection: React.FC<Props> = observer((props) => {
)}
</div>
</div>
<div className="h-full w-full divide-y divide-custom-border-200 overflow-y-auto px-2.5 vertical-scrollbar scrollbar-sm">
<div className="vertical-scrollbar scrollbar-sm h-full w-full divide-y divide-custom-border-200 overflow-y-auto px-2.5">
{/* priority */}
{isFilterEnabled("priority") && (
<div className="py-2">

2
web/components/issues/issue-layouts/filters/header/filters/mentions.tsx
View file

@ -22,7 +22,7 @@ export const FilterMentions: React.FC<Props> = observer((props: Props) => {
const [previewEnabled, setPreviewEnabled] = useState(true);
// store hooks
const { getUserDetails } = useMember();
const { currentUser } = useUser();
const { data: currentUser } = useUser();
const appliedFiltersCount = appliedFilters?.length ?? 0;

8
web/components/issues/issue-layouts/filters/header/filters/module.tsx
View file

@ -4,7 +4,7 @@ import { observer } from "mobx-react";
// components
import { Loader, DiceIcon } from "@plane/ui";
import { FilterHeader, FilterOption } from "@/components/issues";
import { useApplication, useModule } from "@/hooks/store";
import { useAppRouter, useModule } from "@/hooks/store";
// ui
type Props = {
@ -15,13 +15,9 @@ type Props = {
export const FilterModule: React.FC<Props> = observer((props) => {
const { appliedFilters, handleUpdate, searchQuery } = props;
// hooks
const {
router: { projectId },
} = useApplication();
const { projectId } = useAppRouter();
const { getModuleById, getProjectModuleIds } = useModule();
// states
const [itemsToRender, setItemsToRender] = useState(5);
const [previewEnabled, setPreviewEnabled] = useState(true);

2
web/components/issues/issue-layouts/filters/header/filters/priority.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// ui
import { PriorityIcon } from "@plane/ui";

2
web/components/issues/issue-layouts/filters/header/filters/start-date.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { DateFilterModal } from "@/components/core";

2
web/components/issues/issue-layouts/filters/header/filters/state-group.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { StateGroupIcon } from "@plane/ui";
import { FilterHeader, FilterOption } from "@/components/issues";

2
web/components/issues/issue-layouts/filters/header/filters/target-date.tsx
View file

@ -1,5 +1,5 @@
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { DateFilterModal } from "@/components/core";

2
web/components/issues/issue-layouts/gantt/base-gantt-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { TIssue, TUnGroupedIssues } from "@plane/types";
// hooks

14
web/components/issues/issue-layouts/gantt/blocks.tsx
View file

@ -4,7 +4,7 @@ import { observer } from "mobx-react";
import { Tooltip, StateGroupIcon, ControlLink } from "@plane/ui";
// helpers
import { renderFormattedDate } from "@/helpers/date-time.helper";
import { useApplication, useIssueDetail, useProject, useProjectState } from "@/hooks/store";
import { useAppRouter, useIssueDetail, useProject, useProjectState } from "@/hooks/store";
import { usePlatformOS } from "@/hooks/use-platform-os";
type Props = {
@ -14,9 +14,7 @@ type Props = {
export const IssueGanttBlock: React.FC<Props> = observer((props) => {
const { issueId } = props;
// store hooks
const {
router: { workspaceSlug },
} = useApplication();
const { workspaceSlug } = useAppRouter();
const { getProjectStates } = useProjectState();
const {
issue: { getIssueById },
@ -59,7 +57,7 @@ export const IssueGanttBlock: React.FC<Props> = observer((props) => {
}
position="top-left"
>
<div className="relative w-full truncate px-2.5 py-1 text-sm text-custom-text-100 overflow-hidden">
<div className="relative w-full overflow-hidden truncate px-2.5 py-1 text-sm text-custom-text-100">
{issueDetails?.name}
</div>
</Tooltip>
@ -73,9 +71,7 @@ export const IssueGanttSidebarBlock: React.FC<Props> = observer((props) => {
// store hooks
const { getStateById } = useProjectState();
const { getProjectIdentifierById } = useProject();
const {
router: { workspaceSlug },
} = useApplication();
const { workspaceSlug } = useAppRouter();
const {
issue: { getIssueById },
setPeekIssue,
@ -96,7 +92,7 @@ export const IssueGanttSidebarBlock: React.FC<Props> = observer((props) => {
href={`/${workspaceSlug}/projects/${issueDetails?.project_id}/issues/${issueDetails?.id}`}
target="_blank"
onClick={handleIssuePeekOverview}
className="w-full line-clamp-1 cursor-pointer text-sm text-custom-text-100"
className="line-clamp-1 w-full cursor-pointer text-sm text-custom-text-100"
disabled={!!issueDetails?.tempId}
>
<div className="relative flex h-full w-full cursor-pointer items-center gap-2">

2
web/components/issues/issue-layouts/gantt/cycle-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/gantt/module-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/gantt/project-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { EIssuesStoreType } from "@/constants/issue";
// components

2
web/components/issues/issue-layouts/gantt/project-view-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/gantt/quick-add-issue-form.tsx
View file

@ -1,5 +1,5 @@
import { useEffect, useState, useRef, FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { useForm } from "react-hook-form";
import { PlusIcon } from "lucide-react";

8
web/components/issues/issue-layouts/kanban/block.tsx
View file

@ -8,7 +8,8 @@ import { ControlLink, DropIndicator, TOAST_TYPE, Tooltip, setToast } from "@plan
import RenderIfVisible from "@/components/core/render-if-visible-HOC";
import { HIGHLIGHT_CLASS } from "@/components/issues/issue-layouts/utils";
import { cn } from "@/helpers/common.helper";
import { useApplication, useIssueDetail, useKanbanView, useProject } from "@/hooks/store";
// hooks
import { useAppRouter, useIssueDetail, useProject, useKanbanView } from "@/hooks/store";
import useOutsideClickDetector from "@/hooks/use-outside-click-detector";
import { usePlatformOS } from "@/hooks/use-platform-os";
// components
@ -109,9 +110,8 @@ export const KanbanIssueBlock: React.FC<IssueBlockProps> = observer((props) => {
} = props;
const cardRef = useRef<HTMLAnchorElement | null>(null);
const {
router: { workspaceSlug },
} = useApplication();
// hooks
const { workspaceSlug } = useAppRouter();
const { getIsIssuePeeked, setPeekIssue } = useIssueDetail();
const handleIssuePeekOverview = (issue: TIssue) =>

2
web/components/issues/issue-layouts/kanban/default.tsx
View file

@ -142,7 +142,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = observer((props) => {
return (
<div
key={subList.id}
className={`relative flex flex-shrink-0 flex-col group ${
className={`group relative flex flex-shrink-0 flex-col ${
groupByVisibilityToggle.showIssues ? `w-[350px]` : ``
} `}
>

2
web/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
View file

@ -1,5 +1,5 @@
import React, { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// lucide icons
import { Minimize2, Maximize2, Circle, Plus } from "lucide-react";

2
web/components/issues/issue-layouts/kanban/quick-add-issue-form.tsx
View file

@ -1,5 +1,5 @@
import { useEffect, useState, useRef } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { useForm } from "react-hook-form";
import { PlusIcon } from "lucide-react";

2
web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx
View file

@ -1,5 +1,5 @@
import React, { useCallback } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// components
import { CycleIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/kanban/roots/draft-issue-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// components
import { DraftIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/kanban/roots/module-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hook
import { ModuleIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/kanban/roots/profile-issues-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { ProjectIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/kanban/roots/project-root.tsx
View file

@ -1,4 +1,4 @@
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// mobx store
import { ProjectIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/kanban/roots/project-view-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { EIssuesStoreType } from "@/constants/issue";

10
web/components/issues/issue-layouts/list/block.tsx
View file

@ -10,7 +10,7 @@ import { IssueProperties } from "@/components/issues/issue-layouts/properties";
// helpers
import { cn } from "@/helpers/common.helper";
// hooks
import { useApplication, useIssueDetail, useProject } from "@/hooks/store";
import { useAppRouter, useIssueDetail, useProject } from "@/hooks/store";
import { usePlatformOS } from "@/hooks/use-platform-os";
// types
import { TRenderQuickActions } from "./list-view-types";
@ -44,11 +44,7 @@ export const IssueBlock: React.FC<IssueBlockProps> = observer((props: IssueBlock
// refs
const parentRef = useRef(null);
// hooks
const {
router: { workspaceSlug },
} = useApplication();
// store hooks
const { workspaceSlug } = useAppRouter();
const { getProjectIdentifierById } = useProject();
const { getIsIssuePeeked, setPeekIssue, subIssues: subIssuesStore } = useIssueDetail();
@ -152,7 +148,7 @@ export const IssueBlock: React.FC<IssueBlockProps> = observer((props: IssueBlock
{!issue?.tempId ? (
<>
<IssueProperties
className="relative flex flex-wrap md:flex-grow md:flex-shrink-0 items-center gap-2 whitespace-nowrap"
className="relative flex flex-wrap items-center gap-2 whitespace-nowrap md:flex-shrink-0 md:flex-grow"
issue={issue}
isReadOnly={!canEditIssueProperties}
updateIssue={updateIssue}

2
web/components/issues/issue-layouts/list/headers/group-by-card.tsx
View file

@ -1,5 +1,5 @@
import { useState } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// lucide icons
import { CircleDashed, Plus } from "lucide-react";

2
web/components/issues/issue-layouts/list/quick-add-issue-form.tsx
View file

@ -1,5 +1,5 @@
import { FC, useEffect, useState, useRef } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { useForm } from "react-hook-form";
import { PlusIcon } from "lucide-react";

2
web/components/issues/issue-layouts/list/roots/archived-issue-root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { ArchivedIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/list/roots/cycle-root.tsx
View file

@ -1,5 +1,5 @@
import React, { useCallback } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// components
import { CycleIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { DraftIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/list/roots/module-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// mobx store
import { ModuleIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/list/roots/profile-issues-root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
// hooks
import { ProjectIssueQuickActions } from "@/components/issues";
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/list/roots/project-root.tsx
View file

@ -1,5 +1,5 @@
import { FC } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// hooks
import { ProjectIssueQuickActions } from "@/components/issues";

2
web/components/issues/issue-layouts/list/roots/project-view-root.tsx
View file

@ -1,5 +1,5 @@
import React from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
// store
import { EIssuesStoreType } from "@/constants/issue";

2
web/components/issues/issue-layouts/properties/all-properties.tsx
View file

@ -1,6 +1,6 @@
import { useCallback, useMemo } from "react";
import xor from "lodash/xor";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import { CalendarCheck2, CalendarClock, Layers, Link, Paperclip } from "lucide-react";
import { TIssue, IIssueDisplayProperties, TIssuePriorities } from "@plane/types";

14
web/components/issues/issue-layouts/properties/labels.tsx
View file

@ -1,18 +1,18 @@
import { Fragment, useEffect, useRef, useState } from "react";
import { Placement } from "@popperjs/core";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { usePopper } from "react-popper";
import { Check, ChevronDown, Search, Tags } from "lucide-react";
import { Combobox } from "@headlessui/react";
// types
import { IIssueLabel } from "@plane/types";
// hooks
// ui
import { Tooltip } from "@plane/ui";
import { useApplication, useLabel } from "@/hooks/store";
// hooks
import { useAppRouter, useLabel } from "@/hooks/store";
import { useDropdownKeyDown } from "@/hooks/use-dropdown-key-down";
import useOutsideClickDetector from "@/hooks/use-outside-click-detector";
import { usePlatformOS } from "@/hooks/use-platform-os";
// components
// types
export interface IIssuePropertyLabels {
projectId: string | null;
@ -59,9 +59,7 @@ export const IssuePropertyLabels: React.FC<IIssuePropertyLabels> = observer((pro
const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);
const [isLoading, setIsLoading] = useState<boolean>(false);
// store hooks
const {
router: { workspaceSlug },
} = useApplication();
const { workspaceSlug } = useAppRouter();
const { fetchProjectLabels, getProjectLabels } = useLabel();
const { isMobile } = usePlatformOS();
const storeLabels = getProjectLabels(projectId);

2
web/components/issues/issue-layouts/properties/with-display-properties-HOC.tsx
View file

@ -1,5 +1,5 @@
import { ReactNode } from "react";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { IIssueDisplayProperties } from "@plane/types";
interface IWithDisplayPropertiesHOC {

12
web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx
View file

@ -1,6 +1,6 @@
import React, { Fragment, useCallback } from "react";
import isEmpty from "lodash/isEmpty";
import { observer } from "mobx-react-lite";
import { observer } from "mobx-react";
import { useRouter } from "next/router";
import useSWR from "swr";
import { IIssueDisplayFilterOptions } from "@plane/types";
@ -16,7 +16,7 @@ import { SpreadsheetLayoutLoader } from "@/components/ui";
import { EMPTY_STATE_DETAILS, EmptyStateType } from "@/constants/empty-state";
import { EIssueFilterType, EIssuesStoreType, ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "@/constants/issue";
import { EUserProjectRoles } from "@/constants/project";
import { useApplication, useEventTracker, useGlobalView, useIssues, useProject, useUser } from "@/hooks/store";
import { useCommandPalette, useEventTracker, useGlobalView, useIssues, useProject, useUser } from "@/hooks/store";
import { useIssuesActions } from "@/hooks/use-issues-actions";
import { useWorkspaceIssueProperties } from "@/hooks/use-workspace-issue-properties";
import { TRenderQuickActions } from "../list/list-view-types";
@ -28,7 +28,7 @@ export const AllIssueLayoutRoot: React.FC = observer(() => {
//swr hook for fetching issue properties
useWorkspaceIssueProperties(workspaceSlug);
// store
const { commandPalette: commandPaletteStore } = useApplication();
const { toggleCreateProjectModal, toggleCreateIssueModal } = useCommandPalette();
const {
issuesFilter: { filters, fetchFilters, updateFilters },
issues: { loader, groupedIssueIds, fetchIssues },
@ -154,7 +154,7 @@ export const AllIssueLayoutRoot: React.FC = observer(() => {
return (
<div className="relative flex h-full w-full flex-col overflow-hidden">
<div className="relative h-full w-full flex flex-col">
<div className="relative flex h-full w-full flex-col">
<GlobalViewsAppliedFiltersRoot globalViewId={globalViewId} />
{issueIds.length === 0 ? (
<EmptyState
@ -165,12 +165,12 @@ export const AllIssueLayoutRoot: React.FC = observer(() => {
? currentView !== "custom-view" && currentView !== "subscribed"
? () => {
setTrackElement("All issues empty state");
commandPaletteStore.toggleCreateIssueModal(true, EIssuesStoreType.PROJECT);
toggleCreateIssueModal(true, EIssuesStoreType.PROJECT);
}
: undefined
: () => {
setTrackElement("All issues empty state");
commandPaletteStore.toggleCreateProjectModal(true);
toggleCreateProjectModal(true);
}
}
/>

Some files were not shown because too many files have changed in this diff Show more