Revert "remove redundancy from orgPostCard (PalisadoesFoundation#906)" (

PalisadoesFoundation#910) This reverts commit d5ce4aa.
Sumitmaithani · May 1, 2023 · b3d7cce · b3d7cce
1 parent d5ce4aa
commit b3d7cce
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 42 deletions.
diff --git a/src/components/OrgPostCard/OrgPostCard.test.tsx b/src/components/OrgPostCard/OrgPostCard.test.tsx
@@ -112,7 +112,7 @@ describe('Testing Organization Post Card', () => {
     expect(screen.getByText(props.postVideo)).toBeInTheDocument();
   });
 
-  test('Testing  post update functionality', async () => {
+  test('Testing post update functionality', async () => {
     render(
       <MockedProvider addTypename={false} link={link}>
         <I18nextProvider i18n={i18nForTest}>
@@ -156,15 +156,15 @@ describe('Testing Organization Post Card', () => {
 
     const toggleButton = screen.getByTestId('toggleBtn');
 
-    expect(screen.getByText('Hide')).toBeInTheDocument();
+    expect(screen.getByText('Read more')).toBeInTheDocument();
 
     fireEvent.click(toggleButton);
 
-    expect(screen.getByText('Read More')).toBeInTheDocument();
+    expect(screen.getByText('hide')).toBeInTheDocument();
 
     fireEvent.click(toggleButton);
 
-    expect(screen.getByText('Hide')).toBeInTheDocument();
+    expect(screen.getByText('Read more')).toBeInTheDocument();
   });
 
   test('should toggle post content', () => {
@@ -191,15 +191,15 @@ describe('Testing Organization Post Card', () => {
     expect(
       screen.getByText('Lorem ipsum dolor sit amet, consectetur ...')
     ).toBeInTheDocument();
-    expect(toggleBtn).toHaveTextContent('Read More');
+    expect(toggleBtn).toHaveTextContent('Read more');
     expect(toggleBtn).toHaveClass(mockedStyles.toggleClickBtn);
 
     fireEvent.click(toggleBtn);
 
-    expect(screen.getByTestId('PostInfo').innerHTML).toEqual(
+    expect(screen.getByTestId('toggleContent').innerHTML).toEqual(
       'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'
     );
-    expect(toggleBtn).toHaveTextContent('Hide');
+    expect(toggleBtn).toHaveTextContent('hide');
     expect(toggleBtn).toHaveClass(mockedStyles.toggleClickBtn);
   });
 

diff --git a/src/components/OrgPostCard/OrgPostCard.tsx b/src/components/OrgPostCard/OrgPostCard.tsx
@@ -8,6 +8,7 @@ import {
   UPDATE_POST_MUTATION,
 } from 'GraphQl/Mutations/mutations';
 import { useTranslation } from 'react-i18next';
+import defaultImg from 'assets/third_image.png';
 import { errorHandler } from 'utils/errorHandler';
 
 interface OrgPostCardProps {
@@ -26,30 +27,14 @@ function OrgPostCard(props: OrgPostCardProps): JSX.Element {
     postinfo: '',
   });
 
-  const [showMoreInfo, setShowMoreInfo] = useState<boolean>(false);
-
-  const initialSlice = () => {
-    if (!props.postPhoto) {
-      // post photo do  not exist
-      setShowMoreInfo(true);
-      return props.postInfo;
-    } else if (props.postInfo.length > 50) {
-      return props.postInfo.substring(0, 40);
-    } else {
-      setShowMoreInfo(true);
-      return props.postInfo;
-    }
-  };
-
-  const [slicedMoreInfo, setSlicedMoreInfo] = useState<string>(initialSlice);
+  const [togglePost, setPostToggle] = useState('Read more');
 
   function handletoggleClick() {
-    if (!showMoreInfo) {
-      setSlicedMoreInfo(props.postInfo);
+    if (togglePost === 'Read more') {
+      setPostToggle('hide');
     } else {
-      setSlicedMoreInfo(props.postInfo.substring(0, 40));
+      setPostToggle('Read more');
     }
-    setShowMoreInfo(!showMoreInfo);
   }
 
   useEffect(() => {
@@ -162,14 +147,26 @@ function OrgPostCard(props: OrgPostCardProps): JSX.Element {
                 />
               </span>
             </p>
-          ) : null}
+          ) : (
+            <img
+              src={defaultImg}
+              alt="image not found"
+              className={styles.postimage}
+            />
+          )}
           <p>
             {t('author')}:<span> {props.postAuthor}</span>
           </p>
           <div className={styles.infodiv}>
-            <p data-testid="PostInfo">
-              {slicedMoreInfo.concat(!showMoreInfo ? '...' : '')}
-            </p>
+            {togglePost === 'Read more' ? (
+              <p data-testid="toggleContent">
+                {props.postInfo.length > 43
+                  ? props.postInfo.substring(0, 40) + '...'
+                  : props.postInfo}
+              </p>
+            ) : (
+              <p data-testid="toggleContent">{props.postInfo}</p>
+            )}
             <button
               role="toggleBtn"
               data-testid="toggleBtn"
@@ -180,19 +177,16 @@ function OrgPostCard(props: OrgPostCardProps): JSX.Element {
               }`}
               onClick={handletoggleClick}
             >
-              {showMoreInfo ? 'Hide' : 'Read More'}
+              {togglePost}
             </button>
           </div>
-          {/* Check for video url and render video url */}
-          {props.postVideo ? (
-            <p>
-              {t('videoURL')}:
-              <span>
-                {' '}
-                <a href={props.postVideo}>{props.postVideo}</a>
-              </span>
-            </p>
-          ) : null}
+          <p>
+            {t('videoURL')}:
+            <span>
+              {' '}
+              <a href={props.postVideo}>{props.postVideo}</a>
+            </span>
+          </p>
         </div>
       </div>