From 2876685a4937e0b8afb366abad83619fdd802176 Mon Sep 17 00:00:00 2001
From: Kevin <kevin.c.souza@gmail.com>
Date: Thu, 28 Aug 2025 13:03:29 -0300
Subject: [PATCH 1/5] remake keyresult task into a new more ordened file, fix
 task mythings error

---
 .../KeyResult/Single/Drawer/Body/body.tsx     |   5 +-
 .../ActionButtons/create-task-in-kr.tsx       |   3 +-
 .../Single/Sections/Checklist/checklist.tsx   |   2 +-
 .../Single/Sections/Checklist/wrapper.tsx     |   2 +
 .../KeyResult/Single/Sections/Tasks/index.tsx |  93 ++++++++++++++++
 .../Single/Sections/Tasks/messages.ts         |  53 +++++++++
 .../Single/Sections/Tasks/use-logic.tsx       | 103 ++++++++++++++++++
 7 files changed, 256 insertions(+), 5 deletions(-)
 create mode 100644 src/components/KeyResult/Single/Sections/Tasks/index.tsx
 create mode 100644 src/components/KeyResult/Single/Sections/Tasks/messages.ts
 create mode 100644 src/components/KeyResult/Single/Sections/Tasks/use-logic.tsx

diff --git a/src/components/KeyResult/Single/Drawer/Body/body.tsx b/src/components/KeyResult/Single/Drawer/Body/body.tsx
index 951a3e851..19e95db1b 100644
--- a/src/components/KeyResult/Single/Drawer/Body/body.tsx
+++ b/src/components/KeyResult/Single/Drawer/Body/body.tsx
@@ -19,13 +19,14 @@ import { KeyResult } from 'src/components/KeyResult/types'
 import { keyResultAtomFamily } from 'src/state/recoil/key-result'
 import { keyResultChecklistAtom } from 'src/state/recoil/key-result/checklist'
 
-import { KeyResultChecklistWrapper } from '../../Sections/Checklist/wrapper'
 import { KeyResultHistory } from '../../Sections/KeyResultHistory'
 import { KeyResultProgress } from '../../Sections/Progress/wrapper'
+import { KeyResultTasks } from '../../Sections/Tasks'
 
 import { SCROLLBAR_ID } from './constants'
 import messages from './messages'
 
