minor bug fixes

bounswe · Oct 20, 2024 · 7d5a378 · 7d5a378
1 parent 02c8d1b
commit 7d5a378
Show file tree

Hide file tree

Showing 5 changed files with 58 additions and 49 deletions.
diff --git a/frontend/src/components/AnswerCard.tsx b/frontend/src/components/AnswerCard.tsx
@@ -8,6 +8,7 @@ interface AnswerCardProps {
   title: string;
   content: string;
   votes: number;
+  questionId: number;
   author: {
     id: number;
     name: string;
@@ -16,10 +17,10 @@ interface AnswerCardProps {
 }
 
 export const AnswerCard: React.FC<AnswerCardProps> = ({
-  id,
   title,
   content,
   votes,
+  questionId,
   author,
 }) => {
   return (
@@ -53,7 +54,7 @@ export const AnswerCard: React.FC<AnswerCardProps> = ({
             />
           </Link>
           <Link
-            to={`/answers/${id}`}
+            to={`/question/${questionId}`}
             className="flex items-center text-sm font-medium text-gray-600 hover:underline"
           >
             Go to answer

diff --git a/frontend/src/components/ContentWithSnippets.tsx b/frontend/src/components/ContentWithSnippets.tsx
@@ -55,5 +55,9 @@ export const ContentWithSnippets: React.FC<ContentWithSnippetsProps> = ({
     });
   }, [content]);
 
-  return <div className="prose whitespace-pre-wrap">{renderedContent}</div>;
+  return (
+    <div className="prose max-w-full whitespace-pre-wrap">
+      {renderedContent}
+    </div>
+  );
 };
diff --git a/frontend/src/components/QuestionCard.tsx b/frontend/src/components/QuestionCard.tsx
@@ -53,7 +53,7 @@ export const QuestionCard: React.FC<QuestionCardProps> = ({
             />
           </Link>
           <Link
-            to={`/questions/${id}`}
+            to={`/question/${id}`}
             className="flex items-center text-sm font-medium text-gray-600 hover:underline"
           >
             Go to question

diff --git a/frontend/src/routes/profile.tsx b/frontend/src/routes/profile.tsx
@@ -168,7 +168,7 @@ export default function Profile() {
           </TabsList>
 
           <TabsContent value="questions">
-            <div className="flex items-center gap-4">
+            <div className="flex items-center gap-4 py-4">
               <h3>Questions</h3>
               {me && (
                 <Button
@@ -198,7 +198,7 @@ export default function Profile() {
           </TabsContent>
 
           <TabsContent value="answers">
-            <div className="flex items-center gap-4">
+            <div className="flex items-center gap-4 py-4">
               <h3>Answers</h3>
             </div>
             <div className="grid grid-cols-3 gap-4">
@@ -208,6 +208,7 @@ export default function Profile() {
                   id={answer.id}
                   content={answer.content}
                   title={answer.question!.title!}
+                  questionId={answer.question!.id}
                   votes={answer.rating}
                   author={answer.author}
                 />

diff --git a/frontend/src/services/temporaryMocks.ts b/frontend/src/services/temporaryMocks.ts
@@ -1,3 +1,45 @@
+const question = {
+  id: 1,
+  title: "What is the best way to learn programming?",
+  content:
+    "I want to learn programming, but I don't know where to start. What is the best way to learn programming?",
+  author: {
+    id: 2,
+    username: "john_doe",
+    reputationPoints: 100,
+    profilePicture: "https://placehold.co/640x640",
+    name: "John Doe",
+  },
+  createdAt: "2024-01-01T00:00:00Z",
+  updatedAt: "2024-01-01T00:00:00Z",
+  tags: [
+    {
+      id: "python",
+      name: "Python",
+    },
+  ],
+  rating: 10,
+  answerCount: 2,
+  viewCount: 100,
+  bookmarked: false,
+  selfRating: 0,
+};
+const answer = {
+  id: 1,
+  content:
+    "To sort an array in Python, you have several options depending on your specific needs. The most common and straightforward method is to use the built-in `sort()` method for lists or the `sorted()` function for any iterable.\n\n1. Using the `sort()` method:\n  The `sort()` method modifies the original list in-place, which means it doesn't create a new list but changes the order of elements in the existing list.\n\n```python3-exec\nmy_list = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5]\nmy_list.sort()\nprint(my_list)\n\n```",
+  author: {
+    id: 1,
+    username: "jane_doe",
+    reputationPoints: 150,
+    profilePicture: "https://placehold.co/640x640",
+    name: "Jane Doe",
+  },
+  question,
+  createdAt: "2024-01-01T00:00:00Z",
+  updatedAt: "2024-01-01T00:00:00Z",
+  rating: 10,
+};
 export const temporaryMocks = {
   "/questions/{questionId}/rate": (body: unknown) => {
     temporaryMocks["/questions/{questionId}"].payload.data.selfRating = (
@@ -19,56 +61,15 @@ export const temporaryMocks = {
     status: 200,
     payload: {
       status: 200,
-      data: {
-        id: 1,
-        title: "What is the best way to learn programming?",
-        content:
-          "I want to learn programming, but I don't know where to start. What is the best way to learn programming?",
-        author: {
-          id: 2,
-          username: "john_doe",
-          reputationPoints: 100,
-          profilePicture: "https://placehold.co/640x640",
-          name: "John Doe",
-        },
-        createdAt: "2024-01-01T00:00:00Z",
-        updatedAt: "2024-01-01T00:00:00Z",
-        tags: [
-          {
-            id: "python",
-            name: "Python",
-          },
-        ],
-        rating: 10,
-        answerCount: 2,
-        viewCount: 100,
-        bookmarked: false,
-        selfRating: 0,
-      },
+      data: question,
     },
   },
   "/questions/{questionId}/answers": {
     status: 200,
     payload: {
       status: 200,
       data: {
-        items: [
-          {
-            id: 1,
-            content:
-              "To sort an array in Python, you have several options depending on your specific needs. The most common and straightforward method is to use the built-in `sort()` method for lists or the `sorted()` function for any iterable.\n\n1. Using the `sort()` method:\n  The `sort()` method modifies the original list in-place, which means it doesn't create a new list but changes the order of elements in the existing list.\n\n```python3-exec\nmy_list = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5]\nmy_list.sort()\nprint(my_list)\n\n```",
-            author: {
-              id: 1,
-              username: "jane_doe",
-              reputationPoints: 150,
-              profilePicture: "https://placehold.co/640x640",
-              name: "Jane Doe",
-            },
-            createdAt: "2024-01-01T00:00:00Z",
-            updatedAt: "2024-01-01T00:00:00Z",
-            rating: 10,
-          },
-        ],
+        items: [answer],
         totalPages: 1,
       },
     },
@@ -83,6 +84,8 @@ export const temporaryMocks = {
         reputationPoints: 100,
         profilePicture: "https://placehold.co/640x640",
         name: "John Doe",
+        answers: [answer],
+        questions: [question],
       },
     },
   },