Merge pull request #4259 from JoinColony/fix/4104-description-tooltip

fix: remove the description form row tooltip
JoinColony · Feb 7, 2025 · 3d0cc98 · 3d0cc98
2 parents 509badd + 7cf87b6
commit 3d0cc98
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 46 deletions.
diff --git a/src/components/v5/common/ActionSidebar/partials/Description/Description.tsx b/src/components/v5/common/ActionSidebar/partials/Description/Description.tsx
@@ -24,14 +24,6 @@ const Description: FC<DescriptionProps> = ({
     <ActionFormRow
       icon={Pencil}
       fieldName={DESCRIPTION_FIELD_NAME}
-      tooltips={{
-        label: {
-          placement: 'bottom-start',
-          tooltipContent: formatText({
-            id: 'actionSidebar.tooltip.description',
-          }),
-        },
-      }}
       title={formatText({ id: 'actionSidebar.description' })}
       isExpandable={!(disabled || hasNoDecisionMethods)}
       isDisabled={disabled || hasNoDecisionMethods}

diff --git a/src/components/v5/common/CompletedAction/partials/rows/Description.tsx b/src/components/v5/common/CompletedAction/partials/rows/Description.tsx
@@ -2,9 +2,7 @@ import { CaretRight, Pencil } from '@phosphor-icons/react';
 import clsx from 'clsx';
 import DOMPurify from 'dompurify';
 import React, { useState } from 'react';
-import { defineMessages } from 'react-intl';
 
-import Tooltip from '~shared/Extensions/Tooltip/index.ts';
 import { formatText } from '~utils/intl.ts';
 import { ICON_SIZE } from '~v5/common/CompletedAction/consts.ts';
 import RichTextDisplay from '~v5/shared/RichTextDisplay/index.ts';
@@ -18,14 +16,6 @@ interface DescriptionRowProps {
 
 const SHORT_DESCRIPTION_CHAR_LIMIT = 180;
 
-const MSG = defineMessages({
-  descriptionTooltip: {
-    id: `${displayName}.descriptionTooltip`,
-    defaultMessage:
-      'The description for why this action is being performed including any relevant details.',
-  },
-});
-
 // @NOTE this is pretty hacky with the arbitrary limit and DOMPurify sanitization
 // it's also outside the grid, since it changes from a row to a column
 const DescriptionRow = ({
@@ -54,34 +44,29 @@ const DescriptionRow = ({
         'flex-col': isExpanded,
       })}
     >
-      <Tooltip
-        placement="bottom-start"
-        tooltipContent={formatText(MSG.descriptionTooltip)}
-      >
-        <div className="w-40 flex-shrink-0 sm:w-[12.5rem]">
-          <button
-            className="flex items-center hover:text-blue-400"
-            type="button"
-            onClick={() => {
-              setIsExpanded((previousExpanded) => !previousExpanded);
-            }}
-          >
-            <Pencil size={ICON_SIZE} />
-            <span className="ml-2 mr-1">
-              {formatText({ id: 'actionSidebar.description' })}
-            </span>
-            <CaretRight
-              size={12}
-              className={clsx(
-                'rotate-0 transition-transform duration-300 ease-in-out',
-                {
-                  'rotate-90': isExpanded,
-                },
-              )}
-            />
-          </button>
-        </div>
-      </Tooltip>
+      <div className="w-40 flex-shrink-0 sm:w-[12.5rem]">
+        <button
+          className="flex items-center hover:text-blue-400"
+          type="button"
+          onClick={() => {
+            setIsExpanded((previousExpanded) => !previousExpanded);
+          }}
+        >
+          <Pencil size={ICON_SIZE} />
+          <span className="ml-2 mr-1">
+            {formatText({ id: 'actionSidebar.description' })}
+          </span>
+          <CaretRight
+            size={12}
+            className={clsx(
+              'rotate-0 transition-transform duration-300 ease-in-out',
+              {
+                'rotate-90': isExpanded,
+              },
+            )}
+          />
+        </button>
+      </div>
       <div
         className={clsx('flex items-start', {
           'h-10 flex-1 cursor-pointer': !isExpanded,