Merge pull request #28 from returnone-x/postquestion

complete show answer and answer vote and post new answer

api/question/answer/deleteQuestionVote.ts

@@ -0,0 +1,14 @@
+import { API_URL } from "@/config/config";
+import axios from "axios";
+
+export async function DeleteQuestionAnserVote(answerId: string) {
+  let config = {
+    method: "delete",
+    maxBodyLength: Infinity,
+    url: API_URL + `/user/question/deletevote/${answerId}`,
+    validateStatus: function () {
+      return true;
+    },
+  };
+  return await axios.request(config);
+}

api/question/answer/newQuestionAnswer.ts

@@ -0,0 +1,24 @@
+import { API_URL } from "@/config/config";
+import axios from "axios";
+
+export async function NewQuestionAnswer(
+  quesitonId: string,
+  content: string
+) {
+  let data = JSON.stringify({
+    content: content,
+  });
+  let config = {
+    method: "post",
+    maxBodyLength: Infinity,
+    url: API_URL + "/user/question/answer/new/" + quesitonId,
+    headers: {
+      "Content-Type": "application/json",
+    },
+    data: data,
+    validateStatus: function () {
+      return true;
+    },
+  };
+  return await axios.request(config);
+}

api/question/answer/questionAnsweDownVote.ts

@@ -0,0 +1,17 @@
+import { API_URL } from "@/config/config";
+import axios from "axios";
+
+export async function QuestionAnswerDownVote(answerId: string) {
+  let config = {
+    method: "post",
+    maxBodyLength: Infinity,
+    url: API_URL + `/user/question/answer/downvote/${answerId}`,
+    headers: {
+      "Content-Type": "application/json",
+    },
+    validateStatus: function () {
+      return true;
+    },
+  };
+  return await axios.request(config);
+}

api/question/answer/questionAnsweUpVote.ts

@@ -0,0 +1,17 @@
+import { API_URL } from "@/config/config";
+import axios from "axios";
+
+export async function QuestionAnswerUpVote(answerId: string) {
+  let config = {
+    method: "post",
+    maxBodyLength: Infinity,
+    url: API_URL + `/user/question/answer/upvote/${answerId}`,
+    headers: {
+      "Content-Type": "application/json",
+    },
+    validateStatus: function () {
+      return true;
+    },
+  };
+  return await axios.request(config);
+}

api/question/comment/newComment.ts

@@ -0,0 +1,31 @@
+import { API_URL } from "@/config/config";
+import axios from "axios";
+
+type TagInfo = {
+  tag: string;
+  version: string;
+};
+
+export async function NewQuestionComment(
+  quesitonId: string,
+  content: string,
+  reply: string,
+) {
+  let data = JSON.stringify({
+    content: content,
+    reply: reply,
+  });
+  let config = {
+    method: "post",
+    maxBodyLength: Infinity,
+    url: API_URL + "/user/question/comment/new/" + quesitonId,
+    headers: {
+      "Content-Type": "application/json",
+    },
+    data: data,
+    validateStatus: function () {
+      return true;
+    },
+  };
+  return await axios.request(config);
+}

api/question/newQuestion.ts

@@ -1,11 +1,6 @@
 import { API_URL } from "@/config/config";
 import axios from "axios";
 
