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

[WEB-1634] dev: update application router to support n-progress. (#4846)

Browse source 
* [WEB-1634] dev: update application router to support n-progress.

* chore: update app router initilization logic.

* fix: lint errors
This commit is contained in:
Prateek Shourya 2024-06-18 11:35:20 +05:30 • committed by GitHub
parent 10e67144a0
commit 6828d33c3f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
111 changed files with 480 additions and 374 deletions
Download patch file Download diff file Expand all files Collapse all files

5
web/core/components/cycles/analytics-sidebar/root.tsx
View file

@ -3,7 +3,7 @@
import React, { useEffect, useState } from "react";
import isEmpty from "lodash/isEmpty";
import { observer } from "mobx-react";
import { useParams, useRouter } from "next/navigation";
import { useParams } from "next/navigation";
import { Controller, useForm } from "react-hook-form";
// icons
import { ArchiveRestoreIcon, LinkIcon, Trash2, ChevronRight, CalendarClock, SquareUser } from "lucide-react";
@ -23,6 +23,7 @@ import { findHowManyDaysLeft, getDate, renderFormattedPayloadDate } from "@/help
import { copyUrlToClipboard } from "@/helpers/string.helper";
// hooks
import { useEventTracker, useCycle, useUser, useMember, useProjectEstimates } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
// plane web constants
import { EEstimateSystem } from "@/plane-web/constants/estimates";
// services
@ -49,7 +50,7 @@ export const CycleDetailsSidebar: React.FC<Props> = observer((props) => {
const [archiveCycleModal, setArchiveCycleModal] = useState(false);
const [cycleDeleteModal, setCycleDeleteModal] = useState(false);
// router
const router = useRouter();
const router = useAppRouter();
const { workspaceSlug, projectId } = useParams();
// store hooks
const { setTrackElement, captureCycleEvent } = useEventTracker();

4
web/core/components/cycles/archived-cycles/modal.tsx
View file

@ -1,12 +1,12 @@
"use client";
import { useState, Fragment } from "react";
import { useRouter } from "next/navigation";
import { Dialog, Transition } from "@headlessui/react";
// ui
import { Button, TOAST_TYPE, setToast } from "@plane/ui";
// hooks
import { useCycle } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
type Props = {
workspaceSlug: string;
@ -20,7 +20,7 @@ type Props = {
export const ArchiveCycleModal: React.FC<Props> = (props) => {
const { workspaceSlug, projectId, cycleId, isOpen, handleClose } = props;
// router
const router = useRouter();
const router = useAppRouter();
// states
const [isArchiving, setIsArchiving] = useState(false);
// store hooks

5
web/core/components/cycles/board/cycles-board-card.tsx
View file

@ -3,7 +3,7 @@
import { FC, MouseEvent, useRef } from "react";
import { observer } from "mobx-react";
import Link from "next/link";
import { usePathname, useRouter, useSearchParams } from "next/navigation";
import { usePathname, useSearchParams } from "next/navigation";
import { CalendarCheck2, CalendarClock, Info, MoveRight } from "lucide-react";
// types
import type { TCycleGroups } from "@plane/types";
@ -21,6 +21,7 @@ import { findHowManyDaysLeft, getDate, renderFormattedDate } from "@/helpers/dat
import { generateQueryParams } from "@/helpers/router.helper";
// hooks
import { useEventTracker, useCycle, useUser, useMember } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
import { usePlatformOS } from "@/hooks/use-platform-os";
export interface ICyclesBoardCard {
@ -34,7 +35,7 @@ export const CyclesBoardCard: FC<ICyclesBoardCard> = observer((props) => {
// refs
const parentRef = useRef(null);
// router
const router = useRouter();
const router = useAppRouter();
const searchParams = useSearchParams();
const pathname = usePathname();
// store

5
web/core/components/cycles/cycle-peek-overview.tsx
View file

@ -1,9 +1,10 @@
import React, { useEffect } from "react";
import { observer } from "mobx-react";
import { usePathname, useRouter, useSearchParams } from "next/navigation";
import { usePathname, useSearchParams } from "next/navigation";
// hooks
import { generateQueryParams } from "@/helpers/router.helper";
import { useCycle } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
// components
import { CycleDetailsSidebar } from "./";
@ -15,7 +16,7 @@ type Props = {
export const CyclePeekOverview: React.FC<Props> = observer(({ projectId, workspaceSlug, isArchived = false }) => {
// router
const router = useRouter();
const router = useAppRouter();
const pathname = usePathname();
const searchParams = useSearchParams();
const peekCycle = searchParams.get("peekCycle");

5
web/core/components/cycles/delete-modal.tsx
View file

@ -2,7 +2,7 @@
import { useState } from "react";
import { observer } from "mobx-react";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import { useParams, useSearchParams } from "next/navigation";
// types
import { ICycle } from "@plane/types";
// ui
@ -11,6 +11,7 @@ import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
import { CYCLE_DELETED } from "@/constants/event-tracker";
// hooks
import { useEventTracker, useCycle } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
interface ICycleDelete {
cycle: ICycle;
@ -28,7 +29,7 @@ export const CycleDeleteModal: React.FC<ICycleDelete> = observer((props) => {
const { captureCycleEvent } = useEventTracker();
const { deleteCycle } = useCycle();
// router
const router = useRouter();
const router = useAppRouter();
const { cycleId } = useParams();
const searchParams = useSearchParams();
const peekCycle = searchParams.get("peekCycle");

31
web/core/components/cycles/gantt-chart/blocks.tsx
View file

@ -2,13 +2,14 @@
import { observer } from "mobx-react";
import Link from "next/link";
import { useRouter } from "next/navigation";
// hooks
import { useParams } from "next/navigation";
// ui
import { Tooltip, ContrastIcon } from "@plane/ui";
// helpers
import { renderFormattedDate } from "@/helpers/date-time.helper";
import { useAppRouter, useCycle } from "@/hooks/store";
// hooks
import { useCycle } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
import { usePlatformOS } from "@/hooks/use-platform-os";
type Props = {
@ -18,9 +19,9 @@ type Props = {
export const CycleGanttBlock: React.FC<Props> = observer((props) => {
const { cycleId } = props;
// router
const router = useRouter();
const router = useAppRouter();
// store hooks
const { workspaceSlug } = useAppRouter();
const { workspaceSlug } = useParams();
const { getCycleById } = useCycle();
// derived values
const cycleDetails = getCycleById(cycleId);
@ -35,14 +36,16 @@ export const CycleGanttBlock: React.FC<Props> = observer((props) => {
cycleStatus === "current"
? "#09a953"
: cycleStatus === "upcoming"
? "#f7ae59"
: cycleStatus === "completed"
? "#3f76ff"
: cycleStatus === "draft"
? "rgb(var(--color-text-200))"
: "",
? "#f7ae59"
: cycleStatus === "completed"
? "#3f76ff"
: cycleStatus === "draft"
? "rgb(var(--color-text-200))"
: "",
}}
onClick={() => router.push(`/${workspaceSlug}/projects/${cycleDetails?.project_id}/cycles/${cycleDetails?.id}`)}
onClick={() =>
router.push(`/${workspaceSlug.toString()}/projects/${cycleDetails?.project_id}/cycles/${cycleDetails?.id}`)
}
>
<div className="absolute left-0 top-0 h-full w-full bg-custom-background-100/50" />
<Tooltip
@ -67,7 +70,7 @@ export const CycleGanttBlock: React.FC<Props> = observer((props) => {
export const CycleGanttSidebarBlock: React.FC<Props> = observer((props) => {
const { cycleId } = props;
// store hooks
const { workspaceSlug } = useAppRouter();
const { workspaceSlug } = useParams();
const { getCycleById } = useCycle();
// derived values
const cycleDetails = getCycleById(cycleId);
@ -77,7 +80,7 @@ export const CycleGanttSidebarBlock: React.FC<Props> = observer((props) => {
return (
<Link
className="relative flex h-full w-full items-center gap-2"
href={`/${workspaceSlug}/projects/${cycleDetails?.project_id}/cycles/${cycleDetails?.id}`}
href={`/${workspaceSlug.toString()}/projects/${cycleDetails?.project_id}/cycles/${cycleDetails?.id}`}
draggable={false}
>
<ContrastIcon

5
web/core/components/cycles/list/cycles-list-item.tsx
View file

@ -2,7 +2,7 @@
import { FC, MouseEvent, useRef } from "react";
import { observer } from "mobx-react";
import { usePathname, useRouter, useSearchParams } from "next/navigation";
import { usePathname, useSearchParams } from "next/navigation";
// icons
import { Check, Info } from "lucide-react";
// types
@ -16,6 +16,7 @@ import { CycleListItemAction } from "@/components/cycles/list";
import { generateQueryParams } from "@/helpers/router.helper";
// hooks
import { useCycle } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
import { usePlatformOS } from "@/hooks/use-platform-os";
type TCyclesListItem = {
@ -34,7 +35,7 @@ export const CyclesListItem: FC<TCyclesListItem> = observer((props) => {
// refs
const parentRef = useRef(null);
// router
const router = useRouter();
const router = useAppRouter();
const searchParams = useSearchParams();
const pathname = usePathname();
// hooks

5
web/core/components/cycles/quick-actions.tsx
View file

@ -2,7 +2,7 @@
import { useState } from "react";
import { observer } from "mobx-react";
import { useRouter } from "next/navigation";
// icons
import { ArchiveRestoreIcon, ExternalLink, LinkIcon, Pencil, Trash2 } from "lucide-react";
// ui
@ -16,6 +16,7 @@ import { cn } from "@/helpers/common.helper";
import { copyUrlToClipboard } from "@/helpers/string.helper";
// hooks
import { useCycle, useEventTracker, useUser } from "@/hooks/store";
import { useAppRouter } from "@/hooks/use-app-router";
type Props = {
parentRef: React.RefObject<HTMLElement>;
@ -27,7 +28,7 @@ type Props = {
export const CycleQuickActions: React.FC<Props> = observer((props) => {
const { parentRef, cycleId, projectId, workspaceSlug } = props;
// router
const router = useRouter();
const router = useAppRouter();
// states
const [updateModal, setUpdateModal] = useState(false);
const [archiveCycleModal, setArchiveCycleModal] = useState(false);