humas
/
web-humas-fe
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: ckeditor in article form

This commit is contained in:
hanif salafi 2025-01-21 00:04:10 +07:00
parent f3febf88c3
commit 082ee41058
3 changed files with 47 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
components/form/article/create-article-form.tsx
View File

@ -29,12 +29,12 @@ import { useRouter } from "next/navigation";
import Link from "next/link"; import Link from "next/link";
import { getCategoryById } from "@/service/master-categories"; import { getCategoryById } from "@/service/master-categories";
// const CustomEditor = dynamic( const CustomEditor = dynamic(
// () => { () => {
// return import("@/components/editor/custom-editor"); return import("@/components/editor/custom-editor");
// }, },
// { ssr: false } { ssr: false }
// ); );
interface FileWithPreview extends File { interface FileWithPreview extends File {
preview: string; preview: string;
@ -405,12 +405,17 @@ export default function CreateArticleForm() {
name="description" name="description"
render={({ field: { onChange, value } }) => ( render={({ field: { onChange, value } }) => (
// <CustomEditor onChange={onChange} initialData={value} /> // <CustomEditor onChange={onChange} initialData={value} />
<JoditEditor // <JoditEditor
ref={editor} // ref={editor}
value={value} // value={value}
// onChange={onChange}
// className="dark:text-black"
// />
<CustomEditor
onChange={onChange} onChange={onChange}
className="dark:text-black" initialData={value}
/> />
)} )}
/> />
{errors?.description && ( {errors?.description && (

37
components/form/article/edit-article-form.tsx
View File

@ -33,12 +33,18 @@ import GetSeoScore from "./get-seo-score-form";
import Link from "next/link"; import Link from "next/link";
import { stringify } from "querystring"; import { stringify } from "querystring";
// const CustomEditor = dynamic( const ViewEditor = dynamic(
// () => { () => {
// return import("@/components/editor/custom-editor"); return import("@/components/editor/view-editor");
// }, },
// { ssr: false } { ssr: false }
// ); );
const CustomEditor = dynamic(
() => {
return import("@/components/editor/custom-editor");
},
{ ssr: false }
);
interface FileWithPreview extends File { interface FileWithPreview extends File {
preview: string; preview: string;
@ -413,12 +419,21 @@ export default function EditArticleForm(props: { isDetail: boolean }) {
name="description" name="description"
render={({ field: { onChange, value } }) => ( render={({ field: { onChange, value } }) => (
// <CustomEditor onChange={onChange} initialData={value} /> // <CustomEditor onChange={onChange} initialData={value} />
<JoditEditor // <JoditEditor
ref={editor} // ref={editor}
value={value} // value={value}
// onChange={onChange}
// config={{ readonly: isDetail }}
// className="dark:text-black"
// />
isDetail ?
<ViewEditor
initialData={value}
/>
:
<CustomEditor
onChange={onChange} onChange={onChange}
config={{ readonly: isDetail }} initialData={value}
className="dark:text-black"
/> />
)} )}
/> />

4
styles/globals.css
View File

@ -28,6 +28,10 @@
display: none; display: none;
} }
.ck-editor__editable_inline {
min-height: 200px;
}
.sidebar-scrollbar { .sidebar-scrollbar {
--scroll-shadow-size: 40px; --scroll-shadow-size: 40px;
} }