fix: new sticky color + recent sticky api call + sticky max height (#6438)

web/core/components/stickies/sticky/inputs.tsx

@@ -12,7 +12,7 @@ import { useWorkspace } from "@/hooks/store";
 import { StickyEditor } from "../../editor";
 
 type TProps = {
-  stickyData: TSticky | undefined;
+  stickyData: Partial<TSticky> | undefined;
   workspaceSlug: string;
   handleUpdate: (payload: Partial<TSticky>) => void;
   stickyId: string | undefined;

web/core/components/stickies/sticky/root.tsx

@@ -12,7 +12,7 @@ import { useSticky } from "@/hooks/use-stickies";
 import { STICKY_COLORS_LIST } from "../../editor/sticky-editor/color-palette";
 import { StickyDeleteModal } from "../delete-modal";
 import { StickyInput } from "./inputs";
-import { useStickyOperations } from "./use-operations";
+import { getRandomStickyColor, useStickyOperations } from "./use-operations";
 
 type TProps = {
   onClose?: () => void;
@@ -33,7 +33,7 @@ export const StickyNote = observer((props: TProps) => {
   // sticky operations
   const { stickyOperations } = useStickyOperations({ workspaceSlug });
   // derived values
-  const stickyData = stickyId ? stickies[stickyId] : undefined;
+  const stickyData: Partial<TSticky> = stickyId ? stickies[stickyId] : { background_color: getRandomStickyColor() };
   // const isStickiesPage = pathName?.includes("stickies");
   const backgroundColor =
     STICKY_COLORS_LIST.find((c) => c.key === stickyData?.background_color)?.backgroundColor ||
@@ -45,6 +45,7 @@ export const StickyNote = observer((props: TProps) => {
         await stickyOperations.update(stickyId, payload);
       } else {
         await stickyOperations.create({
+          ...stickyData,
           ...payload,
         });
       }
@@ -73,7 +74,7 @@ export const StickyNote = observer((props: TProps) => {
         handleClose={() => setIsDeleteModalOpen(false)}
       />
       <div
-        className={cn("w-full flex flex-col h-fit rounded p-4 group/sticky", className)}
+        className={cn("w-full flex flex-col h-fit rounded p-4 group/sticky max-h-[650px] overflow-y-scroll", className)}
         style={{
           backgroundColor,
         }}

web/core/services/sticky.service.ts

@@ -21,12 +21,13 @@ export class StickyService extends APIService {
   async getStickies(
     workspaceSlug: string,
     cursor: string,
-    query?: string
+    query?: string,
+    per_page?: number
   ): Promise<{ results: TSticky[]; total_pages: number }> {
     return this.get(`/api/workspaces/${workspaceSlug}/stickies/`, {
       params: {
         cursor,
-        per_page: STICKIES_PER_PAGE,
+        per_page: per_page || STICKIES_PER_PAGE,
         query,
       },
     })

web/core/store/sticky/sticky.store.ts

@@ -96,7 +96,7 @@ export class StickyStore implements IStickyStore {
   };
 
   fetchRecentSticky = async (workspaceSlug: string) => {
-    const response = await this.stickyService.getStickies(workspaceSlug, "1:0:0");
+    const response = await this.stickyService.getStickies(workspaceSlug, "1:0:0", undefined, 1);
     runInAction(() => {
       this.recentStickyId = response.results[0]?.id;
       this.stickies[response.results[0]?.id] = response.results[0];