📝 update Readme, add react-markdown package

miliariadnane · Apr 5, 2024 · ab6007e · ab6007e
1 parent 1697e00
commit ab6007e
Show file tree

Hide file tree

Showing 6 changed files with 1,151 additions and 55 deletions.
diff --git a/docs/app.png b/docs/app.png
diff --git a/frontend/App.tsx b/frontend/App.tsx
@@ -2,13 +2,14 @@ import {Fragment, useState} from "react";
 import {MCCService} from "Frontend/generated/endpoints";
 import Footer from "Frontend/components/Footer";
 import Navbar from "Frontend/components/Navbar";
+import ReactMarkdown from 'react-markdown';
 
 
 export default function App() {
 
     const [dishName, setDishName] = useState('');
     const [recipe, setRecipe] = useState('');
-    const [dishImage, setDishImage] = useState('/placeholder.svg');
+    const [dishImage, setDishImage] = useState('');
 
     const handleGenerateClick = () => {
         if (dishName) {
@@ -62,9 +63,9 @@ export default function App() {
                     </div>
                     <div className="col-span-3 space-y-4 rounded-lg border-2 border-gray-200 p-4">
                         <h2 className="mb-4 text-2xl font-bold">Recipes</h2>
-                        <p className="whitespace-pre-wrap leading-relaxed text-gray-700">
+                        <ReactMarkdown className="whitespace-pre-wrap leading-relaxed text-gray-700">
                             {recipe}
-                        </p>
+                        </ReactMarkdown>
                     </div>
                     </div>
                 </main>

diff --git a/frontend/components/Footer.tsx b/frontend/components/Footer.tsx
@@ -3,7 +3,7 @@ const Footer = () => {
     return (
         <footer className="flex h-14 items-center border-t px-4">
         <span className="italic text-sm">
-            Made with love. For educational purposes only.
+            Made with love. For learning purposes only.
         </span>
             <span className="ml-auto text-sm">
                 © 2024 Moroccan Cooking Companion