-
+
("");
+ const [article, setArticle] = React.useState(new Set([]));
+ const [slug, setSlug] = useState("");
+ const [tags, setTags] = useState([]);
+ const [newTags, setNewTags] = useState("");
+ const editor = useRef(null);
+ const [content, setContent] = useState("");
+ const MySwal = withReactContent(Swal);
+ const [selectedImages, setSelectedImages] = useState([]);
+ const [selectedCategory, setSelectedCategory] = useState();
+ const [selectedContentType, setSelectedContentType] =
+ useState("single-article");
+
+ const [collectSingleArticleId, setCollectSingleArticleId] = useState<
+ number[]
+ >([]);
+ const [collectBulkArticleId, setCollectBulkArticleId] = useState(
+ []
+ );
+ const [collectRewriteArticleId, setCollectRewriteArticleId] = useState<
+ number[]
+ >([]);
+
+ const [generatedTranscriptId, setGeneratedTranscriptId] = useState();
+
+ const generatedArticleIdStore = generatedArticleIds(
+ (state) => state.articleIds
+ );
+ const setGeneratedArticleIdStore = generatedArticleIds(
+ (state) => state.setArticleIds
+ );
+
+ const [selectedGeneratedArticleId, setSelectedGeneratedArticleId] =
+ useState();
+
+ const formOptions = { resolver: zodResolver(articleSchema) };
+ type MicroIssueSchema = z.infer;
+ const {
+ register,
+ control,
+ handleSubmit,
+ setValue,
+ formState: { errors },
+ } = useForm(formOptions);
+
+ const TypeId = [
+ {
+ key: 1,
+ label: "Article",
+ },
+ {
+ key: 2,
+ label: "Magazine",
+ },
+ ];
+
+ const handleImageChange = (event: ChangeEvent) => {
+ if (event.target.files) {
+ const files = Array.from(event.target.files);
+ setSelectedImages((prevImages) => [...prevImages, ...files]);
+ }
+ };
+
+ const handleRemoveImage = (index: number) => {
+ setSelectedImages((prevImages) => prevImages.filter((_, i) => i !== index));
+ };
+
+ const handleClose = (tagsToRemove: string) => {
+ setTags(tags.filter((tag) => tag !== tagsToRemove));
+ if (tags.length === 1) {
+ setTags([]);
+ }
+ };
+
+ const handleAddTags = (e: any) => {
+ if (newTags.trim() !== "") {
+ setTags([...tags, newTags.trim()]);
+ setNewTags("");
+ e.preventDefault();
+ }
+ };
+
+ const handleKeyDown = (event: any) => {
+ if (event.key === "Enter") {
+ handleAddTags(event);
+ }
+ };
+
+ async function save(data: any) {
+ const formData = {
+ title: title,
+ typeId: parseInt(String(Array.from(article)[0])),
+ slug: slug,
+ tags: tags.join(","),
+ description: content,
+ htmlDescription: content,
+ };
+
+ console.log("Form Data:", formData);
+ const response = await createArticle(formData);
+
+ if (response?.error) {
+ error(response.message);
+ return false;
+ }
+
+ successSubmit("/admin/article");
+ }
+
+ function successSubmit(redirect: any) {
+ MySwal.fire({
+ title: "Sukses",
+ icon: "success",
+ confirmButtonColor: "#3085d6",
+ confirmButtonText: "OK",
+ }).then((result) => {
+ if (result.isConfirmed) {
+ router.push(redirect);
+ }
+ });
+ }
+
+ async function onSubmit(data: any) {
+ MySwal.fire({
+ title: "Simpan Data",
+ text: "",
+ icon: "warning",
+ showCancelButton: true,
+ cancelButtonColor: "#d33",
+ confirmButtonColor: "#3085d6",
+ confirmButtonText: "Simpan",
+ }).then((result) => {
+ if (result.isConfirmed) {
+ save(data);
+ }
+ });
+ }
+
+ const singleArticleId = (id: number) => {
+ let temp = [...collectSingleArticleId, id];
+ setCollectSingleArticleId(temp);
+ };
+ const bulkArticleId = (id: number[]) => {
+ let temp: number[] = [...collectBulkArticleId, ...id];
+ setCollectBulkArticleId(temp);
+ };
+ const rewriteArticleId = (id: number) => {
+ let temp = [...collectRewriteArticleId, id];
+ setCollectRewriteArticleId(temp);
+ };
+
+ useEffect(() => {
+ getArticleDetail();
+ }, [selectedGeneratedArticleId]);
+
+ const checkArticleStatus = async (data: string | null) => {
+ if (data === null) {
+ delay(10000).then(() => {
+ getArticleDetail();
+ });
+ }
+ };
+
+ const getArticleDetail = async () => {
+ if (selectedGeneratedArticleId) {
+ const res = await getDetailArticle(selectedGeneratedArticleId);
+ const data = res?.data?.data?.articleBody;
+ checkArticleStatus(data);
+ if (data !== null) {
+ setContent(data);
+ }
+ }
+ };
+
+ return (
+ ;
+ const {
+ register,
+ control,
+ handleSubmit,
+ formState: { errors },
+ setValue,
+ getValues,
+ trigger,
+ } = useForm(formOptions);
+
+ const { fields, append, remove } = useFieldArray({
+ control,
+ name: "rows",
+ });
+
+ const onSubmit = async () => {
+ loading();
+ const listData = [];
+ for (let i = 0; i < fields.length; i++) {
+ listData.push({
+ title: getValues(`rows.${i}.title`),
+ mainKeyword: getValues(`rows.${i}.mainKeyword`),
+ additionalKeywords: getValues(`rows.${i}.additionalKeyword`),
+ });
+ }
+ const request = {
+ style: "Friendly",
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "0",
+ imageSource: "Web",
+ targetCountry: null,
+ articleSize: selectedArticleSize,
+ projectId: 2,
+ data: listData,
+ createdBy: "123123",
+ clientId: "humasClientIdtest",
+ };
+
+ const res = await saveBulkArticle(request);
+ if (res.error) {
+ error(res.message);
+ return false;
+ }
+
+ console.log("res?s", res?.data?.data);
+ const temp: number[] = [];
+ res?.data?.data.map((data: any) => temp.push(data.id));
+ props.articleId(temp);
+ close();
+ };
+
+ const generateTitle = async (keyword: string | undefined, index: number) => {
+ if (keyword) {
+ const req = {
+ keyword: keyword,
+ style: selectedWritingSyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "None",
+ clientId: "",
+ };
+ setValue(`rows.${index}.title`, "process...");
+
+ const res = await getGenerateTitle(req);
+ const data = res?.data?.data;
+ setValue(`rows.${index}.title`, data);
+ }
+ };
+
+ const generateKeywords = async (
+ keyword: string | undefined,
+ index: number
+ ) => {
+ if (keyword) {
+ const req = {
+ keyword: keyword,
+ style: selectedWritingSyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "0",
+ clientId: "",
+ };
+ setValue(`rows.${index}.additionalKeyword`, "process...");
+ const res = await getGenerateKeywords(req);
+ const data = res?.data?.data;
+ setValue(`rows.${index}.additionalKeyword`, data);
+ }
+ };
+
+ const processAll = async () => {
+ let emptyMainKeyword = 0;
+ const mainKeyword = getValues(`rows.0.mainKeyword`);
+ for (let i = 0; i < fields.length; i++) {
+ const mainKeyNow = getValues(`rows.${i}.mainKeyword`);
+ if (mainKeyNow === "") {
+ emptyMainKeyword++;
+ }
+ }
+ if (mainKeyword !== "") {
+ if (emptyMainKeyword > 0) {
+ loading();
+ const res = await getGenerateTopicKeywords({
+ keyword: mainKeyword,
+ count: emptyMainKeyword,
+ });
+ const data = res?.data?.data;
+ let j = 0;
+ for (let i = 0; i < fields.length; i++) {
+ const mainKeyNow = getValues(`rows.${i}.mainKeyword`);
+ if (mainKeyNow === "") {
+ setValue(`rows.${i}.mainKeyword`, data[j]);
+
+ j++;
+ }
+ }
+ for (let i = 0; i < fields.length; i++) {
+ const mainKeyNow = getValues(`rows.${i}.mainKeyword`);
+ if (getValues(`rows.${i}.title`) == "") {
+ generateTitle(mainKeyNow, i);
+ }
+ if (getValues(`rows.${i}.additionalKeyword`) == "") {
+ generateKeywords(mainKeyNow, i);
+ }
+ }
+
+ close();
+ } else {
+ loading();
+ for (let i = 0; i < fields.length; i++) {
+ const mainKeyNow = getValues(`rows.${i}.mainKeyword`);
+ if (getValues(`rows.${i}.title`) == "") {
+ generateTitle(mainKeyNow, i);
+ }
+ if (getValues(`rows.${i}.additionalKeyword`) == "") {
+ generateKeywords(mainKeyNow, i);
+ }
+ }
+ close();
+ }
+ }
+ };
+
+ const processRow = (index: number) => {
+ const addKeyword = getValues(`rows.${index}.mainKeyword`);
+ console.log("index", index, addKeyword);
+ generateTitle(addKeyword, index);
+
+ generateKeywords(addKeyword, index);
+ };
+
+ const validateFields = async () => {
+ const validation = await trigger();
+ if (validation) {
+ onSubmit();
+ }
+ };
+
+ return (
+
+ );
+}
diff --git a/components/form/article/generate-rewrite-form.tsx b/components/form/article/generate-rewrite-form.tsx
new file mode 100644
index 0000000..8466e6e
--- /dev/null
+++ b/components/form/article/generate-rewrite-form.tsx
@@ -0,0 +1,273 @@
+"use client";
+import {
+ Button,
+ Input,
+ Select,
+ SelectItem,
+ SelectSection,
+ Textarea,
+} from "@nextui-org/react";
+import { FormEvent, useEffect, useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import * as z from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { close, error, loading } from "@/config/swal";
+import { getGenerateRewriter } from "@/service/generate-article";
+import TranscriptDraftTable from "@/components/table/disestages/transcript-draft-table";
+import ArticleDraftTable from "@/components/table/disestages/article-draft-table";
+
+const writingStyle = [
+ {
+ id: 1,
+ name: "Friendly",
+ },
+ {
+ id: 1,
+ name: "Professional",
+ },
+ {
+ id: 3,
+ name: "Informational",
+ },
+ {
+ id: 4,
+ name: "Neutral",
+ },
+ {
+ id: 5,
+ name: "Witty",
+ },
+];
+
+const articleSize = [
+ {
+ id: 1,
+ name: "News (300 - 900 words)",
+ value: "News",
+ },
+ {
+ id: 2,
+ name: "Info (900 - 2000 words)",
+ value: "Info",
+ },
+ {
+ id: 3,
+ name: "Detail (2000 - 5000 words)",
+ value: "Detail",
+ },
+];
+
+const formSchema = z.object({
+ field1: z.string().min(2, {
+ message: "Required",
+ }),
+ advancedConfiguration: z.string().optional(),
+});
+
+export default function GenerateRewriteArticle(props: {
+ articleId: (data: number) => void;
+ initTranscript?: number;
+}) {
+ const [selectedWritingSyle, setSelectedWritingStyle] =
+ useState("Informational");
+ const [selectedArticleSize, setSelectedArticleSize] = useState("News");
+ const [selectedLanguage, setSelectedLanguage] = useState("id");
+ const [contextType, setContextType] = useState("text");
+
+ useEffect(() => {
+ if (props.initTranscript) {
+ setContextType("transcript");
+ }
+ }, [props.initTranscript]);
+
+ const formOptions = { resolver: zodResolver(formSchema) };
+ type UserSettingSchema = z.infer;
+ const {
+ control,
+ handleSubmit,
+ formState: { errors },
+ setValue,
+ } = useForm(formOptions);
+
+ const onSubmit = async (values: z.infer) => {
+ loading();
+ const request = {
+ advConfig: values.advancedConfiguration || "",
+ context: contextType == "url" ? null : values.field1,
+ style: selectedWritingSyle,
+ sentiment: "Humorous",
+ clientId: "humasClientIdtest",
+ createdBy: "123123",
+ contextType: contextType,
+ urlContext: contextType === "url" ? values.field1 : null,
+ lang: selectedLanguage,
+ };
+ const res = await getGenerateRewriter(request);
+ close();
+ if (res?.error) {
+ error("Error");
+ }
+ props.articleId(res?.data?.data?.id);
+ };
+
+ useEffect(() => {
+ setValue("field1", "");
+ }, [contextType]);
+ return (
+
+ );
+}
diff --git a/components/form/article/generate-single-article-form.tsx b/components/form/article/generate-single-article-form.tsx
new file mode 100644
index 0000000..7fe1168
--- /dev/null
+++ b/components/form/article/generate-single-article-form.tsx
@@ -0,0 +1,334 @@
+"use client";
+import {
+ Button,
+ Input,
+ Select,
+ SelectItem,
+ SelectSection,
+} from "@nextui-org/react";
+import { FormEvent, useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import * as z from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { close, error, loading } from "@/config/swal";
+import {
+ generateDataArticle,
+ getGenerateKeywords,
+ getGenerateTitle,
+} from "@/service/generate-article";
+
+const writingStyle = [
+ {
+ id: 1,
+ name: "Friendly",
+ },
+ {
+ id: 1,
+ name: "Professional",
+ },
+ {
+ id: 3,
+ name: "Informational",
+ },
+ {
+ id: 4,
+ name: "Neutral",
+ },
+ {
+ id: 5,
+ name: "Witty",
+ },
+];
+
+const articleSize = [
+ {
+ id: 1,
+ name: "News (300 - 900 words)",
+ value: "News",
+ },
+ {
+ id: 2,
+ name: "Info (900 - 2000 words)",
+ value: "Info",
+ },
+ {
+ id: 3,
+ name: "Detail (2000 - 5000 words)",
+ value: "Detail",
+ },
+];
+
+const singleArticleSchema = z.object({
+ mainKeyword: z.string().min(2, {
+ message: "Main Keyword must be at least 2 characters.",
+ }),
+ title: z.string().min(2, {
+ message: "Main Keyword must be at least 2 characters.",
+ }),
+ additionalKeyword: z.string().min(2, {
+ message: "Main Keyword must be at least 2 characters.",
+ }),
+});
+
+export default function GenerateSingleArticle(props: {
+ articleId: (data: number) => void;
+}) {
+ const [selectedWritingSyle, setSelectedWritingStyle] =
+ useState("Informational");
+ const [selectedArticleSize, setSelectedArticleSize] = useState("News");
+ const [selectedLanguage, setSelectedLanguage] = useState("id");
+
+ const formOptions = { resolver: zodResolver(singleArticleSchema) };
+ type UserSettingSchema = z.infer;
+ const {
+ register,
+ control,
+ handleSubmit,
+ formState: { errors },
+ setValue,
+ getValues,
+ } = useForm(formOptions);
+
+ const generateAll = async (keyword: string | undefined) => {
+ if (keyword) {
+ generateTitle(keyword);
+ generateKeywords(keyword);
+ }
+ };
+
+ const generateTitle = async (keyword: string | undefined) => {
+ if (keyword) {
+ loading();
+ const req = {
+ keyword: keyword,
+ style: selectedWritingSyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "None",
+ clientId: "",
+ };
+ const res = await getGenerateTitle(req);
+ const data = res?.data?.data;
+ setValue("title", data);
+ close();
+ }
+ };
+
+ const generateKeywords = async (keyword: string | undefined) => {
+ if (keyword) {
+ const req = {
+ keyword: keyword,
+ style: selectedWritingSyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "0",
+ clientId: "",
+ };
+ loading();
+ const res = await getGenerateKeywords(req);
+ const data = res?.data?.data;
+ setValue("additionalKeyword", data);
+ close();
+ }
+ };
+
+ const onSubmit = async (values: z.infer) => {
+ loading();
+ const request = {
+ advConfig: "",
+ style: selectedWritingSyle,
+ website: "None",
+ connectToWeb: true,
+ lang: selectedLanguage,
+ pointOfView: "None",
+ title: values.title,
+ imageSource: "Web",
+ mainKeyword: values.mainKeyword,
+ additionalKeywords: values.additionalKeyword,
+ targetCountry: null,
+ articleSize: selectedArticleSize,
+ projectId: 2,
+ createdBy: "123123",
+ clientId: "humasClientIdtest",
+ };
+ console.log("reqq", request);
+ const res = await generateDataArticle(request);
+ close();
+ console.log("res", res?.data?.data);
+ if (res?.error) {
+ error("Error");
+ }
+ props.articleId(res?.data?.data?.id);
+ };
+
+ return (
+
+ );
+}
diff --git a/components/form/article/speech-to-text-form.tsx b/components/form/article/speech-to-text-form.tsx
new file mode 100644
index 0000000..34732b8
--- /dev/null
+++ b/components/form/article/speech-to-text-form.tsx
@@ -0,0 +1,288 @@
+"use client";
+import { AddIcon, TimesIcon } from "@/components/icons";
+import { Input, Textarea } from "@nextui-org/input";
+import {
+ Button,
+ Checkbox,
+ CircularProgress,
+ Divider,
+ Select,
+ SelectItem,
+ SelectSection,
+} from "@nextui-org/react";
+import Link from "next/link";
+import { useSearchParams } from "next/navigation";
+import { Suspense, useState } from "react";
+
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import { useForm } from "react-hook-form";
+import Cookies from "js-cookie";
+import { close, error, loading } from "@/config/swal";
+import {
+ generateSpeechToText,
+ getTranscriptById,
+} from "@/service/generate-article";
+import { delay } from "@/utils/global";
+
+// import OperatorArticleTable from "@/components/table/assistant/create-content/operator/operator-article-table";
+// import OperatorTranscriptTable from "@/components/table/assistant/create-content/operator/operator-transcript-table";
+// import OperatorArticleDraftTable from "@/components/table/assistant/create-content/operator/operator-draft-article-table";
+// import OperatorDetailDraftArticle from "@/components/main/multipool-assistant/operator-detail-draft-article";
+
+const createContentOnlineMediaSchema = z.object({
+ title: z.string().min(1, { message: "Required" }),
+ prompt: z.string().min(1, { message: "Required" }),
+});
+
+export default function SpeechToText(props: {
+ generateArticleFromTranscript: (transcriptId: number) => void;
+}) {
+ const searchParam = useSearchParams();
+ const transcriptQuery = searchParam.get("transcriptId");
+ const roleId = Cookies.get("urie");
+
+ let [files, setFiles] = useState([]);
+ const [handleFileStatus, setHandleFileStatus] = useState("");
+ const [detailTranscript, setDetailTranscript] = useState("");
+
+ const [generatedTranscriptId, setGeneratedTranscriptId] = useState();
+ const [advanceConfig, setAdvanceConfig] = useState(false);
+ const [language, setLanguage] = useState("id");
+
+ const formOptions = { resolver: zodResolver(createContentOnlineMediaSchema) };
+ type CreateContentSchema = z.infer;
+ const {
+ register,
+ setValue,
+ handleSubmit,
+ formState: { errors },
+ } = useForm(formOptions);
+
+ const handleFileChange = (event: any) => {
+ if (files.length < 1) {
+ const newFiles: FileList | null = event.target.files;
+ if (newFiles) {
+ const allowedExtensions = [".mp3"];
+ let temp: File[] = [...files]; // Salin file-file yang sudah ada
+ for (let i = 0; i < newFiles.length; i++) {
+ const file = newFiles[i];
+ const fileExtension = file.name.split(".").pop()?.toLowerCase();
+ if (
+ fileExtension &&
+ allowedExtensions.includes(`.${fileExtension}`)
+ ) {
+ temp.push(file);
+ } else {
+ alert("The supported File formats are .mp3");
+ }
+ }
+ setFiles(temp);
+ }
+ }
+ };
+
+ const removeFile = (name: string) => {
+ const arrayFile: File[] = [];
+ for (const element of files) {
+ if (element.name !== name) {
+ arrayFile.push(element);
+ }
+ }
+ setFiles(arrayFile);
+ };
+
+ const handleGenerateTranscript = (data: any) => {
+ if (files.length > 0) {
+ doGenerate(data);
+ setHandleFileStatus("");
+ } else {
+ setHandleFileStatus("Required");
+ }
+ };
+
+ const doGenerate = async (data: any) => {
+ loading();
+ let formData = new FormData();
+ console.log("data.", data.prompt);
+ formData.append("filename", files[0]);
+ formData.append("title", data.title);
+ formData.append("prompt", data.prompt);
+ formData.append("language", language);
+ formData.append("clientId", "humasClientIdTest");
+ formData.append("createdBy", "123");
+
+ const res = await generateSpeechToText(formData);
+ setGeneratedTranscriptId(res?.data?.data?.id);
+ close();
+ initFetch(res?.data?.data?.id);
+ return false;
+ };
+
+ const checkTranscriptStatus = async (id: number) => {
+ delay(7000).then(() => {
+ initFetch(id);
+ });
+ };
+
+ const initFetch = async (id?: number) => {
+ if (id) {
+ const res = await getTranscriptById(id);
+ console.log("stat", res?.data?.data);
+ if (res?.data?.data?.status === 0) {
+ setDetailTranscript("");
+ checkTranscriptStatus(id);
+ } else {
+ setDetailTranscript(res?.data?.data.content);
+ }
+ }
+ };
+
+ return (
+
+
+ );
+}
diff --git a/components/form/form-article.tsx b/components/form/form-article.tsx
index 674556d..2df6691 100644
--- a/components/form/form-article.tsx
+++ b/components/form/form-article.tsx
@@ -346,6 +346,7 @@ export default function FormArticle() {
diff --git a/components/layout/admin-layout.tsx b/components/layout/admin-layout.tsx
index 03f671c..2bfeee0 100644
--- a/components/layout/admin-layout.tsx
+++ b/components/layout/admin-layout.tsx
@@ -27,9 +27,9 @@ export const AdminLayout = ({ children }: Props) => {
return (
-
+
+
+
+
+ );
+}
diff --git a/components/form/article/generate-bulk-article-form.tsx b/components/form/article/generate-bulk-article-form.tsx
new file mode 100644
index 0000000..d13d131
--- /dev/null
+++ b/components/form/article/generate-bulk-article-form.tsx
@@ -0,0 +1,506 @@
+"use client";
+import {
+ Button,
+ Input,
+ Select,
+ SelectItem,
+ SelectSection,
+} from "@nextui-org/react";
+import { FormEvent, useState } from "react";
+import { Controller, useFieldArray, useForm } from "react-hook-form";
+import * as z from "zod";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { close, error, loading } from "@/config/swal";
+import {
+ generateDataArticle,
+ getGenerateKeywords,
+ getGenerateTitle,
+ getGenerateTopicKeywords,
+ saveBulkArticle,
+} from "@/service/generate-article";
+
+const writingStyle = [
+ {
+ id: 1,
+ name: "Friendly",
+ },
+ {
+ id: 1,
+ name: "Professional",
+ },
+ {
+ id: 3,
+ name: "Informational",
+ },
+ {
+ id: 4,
+ name: "Neutral",
+ },
+ {
+ id: 5,
+ name: "Witty",
+ },
+];
+
+const articleSize = [
+ {
+ id: 1,
+ name: "News (300 - 900 words)",
+ value: "News",
+ },
+ {
+ id: 2,
+ name: "Info (900 - 2000 words)",
+ value: "Info",
+ },
+ {
+ id: 3,
+ name: "Detail (2000 - 5000 words)",
+ value: "Detail",
+ },
+];
+
+const formSchema = z.object({
+ rows: z.array(
+ z.object({
+ mainKeyword: z.string().min(1, {
+ message: "Main Keyword must be at least 2 characters.",
+ }),
+ title: z.string().min(1, {
+ message: "Title must be at least 2 characters.",
+ }),
+ additionalKeyword: z.string().min(1, {
+ message: "Additional Keyword must be at least 2 characters.",
+ }),
+ })
+ ),
+});
+
+export default function GenerateBulkArticle(props: {
+ articleId: (data: number[]) => void;
+}) {
+ const [selectedWritingSyle, setSelectedWritingStyle] =
+ useState("Informational");
+ const [selectedArticleSize, setSelectedArticleSize] = useState("News");
+ const [selectedLanguage, setSelectedLanguage] = useState("id");
+
+ const formOptions = {
+ resolver: zodResolver(formSchema),
+ defaultValues: {
+ rows: [{ mainKeyword: "", title: "", additionalKeyword: "" }],
+ },
+ };
+ type UserSettingSchema = z.infer
+
+ {
+ setGeneratedTranscriptId(transcriptId);
+ setSelectedContentType("rewrite");
+ }}
+ />
+ ) : (
+ ""
+ )}
+
+
+
+
+ setTitle(e.target.value)}
+ label="Judul"
+ variant="bordered"
+ placeholder="Enter Text"
+ labelPlacement="outside"
+ />
+
+
+ {title.length === 0 && errors.title && errors.title.message}
+
+
+
+
+
+ {errors.article?.message}
+
+ {/* {article}
*/} +
+
+ "!rounded-xl bg-white !border-1 !border-gray-200",
+ }}
+ classNamePrefix="select"
+ onChange={setSelectedCategory}
+ closeMenuOnSelect={false}
+ components={animatedComponents}
+ isClearable={true}
+ isSearchable={true}
+ isMulti={true}
+ placeholder="Category ..."
+ name="sub-module"
+ options={dummyCategory}
+ />
+
+ Category
+
+ {(!selectedCategory || selectedCategory?.length < 1) && (
+
+ Required
+ )} +
+ setSlug(e.target.value)}
+ label="Slug"
+ variant="bordered"
+ placeholder="Enter Text"
+ labelPlacement="outside"
+ />
+
+
+ {slug.length === 0 && errors.slug && errors.slug.message}
+
+
+ setNewTags(e.target.value)}
+ onKeyDown={handleKeyDown}
+ placeholder="Tambahkan tag baru dan tekan Enter"
+ />
+
+
+ {selectedContentType === "single-article" ? (
+
+ {tags.length === 0 && errors.tags && errors.tags.message}
+
+
+ {tags.map((tag, index) => (
+ handleClose(tag)}
+ >
+ {tag}
+
+ ))}
+
+
+ singleArticleId(data)}
+ />
+
+ ) : selectedContentType === "bulk-article" ? (
+
+ {collectSingleArticleId.length > 0 &&
+ collectSingleArticleId.map((data) => (
+
+ ))}
+
+ {selectedGeneratedArticleId &&
+ collectSingleArticleId.includes(selectedGeneratedArticleId) &&
+ (selectedGeneratedArticleId && content !== "" ? (
+
+ setContent(newContent)}
+ className="dark:text-black"
+ />
+
+ ) : selectedGeneratedArticleId && content == "" ? (
+ Description
+
+ {content?.length === 0 &&
+ errors?.description &&
+ errors?.description?.message}
+
+ Select Article ID
+ ) : ( + "" + ))} +
+ bulkArticleId(data)} />
+
+ ) : selectedContentType === "rewrite" ? (
+
+ {collectBulkArticleId.length > 0 &&
+ collectBulkArticleId.map((data) => (
+
+ ))}
+
+ {selectedGeneratedArticleId &&
+ collectBulkArticleId.includes(selectedGeneratedArticleId) &&
+ (selectedGeneratedArticleId && content !== "" ? (
+
+ setContent(newContent)}
+ className="dark:text-black"
+ />
+
+ ) : selectedGeneratedArticleId && content == "" ? (
+ Description
+
+ {content?.length === 0 &&
+ errors?.description &&
+ errors?.description?.message}
+
+ Select Article ID
+ ) : ( + "" + ))} +
+ rewriteArticleId(data)}
+ initTranscript={generatedTranscriptId}
+ />
+
+ ) : selectedContentType === "speech-to-text" ? (
+
+ {collectRewriteArticleId.length > 0 &&
+ collectRewriteArticleId.map((data) => (
+
+ ))}
+
+ {selectedGeneratedArticleId &&
+ collectRewriteArticleId.includes(selectedGeneratedArticleId) &&
+ (selectedGeneratedArticleId && content !== "" ? (
+
+ setContent(newContent)}
+ className="dark:text-black"
+ />
+
+ ) : selectedGeneratedArticleId && content == "" ? (
+ Description
+
+ {content?.length === 0 &&
+ errors?.description &&
+ errors?.description?.message}
+
+ Select Article ID
+ ) : ( + "" + ))} +
+
+ Attachment (Opsional)
+
+
+
+ {selectedImages?.length > 0 ? (
+
+
+ ) : (
+ ""
+ )}
+ Pratinjau:
+
+ {selectedImages.map((image, index) => (
+
+
+ handleRemoveImage(index)}
+ >
+ X
+
+ })
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
= ({ updateSidebarData }) => {
return (
- {!isOpen && (
-
-
-
- )}
-
-
- {sideBarDummyData
- ? sideBarDummyData?.map((list: any, index: number) =>
- list.isGroup ? (
-
+
+ {sideBarDummyData
+ ? sideBarDummyData?.map((list: any, index: number) =>
+ list.isGroup ? (
+
- )}
-
- ) : (
- (
-
+
+
+ )}
+
+ ) : (
+ (
+
+ : ""}
+
+
- 
- {/* {isOpen && ACME} */}
-
- {isOpen && (
-
+
- {/* {isOpen && ACME} */}
-
+ {!isOpen && (
+
- {/*
+
+
)}
-
-
*/}
-
-
-
-
-
-
-
- Profile Settings
-
- Analytics
-
-
- Help & Feedback
-
-
- Log Out
-
-
-
-
- Signed in as
-@tonyreichert
-- {isOpen ? list.name : "..."} -
- ) : list.childMenu?.length < 1 ? ( - <> - {isOpen ? ( - -
- {list.icon} {isOpen && list.name}
-
-
- ) : (
-
+
+
+ {/* {isOpen && ACME} */}
+
+ {isOpen && (
+
+ )}
+
+
+
+ {/* {isOpen && ACME} */}
+
+ {isOpen && (
+
+ )}
+ + {isOpen ? list.name : "..."} +
+ ) : list.childMenu?.length < 1 ? ( + <> + {isOpen ? ( = ({ updateSidebarData }) => {
{list.icon} {isOpen && list.name}
-
+ {list.icon} {isOpen && list.name}
+
+
+ void;
+}) {
+ const [selectedTableRow, setSelectedTableRow] = useState(new Set([""]));
+ const [page, setPage] = useState(1);
+ const [search, setSearch] = useState("");
+ const [totalPage, setTotalPage] = useState(1);
+ const [dataTableTranscript, setDataTableTranscript] = useState([]);
+
+ useEffect(() => {
+ initFetch();
+ }, [page]);
+
+ const initFetch = async () => {
+ loading();
+ const res = await getListArticleDraft({
+ query: search,
+ page: page,
+ userId: "humasClientIdtest",
+ limit: 10,
+ status: [0, 2],
+ isSingle: true,
+ createdBy: "123123",
+ sort: [
+ {
+ column: "id",
+ sort: "desc",
+ },
+ ],
+ });
+ close();
+ setTotalPage(Math.ceil(res?.data?.total / 10));
+ const data = res?.data?.data;
+ const startIndex = 10 * (page - 1);
+ let iterate = 0;
+ const newData = data?.map((value: any) => {
+ iterate++;
+ value.no = startIndex + iterate;
+ return value;
+ });
+ setDataTableTranscript(newData);
+ };
+
+ const renderCell = useCallback((article: any, columnKey: any) => {
+ const cellValue = article[columnKey];
+
+ switch (columnKey) {
+ case "articleBody":
+ return
+
+ );
+}
diff --git a/components/table/disestages/transcript-draft-table.tsx b/components/table/disestages/transcript-draft-table.tsx
new file mode 100644
index 0000000..13ffdc3
--- /dev/null
+++ b/components/table/disestages/transcript-draft-table.tsx
@@ -0,0 +1,192 @@
+"use client";
+import {
+ TableCell,
+ TableRow,
+ Table,
+ TableHeader,
+ TableColumn,
+ TableBody,
+ Pagination,
+ Checkbox,
+ Dropdown,
+ DropdownTrigger,
+ DropdownMenu,
+ DropdownItem,
+ Input,
+} from "@nextui-org/react";
+import { Button } from "@nextui-org/button";
+import React, {
+ Key,
+ Suspense,
+ useCallback,
+ useEffect,
+ useMemo,
+ useState,
+} from "react";
+import { SearchIcon, UserIcon } from "@/components/icons";
+
+import { close, loading } from "@/config/swal";
+
+import { getListTranscript } from "@/service/generate-article";
+import { textEllipsis } from "@/utils/global";
+
+const columns = [
+ { name: "No", uid: "no" },
+ { name: "Title", uid: "title" },
+ { name: "Prompt", uid: "prompt" },
+ { name: "Content", uid: "content" },
+];
+
+export default function TranscriptDraftTable(props: {
+ initTranscriptId?: string;
+ transriptContent: (data: string) => void;
+}) {
+ const [selectedTableRow, setSelectedTableRow] = useState(new Set([""]));
+ const [page, setPage] = useState(1);
+ const [search, setSearch] = useState("");
+ const [totalPage, setTotalPage] = useState(1);
+ const [dataTableTranscript, setDataTableTranscript] = useState([]);
+
+ useEffect(() => {
+ setSelectedTableRow(new Set([props.initTranscriptId]));
+ const now = findDataTable(Array.from(selectedTableRow)[0]);
+ props.transriptContent(now?.content ? now?.content : "");
+ }, [dataTableTranscript, props.initTranscriptId]);
+
+ useEffect(() => {
+ initFetch();
+ }, [page]);
+
+ const initFetch = async () => {
+ loading();
+ const res = await getListTranscript({
+ query: search || "",
+ page: page,
+ clientId: "humasClientIdTest",
+ limit: 10,
+ createdBy: null,
+
+ status: [0, 2],
+ sort: [
+ {
+ column: "id",
+ sort: "desc",
+ },
+ ],
+ });
+ close();
+ setTotalPage(Math.ceil(res?.data?.total / 10));
+ const data = res?.data?.data;
+ const startIndex = 10 * (page - 1);
+ let iterate = 0;
+ const newData = data?.map((value: any) => {
+ iterate++;
+ value.no = startIndex + iterate;
+ return value;
+ });
+ setDataTableTranscript(newData);
+ };
+
+ const renderCell = useCallback((article: any, columnKey: any) => {
+ const cellValue = article[columnKey];
+
+ switch (columnKey) {
+ case "content":
+ return
+
+ );
+}
diff --git a/components/ui/breadcrumb.tsx b/components/ui/breadcrumb.tsx
index 8bf17b1..46041b8 100644
--- a/components/ui/breadcrumb.tsx
+++ b/components/ui/breadcrumb.tsx
@@ -34,7 +34,7 @@ export const Breadcrumb = () => {
};
return (
-
{textEllipsis(cellValue, 200)}
; + default: + return cellValue; + } + }, []); + + const handleSelected = (e: any) => { + setSelectedTableRow(new Set([e.currentKey])); + const now = findDataTable(e.currentKey); + props.articleContent(now?.articleBody ? now?.articleBody : ""); + }; + + const handleSearch = () => { + initFetch(); + }; + + const findDataTable = (data: any) => { + const temp = dataTableTranscript.find((item: any) => item.id == data); + return temp; + }; + + return ( +
+
+
+ setSearch(e.target.value)}
+ label=""
+ variant="bordered"
+ placeholder="Search"
+ labelPlacement="outside"
+ />
+
+
+
+
+
+
+
+
+
+ setPage(page)}
+ />
+
+ {textEllipsis(cellValue, 200)}
; + default: + return cellValue; + } + }, []); + + const handleSelected = (e: any) => { + setSelectedTableRow(new Set([e.currentKey])); + const now = findDataTable(e.currentKey); + props.transriptContent(now?.content ? now?.content : ""); + }; + + const handleSearch = () => { + initFetch(); + }; + + const findDataTable = (data: any) => { + const temp = dataTableTranscript.find((item: any) => item.id == data); + return temp; + }; + + return ( +
+
+
+ setSearch(e.target.value)}
+ label=""
+ variant="bordered"
+ placeholder="Search"
+ labelPlacement="outside"
+ />
+
+
+
+
+
+
+
+
+
+ setPage(page)}
+ />
+
+
+
diff --git a/package-lock.json b/package-lock.json
index 222a993..29bb911 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -59,7 +59,8 @@
"tailwind-variants": "^0.1.18",
"tailwindcss": "3.3.5",
"typescript": "5.0.4",
- "zod": "^3.23.8"
+ "zod": "^3.23.8",
+ "zustand": "^5.0.1"
}
},
"node_modules/@aashutoshrathi/word-wrap": {
@@ -7290,6 +7291,34 @@
"funding": {
"url": "https://github.com/sponsors/colinhacks"
}
+ },
+ "node_modules/zustand": {
+ "version": "5.0.1",
+ "resolved": "https://registry.npmjs.org/zustand/-/zustand-5.0.1.tgz",
+ "integrity": "sha512-pRET7Lao2z+n5R/HduXMio35TncTlSW68WsYBq2Lg1ASspsNGjpwLAsij3RpouyV6+kHMwwwzP0bZPD70/Jx/w==",
+ "engines": {
+ "node": ">=12.20.0"
+ },
+ "peerDependencies": {
+ "@types/react": ">=18.0.0",
+ "immer": ">=9.0.6",
+ "react": ">=18.0.0",
+ "use-sync-external-store": ">=1.2.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ },
+ "immer": {
+ "optional": true
+ },
+ "react": {
+ "optional": true
+ },
+ "use-sync-external-store": {
+ "optional": true
+ }
+ }
}
}
}
diff --git a/package.json b/package.json
index 324c49e..0e521e9 100644
--- a/package.json
+++ b/package.json
@@ -60,6 +60,7 @@
"tailwind-variants": "^0.1.18",
"tailwindcss": "3.3.5",
"typescript": "5.0.4",
- "zod": "^3.23.8"
+ "zod": "^3.23.8",
+ "zustand": "^5.0.1"
}
}
diff --git a/service/generate-article.ts b/service/generate-article.ts
new file mode 100644
index 0000000..9d9bbda
--- /dev/null
+++ b/service/generate-article.ts
@@ -0,0 +1,190 @@
+import { httpGet, httpPost } from "@/services/http-config/disestages-services";
+
+interface GenerateKeywordsAndTitleRequestData {
+ keyword: string;
+ style: string;
+ website: string;
+ connectToWeb: boolean;
+ lang: string;
+ pointOfView: string;
+ clientId: string;
+}
+
+interface GenerateArticleRequest {
+ advConfig: string;
+ style: string;
+ website: string;
+ connectToWeb: boolean;
+ lang: string;
+ pointOfView: string;
+ title: string;
+ imageSource: string;
+ mainKeyword: string;
+ additionalKeywords: string;
+ targetCountry: null;
+ articleSize: string;
+ projectId: number;
+ createdBy: string;
+ clientId: string;
+}
+
+type BulkArticleRequest = {
+ style: string;
+ website: string;
+ connectToWeb: boolean;
+ lang: string;
+ pointOfView: string;
+ imageSource: string;
+ targetCountry: null;
+ articleSize: string;
+ projectId: number;
+ data: { title: string; mainKeyword: string; additionalKeywords: string }[];
+ createdBy: string;
+ clientId: string;
+};
+
+interface ContentRewriteRequest {
+ advConfig: string;
+ context: string | null;
+ style: string;
+ sentiment: string;
+ clientId: string;
+ createdBy: string;
+ contextType: string;
+ urlContext: string | null;
+ lang: string;
+}
+
+export type ContentBankRequest = {
+ query: string;
+ page: number;
+ userId: string;
+ limit: number;
+ status: number[];
+ isSingle: boolean;
+ createdBy: string;
+ sort: { column: string; sort: string }[];
+};
+
+export async function getGenerateTitle(
+ data: GenerateKeywordsAndTitleRequestData
+) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/generate-title", headers, data);
+}
+
+export async function getGenerateKeywords(
+ data: GenerateKeywordsAndTitleRequestData
+) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/generate-keywords", headers, data);
+}
+
+export async function generateDataArticle(data: GenerateArticleRequest) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/save-article", headers, data);
+}
+
+export async function approveArticle(props: { id: number[] }) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/approve-article", headers, props);
+}
+export async function rejectArticle(props: { id: number[] }) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/reject-article", headers, props);
+}
+
+export async function getGenerateTopicKeywords(data: {
+ keyword: string;
+ count: number;
+}) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/generate-topic-keywords", headers, data);
+}
+
+export async function saveBulkArticle(data: BulkArticleRequest) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/save-bulk-article", headers, data);
+}
+
+export async function getDetailArticle(id: number) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpGet(`ai-writer/article/findArticleById/${id}`, headers);
+}
+
+export async function generateSpeechToText(data: any) {
+ const headers = {
+ "content-type": "multipart/form-data",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/speech-to-text", headers, data);
+}
+
+export async function getTranscriptById(id: number) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpGet(`ai-writer/speech-to-text/findById/${id}`, headers);
+}
+
+export async function getGenerateRewriter(data: ContentRewriteRequest) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/create-rewriter", headers, data);
+}
+
+export async function getListTranscript(data: any) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/speech-to-text/datatable", headers, data);
+}
+
+export async function getListArticleDraft(data: ContentBankRequest) {
+ const headers = {
+ "content-type": "application/json",
+ Authorization:
+ "Basic bmdETFBQaW9ycGx6bncyalRxVmUzWUZDejV4cUtmVUo6UHJEaERXUmNvdkJSNlc1Sg==",
+ };
+ return await httpPost("ai-writer/article/datatable", headers, data);
+}
diff --git a/services/http-config/disestages-instance.ts b/services/http-config/disestages-instance.ts
new file mode 100644
index 0000000..ffbac6f
--- /dev/null
+++ b/services/http-config/disestages-instance.ts
@@ -0,0 +1,12 @@
+import axios from "axios";
+
+const baseURL = "https://disestages.com/api";
+
+const axiosDisestagesInstance = axios.create({
+ baseURL,
+ headers: {
+ "content-type": "application/json",
+ },
+});
+
+export default axiosDisestagesInstance;
diff --git a/services/http-config/disestages-services.ts b/services/http-config/disestages-services.ts
new file mode 100644
index 0000000..cf07e03
--- /dev/null
+++ b/services/http-config/disestages-services.ts
@@ -0,0 +1,47 @@
+import axiosDisestagesInstance from "./disestages-instance";
+
+export async function httpPost(pathUrl: any, headers: any, data?: any) {
+ const response = await axiosDisestagesInstance
+ .post(pathUrl, data, { headers })
+ .catch(function (error) {
+ console.log(error);
+ return error.response;
+ });
+ console.log("Response base svc : ", response);
+ if (response?.status == 200 || response?.status == 201) {
+ return {
+ error: false,
+ message: "success",
+ data: response?.data,
+ };
+ } else {
+ return {
+ error: true,
+ message: response?.data?.message || response?.data || null,
+ data: null,
+ };
+ }
+}
+
+export async function httpGet(pathUrl: any, headers: any) {
+ const response = await axiosDisestagesInstance
+ .get(pathUrl, { headers })
+ .catch(function (error) {
+ console.log(error);
+ return error.response;
+ });
+ console.log("Response base svc : ", response);
+ if (response?.status == 200 || response?.status == 201) {
+ return {
+ error: false,
+ message: "success",
+ data: response?.data,
+ };
+ } else {
+ return {
+ error: true,
+ message: response?.data?.message || response?.data || null,
+ data: null,
+ };
+ }
+}
diff --git a/store/generated-article-store.tsx b/store/generated-article-store.tsx
new file mode 100644
index 0000000..c033a84
--- /dev/null
+++ b/store/generated-article-store.tsx
@@ -0,0 +1,32 @@
+import { create } from "zustand";
+
+interface targetStore {
+ articleIds: { singleArticle: number[]; bulkArticle: number[] };
+ setArticleIds: (newTarget: {
+ singleArticle: number[];
+ bulkArticle: number[];
+ }) => void;
+}
+
+const getInitialTarget = () => {
+ if (typeof localStorage !== "undefined") {
+ const stored = localStorage.getItem("generated-article");
+ const initial = stored
+ ? JSON.parse(stored)
+ : { singleArticle: [], bulkArticle: [] };
+ return initial;
+ }
+};
+
+const generatedArticleIds = create((set) => ({
+ articleIds: getInitialTarget(),
+ setArticleIds: (newTarget: {
+ singleArticle: number[];
+ bulkArticle: number[];
+ }) => {
+ localStorage.setItem("generated-article", JSON.stringify(newTarget));
+ set({ articleIds: newTarget });
+ },
+}));
+
+export default generatedArticleIds;
diff --git a/utils/global.tsx b/utils/global.tsx
index 289a819..529d242 100644
--- a/utils/global.tsx
+++ b/utils/global.tsx
@@ -70,3 +70,25 @@ const LoadScript = () => {
};
export default LoadScript;
+
+export function delay(ms: number) {
+ return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+export function textEllipsis(
+ str: string,
+ maxLength: number,
+ { side = "end", ellipsis = "..." } = {}
+) {
+ if (str !== undefined && str?.length > maxLength) {
+ switch (side) {
+ case "start":
+ return ellipsis + str.slice(-(maxLength - ellipsis.length));
+
+ case "end":
+ default:
+ return str.slice(0, maxLength - ellipsis.length) + ellipsis;
+ }
+ }
+ return str;
+}