+
 export interface KeyResultDrawerBodyProperties {
   readonly keyResultID: KeyResult['id']
   readonly isLoading?: boolean
@@ -120,7 +121,7 @@ const KeyResultDrawerBody = ({
             <Divider borderColor="gray.100" />
           </>
         )}
-        <KeyResultChecklistWrapper keyResultID={keyResultID} isLoading={isLoading} />
+        <KeyResultTasks keyResultID={keyResultID} isLoading={isLoading} />
         <Divider borderColor="gray.100" />
         <KeyResultSectionOwner keyResultID={keyResultID} />
         <Divider borderColor="gray.100" />
diff --git a/src/components/KeyResult/Single/Sections/Checklist/ActionButtons/create-task-in-kr.tsx b/src/components/KeyResult/Single/Sections/Checklist/ActionButtons/create-task-in-kr.tsx
index 797eac597..df2dcbacb 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/ActionButtons/create-task-in-kr.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/ActionButtons/create-task-in-kr.tsx
@@ -56,7 +56,6 @@ export const CreateTaskButton = ({
   const { dispatch } = useEvent(EventType.TASK_MANAGER_CREATE_TASK_CLICK)
 
   const keyResult = useRecoilValue(keyResultAtomFamily(keyResultID))
-  const hasData = Boolean(keyResult?.teamId)
 
   const handleNewCheckMark = async (title: NewTask['title']) => {
     if (isSubmitting) return
@@ -115,7 +114,7 @@ export const CreateTaskButton = ({
           />
         </StyledEditableWrapper>
       )}
-      {(teamId ?? hasData) && (
+      {(teamId ?? keyResult) && (
         <Button
           ref={createButtonReference}
           variant="text"
diff --git a/src/components/KeyResult/Single/Sections/Checklist/checklist.tsx b/src/components/KeyResult/Single/Sections/Checklist/checklist.tsx
index 910dce4a6..f1fa50fae 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/checklist.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/checklist.tsx
@@ -55,7 +55,7 @@ export const KeyResultChecklist = ({
         </StyledStack>
       )}
 
-      {canCreate && teamId && (
+      {canCreate && (
         <CreateTaskButton
           mt={5}
           keyResultID={keyResultID}
diff --git a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
index d5f94b75d..3dbddb7b0 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
@@ -97,6 +97,8 @@ export const KeyResultChecklistWrapper = ({
     })
   }, [isFetching, tasks, tasks.length])
 
+  
+
   const handleClose = () => {
     resetOpenDrawer()
     resetTimeline()
diff --git a/src/components/KeyResult/Single/Sections/Tasks/index.tsx b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
new file mode 100644
index 000000000..87cefdc79
--- /dev/null
+++ b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
@@ -0,0 +1,93 @@
+import { Collapse, Stack } from '@chakra-ui/react'
+import React, { useEffect } from 'react'
+import { useIntl } from 'react-intl'
+
+import { IntlLink } from 'src/components/Base'
+
+import { OptionBarWrapper } from '../Checklist/OptionBar/wrapper'
+import { KeyResultChecklist } from '../Checklist/checklist'
+import { ToggleCollapse } from '../Checklist/toggle-collapse'
+import { KeyResultSectionHeading } from '../Heading/wrapper'
+
+import messages from './messages'
+import { useLogic } from './use-logic'
+
+interface KeyResultTasksProperties {
+  keyResultID?: string
+  isLoading?: boolean
+}
+
+export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksProperties) => {
+  const intl = useIntl()
+
+  const {
+    keyResult,
+    progress,
+    tasks,
+    isChecklistOpen,
+    isSuccess,
+    refetch,
+    handleClose,
+    handleChecklistCreation,
+    toggleChecklistCollapse,
+  } = useLogic({
+    keyResultID,
+  })
+
+  useEffect(() => {
+    console.log('abroba', progress)
+  }, [progress])
+
+  return !isLoading && keyResult ? (
+    <Stack spacing={0}>
+      <Stack direction="row" alignItems="flex-start" position="relative">
+        <IntlLink
+          href={
+            keyResult?.teamId && keyResultID
+              ? `/explore/${keyResult?.teamId}?activeTab=tasks&key_result_id__id=${keyResultID}`
+              : '#'
+          }
+          onClick={handleClose}
+        >
+          <span style={{ display: 'flex', alignItems: 'baseline' }}>
+            <KeyResultSectionHeading mt="0.3rem" textDecoration="underline" mr="4px">
+              {intl.formatMessage(messages.heading)}
+            </KeyResultSectionHeading>
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              width="6"
+              height="7"
+              viewBox="0 0 6 7"
+              fill="none"
+            >
+              <path
+                d="M6 0.881836V6.39914H4.9918V2.61911L0.724748 6.88184L0.665866 6.86992L0 6.19621L4.26518 1.89145H0.490787V0.881836H6Z"
+                fill="#525F7F"
+              />
+            </svg>
+          </span>
+        </IntlLink>
+        <OptionBarWrapper
+          keyResultID={keyResultID}
+          progress={progress}
+          canCreate={tasks.length === 0}
+          onCreate={handleChecklistCreation}
+        />
+        {tasks.length > 0 && (
+          <ToggleCollapse isOpen={isChecklistOpen} onToggle={toggleChecklistCollapse} />
+        )}
+      </Stack>
+      {isSuccess ? (
+        <Collapse in={isChecklistOpen}>
+          <KeyResultChecklist
+            nodes={tasks}
+            keyResultID={keyResultID}
+            canCreate={tasks.length > 0}
+            teamId={keyResult?.teamId}
+            onUpdate={refetch}
+          />
+        </Collapse>
+      ) : undefined}
+    </Stack>
+  ) : undefined
+}
diff --git a/src/components/KeyResult/Single/Sections/Tasks/messages.ts b/src/components/KeyResult/Single/Sections/Tasks/messages.ts
new file mode 100644
index 000000000..0a9c5a9a0
--- /dev/null
+++ b/src/components/KeyResult/Single/Sections/Tasks/messages.ts
@@ -0,0 +1,53 @@
+import { defineMessages } from 'react-intl'
+
+type KeyResultsSectionChecklistMessage =
+  | 'heading'
+  | 'collapseButtonDesc'
+  | 'pendingColumnHeading'
+  | 'todoColumnHeading'
+  | 'doingColumnHeading'
+  | 'doneColumnHeading'
+  | 'addTaskButton'
+
+export default defineMessages<KeyResultsSectionChecklistMessage>({
+  heading: {
+    defaultMessage: 'Tarefas',
+    id: 'BQha3x',
+    description: 'This is the title of our checklist section inside the key-result sidebar',
+  },
+
+  collapseButtonDesc: {
+    defaultMessage: 'Uma seta que ao ser clicada expande a checklist deste resultado-chave',
+    id: 'SsQRcF',
+    description:
+      'This message is used by screen readers to explain the collapse icon in our key-result sidebar on the checklist section',
+  },
+  pendingColumnHeading: {
+    defaultMessage: 'pendências',
+    id: 'pD5/TL',
+    description: 'This message appears on header of the pending column',
+  },
+
+  todoColumnHeading: {
+    defaultMessage: 'para fazer',
+    id: 'Sz6ZOB',
+    description: 'This message appears on header of the todo column',
+  },
+
+  doingColumnHeading: {
+    defaultMessage: 'em andamento',
+    id: 'MANxqE',
+    description: 'This message appears on header of the doing column',
+  },
+
+  doneColumnHeading: {
+    defaultMessage: 'concluído',
+    id: 'rw4RIa',
+    description: 'This message appears on header of the done column',
+  },
+  addTaskButton: {
+    defaultMessage: 'nova tarefa',
+    id: 'pfygkg',
+    description: 'This message appears on the add task button',
+  },
+})
diff --git a/src/components/KeyResult/Single/Sections/Tasks/use-logic.tsx b/src/components/KeyResult/Single/Sections/Tasks/use-logic.tsx
new file mode 100644
index 000000000..27f7b50ac
--- /dev/null
+++ b/src/components/KeyResult/Single/Sections/Tasks/use-logic.tsx
@@ -0,0 +1,103 @@
+import { ParsedUrlQuery } from 'querystring'
+
+import { useEffect, useState } from 'react'
+import { useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
+
+import { KeyResult } from 'src/components/KeyResult/types'
+import { useTeamTasksData } from 'src/components/TaskManagement/hooks/new-task/use-get-team-tasks'
+import { TASK_STATUS } from 'src/services/new-task-management/@types/task-status.enum'
+import { Task } from 'src/services/new-task-management/@types/task.type'
+import { keyResultAtomFamily } from 'src/state/recoil/key-result'
+import buildPartialSelector from 'src/state/recoil/key-result/build-partial-selector'
+import {
+  keyResultCheckInCommentEnabled,
+  keyResultCheckInProgressDraft,
+  keyResultLatestCheckIn,
+} from 'src/state/recoil/key-result/check-in'
+import isCheckInModalOpenAtom from 'src/state/recoil/key-result/check-in/is-check-in-modal-open'
+import { draftCheckMarksAtom } from 'src/state/recoil/key-result/checklist'
+import { keyResultReadDrawerOpenedKeyResultID } from 'src/state/recoil/key-result/drawers/read/opened-key-result-id'
+import { isKeyResultListOpenAtom } from 'src/state/recoil/key-result/key-result-list'
+import { createdByCheckInNotificationAtom } from 'src/state/recoil/notifications'
+
+interface useLogicProperties {
+  keyResultID?: string
+}
+
+export const useLogic = ({ keyResultID }: useLogicProperties) => {
+  const [isChecklistOpen, setIsChecklistOpen] = useState(false)
+  const [progress, setProgress] = useState({ total: 0, numberOfDone: 0, progress: 0 })
+
+  // Fetch tasks
+  const {
+    data: tasks = [],
+    isFetching,
+    isSuccess,
+    refetch,
+  } = useTeamTasksData({ key_result_id__id: keyResultID } as ParsedUrlQuery)
+
+  // Refetch tasks after creation
+  const handleChecklistCreation = () => {
+    refetch()
+    if (!isChecklistOpen) setIsChecklistOpen(true)
+  }
+
+  // Change checklist state
+  const toggleChecklistCollapse = () => {
+    setIsChecklistOpen((previous) => !previous)
+  }
+
+  // Effect hooks
+  useEffect(() => {
+    // Calculate progress
+    const numberOfDone = tasks.filter((task: Task) => task.status === TASK_STATUS.done).length
+    if (tasks.length === 0) {
+      setProgress({ total: 0, numberOfDone: 0, progress: 0 })
+    } else {
+      setProgress({
+        total: tasks.length,
+        numberOfDone,
+        progress: (numberOfDone / tasks.length) * 100,
+      })
+    }
+  }, [isFetching, tasks, tasks.length])
+
+  // Global state management
+  const keyResult = useRecoilValue(keyResultAtomFamily(keyResultID))
+
+  // Global state related to the handle close action
+  const timelineSelector = buildPartialSelector<KeyResult['timeline']>('timeline')
+  const resetOpenDrawer = useResetRecoilState(keyResultReadDrawerOpenedKeyResultID)
+  const resetTimeline = useResetRecoilState(timelineSelector(keyResultID))
+  const resetCommentEnabled = useResetRecoilState(keyResultCheckInCommentEnabled(keyResultID))
+  const resetCheckmarkDrafts = useResetRecoilState(draftCheckMarksAtom(keyResultID))
+  const latestKeyResultCheckIn = useRecoilValue(keyResultLatestCheckIn(keyResultID))
+  const setDraftValue = useSetRecoilState(keyResultCheckInProgressDraft(keyResultID))
+  const setIsCheckInModalOpen = useSetRecoilState(isCheckInModalOpenAtom)
+  const setCreatedByNotification = useSetRecoilState(createdByCheckInNotificationAtom)
+  const setHiddingModal = useSetRecoilState(isKeyResultListOpenAtom)
+
+  // Close Key Result Drawer
+  const handleClose = () => {
+    resetOpenDrawer()
+    resetTimeline()
+    resetCommentEnabled()
+    resetCheckmarkDrafts()
+    setDraftValue(latestKeyResultCheckIn?.value)
+    setIsCheckInModalOpen(false)
+    setCreatedByNotification(false)
+    setHiddingModal(false)
+  }
+
+  return {
+    keyResult,
+    progress,
+    tasks,
+    isChecklistOpen,
+    isSuccess,
+    refetch,
+    handleClose,
+    handleChecklistCreation,
+    toggleChecklistCollapse,
+  }
+}

From 06328fbd7b88d21a252e3db28bdb059fcbb67647 Mon Sep 17 00:00:00 2001
From: Kevin <kevin.c.souza@gmail.com>
Date: Thu, 28 Aug 2025 14:56:27 -0300
Subject: [PATCH 2/5] fix lint

---
 src/components/KeyResult/Single/Drawer/Body/body.tsx     | 1 -
 .../KeyResult/Single/Sections/Checklist/wrapper.tsx      | 2 --
 src/components/KeyResult/Single/Sections/Tasks/index.tsx | 9 +++------
 3 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/src/components/KeyResult/Single/Drawer/Body/body.tsx b/src/components/KeyResult/Single/Drawer/Body/body.tsx
index 19e95db1b..52b0c4c1a 100644
--- a/src/components/KeyResult/Single/Drawer/Body/body.tsx
+++ b/src/components/KeyResult/Single/Drawer/Body/body.tsx
@@ -26,7 +26,6 @@ import { KeyResultTasks } from '../../Sections/Tasks'
 import { SCROLLBAR_ID } from './constants'
 import messages from './messages'
 
-
 export interface KeyResultDrawerBodyProperties {
   readonly keyResultID: KeyResult['id']
   readonly isLoading?: boolean
diff --git a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
index 3dbddb7b0..d5f94b75d 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
@@ -97,8 +97,6 @@ export const KeyResultChecklistWrapper = ({
     })
   }, [isFetching, tasks, tasks.length])
 
-  
-
   const handleClose = () => {
     resetOpenDrawer()
     resetTimeline()
diff --git a/src/components/KeyResult/Single/Sections/Tasks/index.tsx b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
index 87cefdc79..e82b105d8 100644
--- a/src/components/KeyResult/Single/Sections/Tasks/index.tsx
+++ b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
@@ -1,5 +1,5 @@
 import { Collapse, Stack } from '@chakra-ui/react'
-import React, { useEffect } from 'react'
+import React from 'react'
 import { useIntl } from 'react-intl'
 
 import { IntlLink } from 'src/components/Base'
@@ -34,10 +34,6 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
     keyResultID,
   })
 
-  useEffect(() => {
-    console.log('abroba', progress)
-  }, [progress])
-
   return !isLoading && keyResult ? (
     <Stack spacing={0}>
       <Stack direction="row" alignItems="flex-start" position="relative">
@@ -89,5 +85,6 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
         </Collapse>
       ) : undefined}
     </Stack>
-  ) : undefined
+  ) : // eslint-disable-next-line unicorn/no-null
+  null
 }

From ad0b3d06bde58f0be6ed89a215a49e7255d1b161 Mon Sep 17 00:00:00 2001
From: Kevin <kevin.c.souza@gmail.com>
Date: Thu, 28 Aug 2025 15:27:49 -0300
Subject: [PATCH 3/5] add skeleton to task section

---
 .../Single/Sections/Checklist/wrapper.tsx     | 25 +++++++++--------
 .../KeyResult/Single/Sections/Tasks/index.tsx | 27 ++++++++++---------
 2 files changed, 28 insertions(+), 24 deletions(-)

diff --git a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
index d5f94b75d..737e37fca 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
@@ -1,6 +1,6 @@
 import { ParsedUrlQuery } from 'querystring'
 
-import { Collapse, Stack } from '@chakra-ui/react'
+import { Collapse, Stack, Skeleton } from '@chakra-ui/react'
 import React, { useEffect, useState } from 'react'
 import { useIntl } from 'react-intl'
 import { useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
@@ -109,7 +109,7 @@ export const KeyResultChecklistWrapper = ({
     setHiddingModal(false)
   }
 
-  return isLoading || hasData ? (
+  return (
     <Stack spacing={0}>
       <Stack direction="row" alignItems="flex-start" position="relative">
         <IntlLink
@@ -138,13 +138,17 @@ export const KeyResultChecklistWrapper = ({
             </svg>
           </span>
         </IntlLink>
-        <OptionBarWrapper
-          keyResultID={keyResultID}
-          progress={progress}
-          canCreate={canCreate}
-          onCreate={handleChecklistCreation}
-        />
-        {hasItems && <ToggleCollapse isOpen={isChecklistOpen} onToggle={toggleChecklistCollapse} />}
+        <Skeleton isLoaded={isLoading}>
+          <OptionBarWrapper
+            keyResultID={keyResultID}
+            progress={progress}
+            canCreate={canCreate}
+            onCreate={handleChecklistCreation}
+          />
+          {hasItems && (
+            <ToggleCollapse isOpen={isChecklistOpen} onToggle={toggleChecklistCollapse} />
+          )}
+        </Skeleton>
       </Stack>
       {isSuccess ? (
         <Collapse in={isChecklistOpen}>
@@ -158,6 +162,5 @@ export const KeyResultChecklistWrapper = ({
         </Collapse>
       ) : undefined}
     </Stack>
-  ) : // eslint-disable-next-line unicorn/no-null
-  null
+  )
 }
diff --git a/src/components/KeyResult/Single/Sections/Tasks/index.tsx b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
index e82b105d8..d1007ed40 100644
--- a/src/components/KeyResult/Single/Sections/Tasks/index.tsx
+++ b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
@@ -1,4 +1,4 @@
-import { Collapse, Stack } from '@chakra-ui/react'
+import { Collapse, Stack, Skeleton } from '@chakra-ui/react'
 import React from 'react'
 import { useIntl } from 'react-intl'
 
@@ -34,7 +34,7 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
     keyResultID,
   })
 
-  return !isLoading && keyResult ? (
+  return (
     <Stack spacing={0}>
       <Stack direction="row" alignItems="flex-start" position="relative">
         <IntlLink
@@ -63,15 +63,17 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
             </svg>
           </span>
         </IntlLink>
-        <OptionBarWrapper
-          keyResultID={keyResultID}
-          progress={progress}
-          canCreate={tasks.length === 0}
-          onCreate={handleChecklistCreation}
-        />
-        {tasks.length > 0 && (
-          <ToggleCollapse isOpen={isChecklistOpen} onToggle={toggleChecklistCollapse} />
-        )}
+        <Skeleton isLoaded={!isLoading} w="100%" display="flex">
+          <OptionBarWrapper
+            keyResultID={keyResultID}
+            progress={progress}
+            canCreate={tasks.length === 0}
+            onCreate={handleChecklistCreation}
+          />
+          {tasks.length > 0 && (
+            <ToggleCollapse isOpen={isChecklistOpen} onToggle={toggleChecklistCollapse} />
+          )}
+        </Skeleton>
       </Stack>
       {isSuccess ? (
         <Collapse in={isChecklistOpen}>
@@ -85,6 +87,5 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
         </Collapse>
       ) : undefined}
     </Stack>
-  ) : // eslint-disable-next-line unicorn/no-null
-  null
+  )
 }

From 66e09cdde83e9675eb9cfe3335d4d9906d6ad765 Mon Sep 17 00:00:00 2001
From: Kevin <kevin.c.souza@gmail.com>
Date: Thu, 28 Aug 2025 15:31:35 -0300
Subject: [PATCH 4/5] fix skeleton position

---
 src/components/KeyResult/Single/Sections/Tasks/index.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/KeyResult/Single/Sections/Tasks/index.tsx b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
index d1007ed40..e0ef99cbd 100644
--- a/src/components/KeyResult/Single/Sections/Tasks/index.tsx
+++ b/src/components/KeyResult/Single/Sections/Tasks/index.tsx
@@ -36,7 +36,12 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
 
   return (
     <Stack spacing={0}>
-      <Stack direction="row" alignItems="flex-start" position="relative">
+      <Stack
+        direction="row"
+        alignItems="flex-start"
+        position="relative"
+        justifyContent="space-between"
+      >
         <IntlLink
           href={
             keyResult?.teamId && keyResultID
@@ -63,7 +68,7 @@ export const KeyResultTasks = ({ keyResultID, isLoading }: KeyResultTasksPropert
             </svg>
           </span>
         </IntlLink>
-        <Skeleton isLoaded={!isLoading} w="100%" display="flex">
+        <Skeleton isLoaded={!isLoading} display="flex">
           <OptionBarWrapper
             keyResultID={keyResultID}
             progress={progress}

From 0fdb140cbd72d9c486c4a49a64d8eda22a24e260 Mon Sep 17 00:00:00 2001
From: Kevin <kevin.c.souza@gmail.com>
Date: Thu, 28 Aug 2025 15:39:37 -0300
Subject: [PATCH 5/5] fix lint

---
 src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
index 737e37fca..e7f9feb0e 100644
--- a/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
+++ b/src/components/KeyResult/Single/Sections/Checklist/wrapper.tsx
@@ -58,7 +58,6 @@ export const KeyResultChecklistWrapper = ({
   const intl = useIntl()
 
   const keyResult = useRecoilValue(keyResultAtomFamily(keyResultID))
-  const hasData = Boolean(keyResult?.teamId)
 
   const toggleChecklistCollapse = () => {
     setIsChecklistOpen((previous) => !previous)