fix: merge conflicts resolved from preview

makeplane · Jul 19, 2024 · 0d9b346 · 0d9b346
2 parents d80ab7e + 075b8ef
commit 0d9b346
Show file tree

Hide file tree

Showing 99 changed files with 1,510 additions and 755 deletions.
diff --git a/apiserver/requirements/base.txt b/apiserver/requirements/base.txt
@@ -26,7 +26,7 @@ django-filter==24.2
 # json model
 jsonmodels==2.7.0
 # sentry
-sentry-sdk==2.0.1
+sentry-sdk==2.8.0
 # storage
 django-storages==1.14.2
 # user management

diff --git a/packages/editor/src/core/extensions/code-inline/index.tsx b/packages/editor/src/core/extensions/code-inline/index.tsx
@@ -33,7 +33,7 @@ export const CustomCodeInlineExtension = Mark.create<CodeOptions>({
     return {
       HTMLAttributes: {
         class:
-          "rounded bg-custom-background-80 px-1 py-[2px] font-mono font-medium text-orange-500 border-[0.5px] border-custom-border-200",
+          "rounded bg-custom-background-80 px-[6px] py-[1.5px] font-mono font-medium text-orange-500 border-[0.5px] border-custom-border-200",
         spellcheck: "false",
       },
     };

diff --git a/packages/editor/src/core/extensions/code/code-block-node-view.tsx b/packages/editor/src/core/extensions/code/code-block-node-view.tsx
@@ -40,9 +40,9 @@ export const CodeBlockComponent: React.FC<CodeBlockComponentProps> = ({ node })
         <button
           type="button"
           className={cn(
-            "group/button hidden group-hover/code:flex items-center justify-center absolute top-2 right-2 z-10 size-8 rounded-md bg-custom-background-80 border border-custom-border-200 transition duration-150 ease-in-out",
+            "group/button hidden group-hover/code:flex items-center justify-center absolute top-2 right-2 z-10 size-8 rounded-md bg-custom-background-80 border border-custom-border-200 transition duration-150 ease-in-out backdrop-blur-sm",
             {
-              "bg-green-500/10 hover:bg-green-500/10 active:bg-green-500/10": copied,
+              "bg-green-500/30 hover:bg-green-500/30 active:bg-green-500/30": copied,
             }
           )}
           onClick={copyToClipboard}
@@ -55,7 +55,7 @@ export const CodeBlockComponent: React.FC<CodeBlockComponentProps> = ({ node })
         </button>
       </Tooltip>
 
-      <pre className="bg-custom-background-90 text-custom-text-100 rounded-lg p-8 pl-9 pr-4">
+      <pre className="bg-custom-background-90 text-custom-text-100 rounded-lg p-4 my-2">
         <NodeViewContent as="code" className="whitespace-[pre-wrap]" />
       </pre>
     </NodeViewWrapper>

diff --git a/packages/types/src/issues/activity/base.d.ts b/packages/types/src/issues/activity/base.d.ts
@@ -55,4 +55,9 @@ export type TIssueActivityComment =
       id: string;
       activity_type: "ACTIVITY";
       created_at?: string;
+    }
+  | {
+      id: string;
+      activity_type: "WORKLOG";
+      created_at?: string;
     };
diff --git a/packages/types/src/workspace.d.ts b/packages/types/src/workspace.d.ts
@@ -69,6 +69,13 @@ export interface IWorkspaceMember {
   id: string;
   member: IUserLite;
   role: EUserWorkspaceRoles;
+  created_at?: string;
+  avatar?: string;
+  email?: string;
+  first_name?: string;
+  last_name?: string;
+  joining_date?: string;
+  display_name?: string;
 }
 
 export interface IWorkspaceMemberMe {

diff --git a/packages/ui/src/dropdowns/custom-select.tsx b/packages/ui/src/dropdowns/custom-select.tsx
@@ -82,11 +82,16 @@ const CustomSelect = (props: ICustomSelectProps) => {
             <button
               ref={setReferenceElement}
               type="button"
-              className={`flex w-full items-center justify-between gap-1 rounded border-[0.5px] border-custom-border-300 ${
-                input ? "px-3 py-2 text-sm" : "px-2 py-1 text-xs"
-              } ${
-                disabled ? "cursor-not-allowed text-custom-text-200" : "cursor-pointer hover:bg-custom-background-80"
-              } ${buttonClassName}`}
+              className={cn(
+                "flex w-full items-center justify-between gap-1 rounded border-[0.5px] border-custom-border-300",
+                {
+                  "px-3 py-2 text-sm": input,
+                  "px-2 py-1 text-xs": !input,
+                  "cursor-not-allowed text-custom-text-200": disabled,
+                  "cursor-pointer hover:bg-custom-background-80": !disabled,
+                },
+                buttonClassName
+              )}
               onClick={toggleDropdown}
             >
               {label}

diff --git a/packages/ui/src/icons/index.ts b/packages/ui/src/icons/index.ts
@@ -23,3 +23,4 @@ export * from "./transfer-icon";
 export * from "./info-icon";
 export * from "./dropdown-icon";
 export * from "./intake";
+export * from "./user-activity-icon";
diff --git a/packages/ui/src/icons/user-activity-icon.tsx b/packages/ui/src/icons/user-activity-icon.tsx
@@ -0,0 +1,21 @@
+import * as React from "react";
+
+import { ISvgIcons } from "./type";
+
+export const UserActivityIcon: React.FC<ISvgIcons> = ({ className = "text-current", ...rest }) => (
+  <svg
+    viewBox="0 0 24 24"
+    className={`${className} stroke-2`}
+    stroke="currentColor"
+    fill="none"
+    strokeWidth="1.5"
+    xmlns="http://www.w3.org/2000/svg"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...rest}
+  >
+    <path d="M10.5 13C12.9853 13 15 10.9853 15 8.5C15 6.01472 12.9853 4 10.5 4C8.01472 4 6 6.01472 6 8.5C6 10.9853 8.01472 13 10.5 13Z" />
+    <path d="M13.9062 13.5903C12.8368 13.1001 11.661 12.8876 10.4877 12.9725C9.31437 13.0574 8.18144 13.437 7.19379 14.0761C6.20613 14.7152 5.39567 15.5931 4.83744 16.6286C4.2792 17.6641 3.99124 18.8237 4.0002 20" />
+    <path d="M21 16.5H19.6L18.2 20L16.8 13L15.4 16.5H14" />
+  </svg>
+);
diff --git a/packages/ui/src/modals/constants.ts b/packages/ui/src/modals/constants.ts
@@ -8,4 +8,6 @@ export enum EModalWidth {
   XXL = "sm:max-w-2xl",
   XXXL = "sm:max-w-3xl",
   XXXXL = "sm:max-w-4xl",
+  VXL = "sm:max-w-5xl",
+  VIXL = "sm:max-w-6xl",
 }
diff --git a/packages/ui/src/modals/modal-core.tsx b/packages/ui/src/modals/modal-core.tsx
@@ -11,9 +11,17 @@ type Props = {
   isOpen: boolean;
   position?: EModalPosition;
   width?: EModalWidth;
+  className?: string;
 };
 export const ModalCore: React.FC<Props> = (props) => {
-  const { children, handleClose, isOpen, position = EModalPosition.CENTER, width = EModalWidth.XXL } = props;
+  const {
+    children,
+    handleClose,
+    isOpen,
+    position = EModalPosition.CENTER,
+    width = EModalWidth.XXL,
+    className = "",
+  } = props;
 
   return (
     <Transition.Root show={isOpen} as={Fragment}>
@@ -44,7 +52,8 @@ export const ModalCore: React.FC<Props> = (props) => {
               <Dialog.Panel
                 className={cn(
                   "relative transform rounded-lg bg-custom-background-100 text-left shadow-custom-shadow-md transition-all w-full",
-                  width
+                  width,
+                  className
                 )}
               >
                 {children}

diff --git a/packages/ui/src/popovers/popover-menu.tsx b/packages/ui/src/popovers/popover-menu.tsx
@@ -12,8 +12,10 @@ export const PopoverMenu = <T,>(props: TPopoverMenu<T>) => {
     popperPadding = 0,
     buttonClassName = "",
     button,
+    disabled,
     panelClassName = "",
     data,
+    popoverClassName = "",
     keyExtractor,
     render,
   } = props;
@@ -24,10 +26,12 @@ export const PopoverMenu = <T,>(props: TPopoverMenu<T>) => {
       popperPadding={popperPadding}
       buttonClassName={buttonClassName}
       button={button}
+      disabled={disabled}
       panelClassName={cn(
         "my-1 w-48 rounded border-[0.5px] border-custom-border-300 bg-custom-background-100 px-2 py-2 text-xs shadow-custom-shadow-rg focus:outline-none",
         panelClassName
       )}
+      popoverClassName={popoverClassName}
     >
       <Fragment>
         {data.map((item, index) => (

diff --git a/packages/ui/src/popovers/popover.tsx b/packages/ui/src/popovers/popover.tsx
@@ -12,7 +12,9 @@ export const Popover = (props: TPopover) => {
     popperPosition = "bottom-end",
     popperPadding = 0,
     buttonClassName = "",
+    popoverClassName = "",
     button,
+    disabled = false,
     panelClassName = "",
     children,
   } = props;
@@ -34,20 +36,19 @@ export const Popover = (props: TPopover) => {
   });
 
   return (
-    <HeadlessReactPopover className="relative flex h-full w-full items-center justify-center">
-      <HeadlessReactPopover.Button ref={setReferenceElement} className="flex justify-center items-center">
-        {button ? (
-          button
-        ) : (
-          <div
-            className={cn(
-              "flex justify-center items-center text-base h-6 w-6 rounded transition-all bg-custom-background-90 hover:bg-custom-background-80",
-              buttonClassName
-            )}
-          >
-            <EllipsisVertical className="h-3 w-3" />
-          </div>
+    <HeadlessReactPopover className={cn("relative flex h-full w-full items-center justify-center", popoverClassName)}>
+      <HeadlessReactPopover.Button
+        ref={setReferenceElement}
+        className={cn(
+          {
+            "flex justify-center items-center text-base h-6 w-6 rounded transition-all bg-custom-background-90 hover:bg-custom-background-80":
+              !button,
+          },
+          buttonClassName
         )}
+        disabled={disabled}
+      >
+        {button ? button : <EllipsisVertical className="h-3 w-3" />}
       </HeadlessReactPopover.Button>
 
       <Transition

diff --git a/packages/ui/src/popovers/types.ts b/packages/ui/src/popovers/types.ts
@@ -5,6 +5,7 @@ export type TPopoverButtonDefaultOptions = {
   // button and button styling
   button?: ReactNode;
   buttonClassName?: string;
+  disabled?: boolean;
 };
 
 export type TPopoverDefaultOptions = TPopoverButtonDefaultOptions & {
@@ -13,6 +14,7 @@ export type TPopoverDefaultOptions = TPopoverButtonDefaultOptions & {
   popperPadding?: number | undefined;
   // panel styling
   panelClassName?: string;
+  popoverClassName?: string;
 };
 
 export type TPopover = TPopoverDefaultOptions & {

diff --git a/packages/ui/src/tables/table.tsx b/packages/ui/src/tables/table.tsx
@@ -29,7 +29,7 @@ export const Table = <T,>(props: TTableData<T>) => {
           ))}
         </tr>
       </thead>
-      <tbody className={cn("divide-y divide-x divide-custom-border-200", tBodyClassName)}>
+      <tbody className={cn("divide-y divide-custom-border-200", tBodyClassName)}>
         {data.map((item) => (
           <tr
             key={keyExtractor(item)}

diff --git a/turbo.json b/turbo.json
@@ -23,7 +23,10 @@
     "SENTRY_PROJECT_ID",
     "NEXT_PUBLIC_SENTRY_ENVIRONMENT",
     "NEXT_PUBLIC_SENTRY_DSN",
-    "SENTRY_MONITORING_ENABLED"
+    "SENTRY_MONITORING_ENABLED",
+    "NEXT_PUBLIC_PRO_PLAN_MONTHLY_PAYMENT_URL",
+    "NEXT_PUBLIC_PRO_PLAN_YEARLY_PAYMENT_URL",
+    "NEXT_PUBLIC_PLANE_ONE_PAYMENT_URL"
   ],
   "tasks": {
     "build": {

diff --git a/web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx b/web/app/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
@@ -7,13 +7,14 @@ import { FileText } from "lucide-react";
 // types
 import { TLogoProps } from "@plane/types";
 // ui
-import { Breadcrumbs, EmojiIconPicker, EmojiIconPickerTypes, TOAST_TYPE, setToast } from "@plane/ui";
+import { Breadcrumbs, EmojiIconPicker, EmojiIconPickerTypes, TOAST_TYPE, Tooltip, setToast } from "@plane/ui";
 // components
 import { BreadcrumbLink, Logo } from "@/components/common";
 // helpers
 import { convertHexEmojiToDecimal } from "@/helpers/emoji.helper";
 // hooks
 import { usePage, useProject } from "@/hooks/store";
+import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web components
 import { PageDetailsHeaderExtraActions } from "@/plane-web/components/pages";
 
@@ -29,6 +30,8 @@ export const PageDetailsHeader = observer(() => {
   // store hooks
   const { currentProjectDetails, loader } = useProject();
   const { name, logo_props, updatePageLogo } = usePage(pageId?.toString() ?? "");
+  // use platform
+  const { isMobile } = usePlatformOS();
 
   const handlePageLogoUpdate = async (data: TLogoProps) => {
     if (data) {
@@ -95,49 +98,57 @@ export const PageDetailsHeader = observer(() => {
             <Breadcrumbs.BreadcrumbItem
               type="text"
               link={
-                <BreadcrumbLink
-                  label={name ?? "Page"}
-                  icon={
-                    <EmojiIconPicker
-                      isOpen={isOpen}
-                      handleToggle={(val: boolean) => setIsOpen(val)}
-                      className="flex items-center justify-center"
-                      buttonClassName="flex items-center justify-center"
-                      label={
-                        <>
-                          {logo_props?.in_use ? (
-                            <Logo logo={logo_props} size={16} type="lucide" />
-                          ) : (
-                            <FileText className="h-4 w-4 text-custom-text-300" />
-                          )}
-                        </>
-                      }
-                      onChange={(val) => {
-                        let logoValue = {};
+                <li className="flex items-center space-x-2" tabIndex={-1}>
+                  <div className="flex flex-wrap items-center gap-2.5">
+                    <div className="flex cursor-default items-center gap-1 text-sm font-medium text-custom-text-100">
+                      <div className="flex h-5 w-5 items-center justify-center overflow-hidden">
+                        <EmojiIconPicker
+                          isOpen={isOpen}
+                          handleToggle={(val: boolean) => setIsOpen(val)}
+                          className="flex items-center justify-center"
+                          buttonClassName="flex items-center justify-center"
+                          label={
+                            <>
+                              {logo_props?.in_use ? (
+                                <Logo logo={logo_props} size={16} type="lucide" />
+                              ) : (
+                                <FileText className="h-4 w-4 text-custom-text-300" />
+                              )}
+                            </>
+                          }
+                          onChange={(val) => {
+                            let logoValue = {};
 
-                        if (val?.type === "emoji")
-                          logoValue = {
-                            value: convertHexEmojiToDecimal(val.value.unified),
-                            url: val.value.imageUrl,
-                          };
-                        else if (val?.type === "icon") logoValue = val.value;
+                            if (val?.type === "emoji")
+                              logoValue = {
+                                value: convertHexEmojiToDecimal(val.value.unified),
+                                url: val.value.imageUrl,
+                              };
+                            else if (val?.type === "icon") logoValue = val.value;
 
-                        handlePageLogoUpdate({
-                          in_use: val?.type,
-                          [val?.type]: logoValue,
-                        }).finally(() => setIsOpen(false));
-                      }}
-                      defaultIconColor={
-                        logo_props?.in_use && logo_props.in_use === "icon" ? logo_props?.icon?.color : undefined
-                      }
-                      defaultOpen={
-                        logo_props?.in_use && logo_props?.in_use === "emoji"
-                          ? EmojiIconPickerTypes.EMOJI
-                          : EmojiIconPickerTypes.ICON
-                      }
-                    />
-                  }
-                />
+                            handlePageLogoUpdate({
+                              in_use: val?.type,
+                              [val?.type]: logoValue,
+                            }).finally(() => setIsOpen(false));
+                          }}
+                          defaultIconColor={
+                            logo_props?.in_use && logo_props.in_use === "icon" ? logo_props?.icon?.color : undefined
+                          }
+                          defaultOpen={
+                            logo_props?.in_use && logo_props?.in_use === "emoji"
+                              ? EmojiIconPickerTypes.EMOJI
+                              : EmojiIconPickerTypes.ICON
+                          }
+                        />
+                      </div>
+                      <Tooltip tooltipContent={name ?? "Page"} position="bottom" isMobile={isMobile}>
+                        <div className="relative line-clamp-1 block max-w-[150px] overflow-hidden truncate">
+                          {name ?? "Page"}
+                        </div>
+                      </Tooltip>
+                    </div>
+                  </div>
+                </li>
               }
             />
           </Breadcrumbs>