Merge pull request #266 from memser-spaceport/feat/text-editor

fix: show less icon fix

components/page/member-details/bio.tsx

@@ -9,6 +9,7 @@ import Cookies from 'js-cookie';
 import { toast } from 'react-toastify';
 import { updateMember } from '@/services/members.service';
 import { ADMIN_ROLE } from '@/utils/constants';
+import Image from 'next/image';
 
 const Bio = ({ member, userInfo }: { member: any; userInfo: any }) => {
   const contentLength = 347;
@@ -121,11 +122,17 @@ const Bio = ({ member, userInfo }: { member: any; userInfo: any }) => {
             {content?.length > clippedContent?.length && (
               <button className="bioCn__content__show-more" onClick={onShowMoreClickHandler}>
                 show more{' '}
+                <span className="bioCn__content__show-more__icon">
+                      <Image src="/icons/chevron-up.svg" alt="Edit" height={12} width={12} />
+                    </span>
               </button>
             )}
             {content?.length > contentLength && content === clippedContent && (
               <button className="bioCn__content__show-less" onClick={onShowLessClickHandler}>
                 show less
+                <span className="bioCn__content__show-more__icon">
+                      <Image src="/icons/showless.svg" alt="Edit" height={12} width={12} />
+                    </span>
               </button>
             )}
           </div>
@@ -191,6 +198,14 @@ const Bio = ({ member, userInfo }: { member: any; userInfo: any }) => {
           align-items: center;
           padding-bottom: 16px;
         }
+          .bioCn__content__show-more__icon {
+            top: 2px;
+            position: relative;
+            width: 12px;
+            height: 12px;
+            display: inline-block;
+            margin-left: 4px;
+          }
 
         @media (min-width: 1024px) {
           .bioCn {

components/page/project-details/description.tsx

@@ -63,6 +63,7 @@ const Description = (props: IDescription) => {
       const res = await updateProject(project?.id, { ...project,description: description }, authToken);
       if (res.status === 200 || res.status === 201) {
         setDescription(description);
+        setDesc(getContent(description));
         triggerLoader(false);
         toast.success('Description updated successfully.');
         analytics.recordDescSave('save-success', getAnalyticsUserInfo(props?.user), { ...project,description: description });
@@ -111,6 +112,9 @@ const Description = (props: IDescription) => {
                 <span>
                   <button className="desc__content__show-more" onClick={onShowMoreClickHandler}>
                     show more{' '}
+                    <span className="desc__content__show-more__icon">
+                      <Image src="/icons/chevron-up.svg" alt="Edit" height={12} width={12} />
+                    </span>
                   </button>
                 </span>
               )}
@@ -119,6 +123,9 @@ const Description = (props: IDescription) => {
                   &nbsp;
                   <button className="desc__content__show-less" onClick={onShowLessClickHandler}>
                     show less
+                    <span className="desc__content__show-more__icon">
+                      <Image src="/icons/showless.svg" alt="Edit" height={12} width={12} />
+                    </span>
                   </button>
                 </span>
               )}
@@ -169,6 +176,14 @@ const Description = (props: IDescription) => {
           word-break: break-word;
         }
 
+        .desc__content__show-more__icon {
+            top: 2px;
+            position: relative;
+            width: 12px;
+            height: 12px;
+            display: inline-block;
+            margin-left: 4px;
+          }
         .desc__content__show-more {
           color: #156ff7;
           font-size: 14px;

components/page/team-details/about.tsx

@@ -85,7 +85,7 @@ const About = (props: IAbout) => {
       analytics.recordAboutSave('save-error', getAnalyticsUserInfo(userInfo), payload);
     } else {
       setAboutContent(aboutEditedContent);
-      setAbout(getContent(aboutContent));
+      setAbout(getContent(aboutEditedContent));
       toast.success('Team updated successfully');
       analytics.recordAboutSave('save-success', getAnalyticsUserInfo(userInfo), payload);
     }
@@ -125,6 +125,9 @@ const About = (props: IAbout) => {
                 <span>
                   <button className="about__content__show-more" onClick={onShowMoreClickHandler}>
                     show more
+                    <span className="about__content__show-more__icon">
+                      <Image src="/icons/chevron-up.svg" alt="Edit" height={12} width={12} />
+                    </span>
                   </button>
                 </span>
               )}
@@ -133,6 +136,9 @@ const About = (props: IAbout) => {
                   &nbsp;
                   <button className="about__content__show-less" onClick={onShowLessClickHandler}>
                     show less
+                    <span className="about__content__show-more__icon">
+                      <Image src="/icons/showless.svg" alt="Edit" height={12} width={12} />
+                    </span>
                   </button>
                 </span>
               )}
@@ -179,6 +185,15 @@ const About = (props: IAbout) => {
             gap: 8px;
           }
 
+          .about__content__show-more__icon {
+            top: 2px;
+            position: relative;
+            width: 12px;
+            height: 12px;
+            display: inline-block;
+            margin-left: 4px;
+          }
+
           .about__content {
             color: #0f172a;
             font-size: 15px;
@@ -199,7 +214,7 @@ const About = (props: IAbout) => {
 
           .about__content__show-less {
             color: #156ff7;
-             font-size: 14px;
+            font-size: 14px;
             font-weight: 500;
             line-height: 14px;
             padding: 0;