-type TagInfo = {
-  tag: string;
-  version: string;
-};
-
 export async function newQuestionPost(
   title: string,
   content: string,

api/question/questionDownVote.ts

@@ -1,11 +1,6 @@
 import { API_URL } from "@/config/config";
 import axios from "axios";
 
-type TagInfo = {
-  tag: string;
-  version: string;
-};
-
 export async function QuestionDownVote(
   question_id: string,
 ) {

api/question/questionUpVote.ts

@@ -1,11 +1,6 @@
 import { API_URL } from "@/config/config";
 import axios from "axios";
 
-type TagInfo = {
-  tag: string;
-  version: string;
-};
-
 export async function QuestionUpvote(
   question_id: string,
 ) {

app/[locale]/question/[questionId]/page.tsx

@@ -17,12 +17,13 @@ export default function questionPage({
     edited: t("edited"),
     loadMore: t("loadMore"),
     vote: t("vote"),
-    voted: t("voted")
+    voted: t("voted"),
+    answer: t("answer")
   };
 
 
   return (
-    <Container size="xl">
+    <Container size="1450px">
       <QuestionDetill questionId={questionId} t={signipLoginTranslate}/>
     </Container>
   );

components/editor/codeBlock.css → components/editor/Codeblock.module.css

@@ -8,3 +8,8 @@
   right: 0;
   margin: 14px;
 }
+
+.codeblock {
+  background-color: #ffffff;
+  border-radius: 10px; /* 你可以調整這個值以改變圓潤的程度 */
+}

components/editor/codeBlock.tsx

@@ -1,8 +1,6 @@
-import "./codeBlock.css";
 import React from "react";
 import { NodeViewContent, NodeViewWrapper } from "@tiptap/react";
-import { CopyButton, ActionIcon } from "@mantine/core";
-import { HiClipboard, HiClipboardCheck } from "react-icons/hi";
+import classes from './Codeblock.module.css'
 
 interface CodeBlockProps {
   node: {
@@ -29,23 +27,9 @@ const CodeBlockComponent: React.FC<CodeBlockProps> = ({
   extension,
 }) => {
   return (
-    <NodeViewWrapper className="code-block">
-      <div className="copy-button-container">
-        <CopyButton value={"test"}>
-          {({ copied, copy }) => (
-            <ActionIcon
-              variant="outline"
-              color={copied ? "green" : "gray"}
-              aria-label="Settings"
-              onClick={copy}
-            >
-              {copied ? <HiClipboardCheck /> : <HiClipboard />}
-            </ActionIcon>
-          )}
-        </CopyButton>
-      </div>
-      <pre>
-        <NodeViewContent as="code" />
+    <NodeViewWrapper className={classes.codeblock}>
+      <pre className={classes.codeblock}>
+        <NodeViewContent as="code" className={classes.codeblock} />
       </pre>
     </NodeViewWrapper>
   );

components/editor/codeLowLight.tsx

@@ -27,7 +27,9 @@ import coffeescript from "highlight.js/lib/languages/coffeescript";
 export const Registerlowlight = createLowlight(common);
 
 Registerlowlight.register("ts", ts);
+Registerlowlight.register("tsx", ts);
 Registerlowlight.register("js", js);
+Registerlowlight.register("jsx", js);
 Registerlowlight.register("py", py);
 Registerlowlight.register("go", go);
 Registerlowlight.register("rust", rust);

components/editor/editor.tsx

@@ -13,7 +13,6 @@ import { BiCodeBlock } from "react-icons/bi";
 import { Registerlowlight } from "./codeLowLight";
 import CodeBlockComponent from "./codeBlock";
 import { Dispatch, SetStateAction } from "react";
-
 const lowlight = Registerlowlight;
 
 const content = ""
@@ -41,19 +40,17 @@ export function TiptapEditor({changeContent}: {changeContent: Dispatch<SetStateA
   });
 
   return (
-    <RichTextEditor editor={editor} spellCheck={false}>
+    <RichTextEditor editor={editor} spellCheck={false} withCodeHighlightStyles>
       <RichTextEditor.Toolbar sticky stickyOffset={60}>
         <RichTextEditor.ControlsGroup>
           <RichTextEditor.Bold />
           <RichTextEditor.Italic />
           <RichTextEditor.Strikethrough />
-          <RichTextEditor.H2 />
           <RichTextEditor.Code />
           <RichTextEditor.CodeBlock icon={BiCodeBlock} />
         </RichTextEditor.ControlsGroup>
 
         <RichTextEditor.ControlsGroup>
-          <RichTextEditor.Blockquote />
           <RichTextEditor.Hr />
           <RichTextEditor.BulletList />
           <RichTextEditor.OrderedList />

components/editor/simpleEditor.tsx

@@ -0,0 +1,68 @@
+"use client";
+import "@mantine/tiptap/styles.css";
+
+import { RichTextEditor, Link } from "@mantine/tiptap";
+import { ReactNodeViewRenderer, useEditor } from "@tiptap/react";
+import Highlight from "@tiptap/extension-highlight";
+import StarterKit from "@tiptap/starter-kit";
+import Underline from "@tiptap/extension-underline";
+import TextAlign from "@tiptap/extension-text-align";
+import SubScript from "@tiptap/extension-subscript";
+import CodeBlockLowlight from "@tiptap/extension-code-block-lowlight";
+import { BiCodeBlock } from "react-icons/bi";
+import { Registerlowlight } from "./codeLowLight";
+import CodeBlockComponent from "./codeBlock";
+import { Dispatch, SetStateAction } from "react";
+const lowlight = Registerlowlight;
+
+const content = ""
+export function SimpleEditor({changeContent}: {changeContent: Dispatch<SetStateAction<string>>}) {
+  const editor = useEditor({
+    extensions: [
+      Underline,
+      Link,
+      SubScript,
+      Highlight,
+      TextAlign.configure({ types: ["heading", "paragraph"] }),
+      StarterKit.configure({ codeBlock: false }),
+      CodeBlockLowlight.extend({
+        addNodeView() {
+          return ReactNodeViewRenderer(CodeBlockComponent);
+        },
+      }).configure({ lowlight }),
+    ],
+    content: content,
+    onUpdate: ({ editor }) => {
+      const html = editor.getHTML()
+      changeContent(html)
+    },
+
+  });
+
+  return (
+    <RichTextEditor editor={editor} spellCheck={false}>
+      <RichTextEditor.Toolbar sticky stickyOffset={60}>
+        <RichTextEditor.ControlsGroup>
+          <RichTextEditor.Bold />
+          <RichTextEditor.Italic />
+          <RichTextEditor.Strikethrough />
+          <RichTextEditor.Code />
+          <RichTextEditor.CodeBlock icon={BiCodeBlock} />
+        </RichTextEditor.ControlsGroup>
+
+        <RichTextEditor.ControlsGroup>
+          <RichTextEditor.Hr />
+          <RichTextEditor.BulletList />
+          <RichTextEditor.OrderedList />
+        </RichTextEditor.ControlsGroup>
+
+        <RichTextEditor.ControlsGroup>
+          <RichTextEditor.Link />
+          <RichTextEditor.Unlink />
+        </RichTextEditor.ControlsGroup>
+      </RichTextEditor.Toolbar>
+
+      <RichTextEditor.Content />
+    </RichTextEditor>
+  );
+}

components/editor/simpleViewContent.tsx

@@ -0,0 +1,58 @@
+"use client";
+import "./Editor.module.css";
+
+import { RichTextEditor, Link } from "@mantine/tiptap";
+import { ReactNodeViewRenderer, useEditor } from "@tiptap/react";
+import Highlight from "@tiptap/extension-highlight";
+import StarterKit from "@tiptap/starter-kit";
+import Underline from "@tiptap/extension-underline";
+import TextAlign from "@tiptap/extension-text-align";
+import SubScript from "@tiptap/extension-subscript";
+import CodeBlockLowlight from "@tiptap/extension-code-block-lowlight";
+import { Registerlowlight } from "./codeLowLight";
+import CodeBlockComponent from "./codeBlock";
+import classess from "./Editor.module.css";
+const lowlight = Registerlowlight;
+
+export function SimpleViewContent({ content }: { content: string }) {
+  const editor = useEditor({
+    extensions: [
+      Underline,
+      Link,
+      SubScript,
+      Highlight,
+      TextAlign.configure({ types: ["heading", "paragraph"] }),
+      StarterKit.configure({ codeBlock: false }),
+      CodeBlockLowlight.extend({
+        addNodeView() {
+          return ReactNodeViewRenderer(CodeBlockComponent);
+        },
+      }).configure({ lowlight }),
+    ],
+    content: content,
+    editable: false,
+  });
+
+  return (
+    <RichTextEditor
+      editor={editor}
+      spellCheck={false}
+      style={{ padding: 0 }}
+      styles={{
+        root: {
+          border: "0px",
+          padding: 0,
+        },
+        typographyStylesProvider: {
+          padding: 0,
+        }
+      }}
+    >
+      <RichTextEditor.Content
+        style={{
+          padding: "0px",
+        }}
+      />
+    </RichTextEditor>
+  );
+}