Merge pull request #36 from hicsail/feature/article-teasers

Feature/article teasers
hicsail · May 17, 2024 · 3ef28b8 · 3ef28b8
2 parents 1b9e3c9 + 7a5edf4
commit 3ef28b8
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 8 deletions.
diff --git a/src/components/IonicCard.tsx b/src/components/IonicCard.tsx
@@ -23,6 +23,7 @@ interface CardProps {
   manual_id: string;
   author: string;
   tag: string;
+  teaser: string;
 }
 
 export default function IonicCard({
@@ -37,6 +38,7 @@ export default function IonicCard({
   manual_id,
   author,
   tag,
+  teaser,
 }: CardProps) {
   const [summary, setSummary] = useState<string>(body.split(".")[0]);
   const [sentences, setSentences] = useState<string[]>(body.split("."));
@@ -90,9 +92,7 @@ export default function IonicCard({
             lineHeight: "1.75rem",
           }}
         >
-          {summary.length > 120
-            ? `${summary.substring(0, 120)}...`
-            : `${summary}.`}
+          {teaser.length > 200 ? `${teaser.substring(0, 200)}...` : `${teaser}`}
         </IonCardContent>
         {/* have card modal button at bottom */}
         <div

diff --git a/src/pages/Discover.tsx b/src/pages/Discover.tsx
@@ -240,6 +240,7 @@ const Discover: React.FC = () => {
                     setIsExpandedArray={() => handleExpandCard(index)}
                     index={index}
                     manual_id={article.attributes.manual_id}
+                    teaser={article.attributes.teasers}
                   />
                 </div>
               ))}

diff --git a/src/pages/Post.tsx b/src/pages/Post.tsx
@@ -83,9 +83,7 @@ const Post: React.FC = () => {
             {/* <p>{article?.description}</p> */}
             {/* place holder text */}
             <p className="text-md text-center md:text-left tracking-wider text-[#101066]">
-              Explore our collection of informative mental health resources
-              designed to help teens navigate their emotional well-being and
-              find support.
+              {article?.attributes.teasers}
             </p>
             {/* <span>{article?.attributes.author}</span> */}
             <div className="flex text-sm md:text-md tracking-wider align-middle text-[#101066]">
@@ -143,7 +141,7 @@ const Post: React.FC = () => {
             {/* <img src={article?.image} alt={article?.title} /> */}
           </div>
         </div>
-        <div
+        {/* <div
           ref={ref}
           className="flex justify-center align-center my-12"
           onClick={() => ref.current?.scrollIntoView({ behavior: "smooth" })}
@@ -162,7 +160,8 @@ const Post: React.FC = () => {
               d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708"
             />
           </svg>
-        </div>
+        </div> */}
+        <div className="my-12" />
         <div className="md:w-2/3 px-10 md:px-0 text-sm md:text-md tracking-wide md:tracking-wider text-[#101066] mb-16">
           <ReactMarkdown>{article?.attributes.body_markdown}</ReactMarkdown>
         </div>