unlimit post

miicolas · Aug 16, 2024 · d08c069 · d08c069
1 parent dbf9658
commit d08c069
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 42 deletions.
diff --git a/src/components/cards/cardBlog.tsx b/src/components/cards/cardBlog.tsx
@@ -14,6 +14,14 @@ export default async function CardBlog({
   isAdmin,
 }: CardBlogProps) {
   const router = useRouter();
+
+  const descriptionLength = description.length;
+
+  const descriptionLimit = 50;
+
+  const limitedDescription = description.slice(0, descriptionLimit);
+
+
   const handleDelete = async () => {
     try {
       const deletePost = async () => {
@@ -42,18 +50,18 @@ export default async function CardBlog({
 
   return (
     <>
-      <div className="border border-gray-200 p-4 hover:shadow-lg transition-all duration-300 ease-out h-40 rounded-lg flex flex-col justify-between">
+      <div className="border border-gray-200 p-4 hover:shadow-lg transition-all duration-300 ease-out  rounded-lg flex flex-col justify-between">
         <div>
-          <div className="flex items-center justify-between">
+          <div className="flex items-center justify-between gap-4">
             <div>
               <h3 className="text-xl font-bold">{title}</h3>
             </div>
             <div>
               <p className="text-gray-500">{date}</p>
             </div>
           </div>
-          <div>
-            <p className="text-gray-500">{description}</p>
+          <div className="my-2">
+            <p className="text-gray-500">{limitedDescription}...</p>
           </div>
         </div>
         <div>

diff --git a/src/components/text-editor.tsx b/src/components/text-editor.tsx
@@ -25,7 +25,6 @@ const RichTextEditor = ({
 
 
 
-  const limit = 100;
 
   const editor = useEditor({
     editorProps: {
@@ -66,9 +65,7 @@ const RichTextEditor = ({
         autolink: true,
         defaultProtocol: 'https',
       }),
-      CharacterCount.configure({
-        limit,
-      }),
+      CharacterCount.configure(),
       CodeBlock.configure({
         HTMLAttributes: {
           class: "border-gray-300 rounded-md p-2 bg-gray-500 text-white font-code",
@@ -113,45 +110,16 @@ const RichTextEditor = ({
     }
   }, [editor])
 
-  const percentage = editor
-    ? Math.round((100 / limit) * editor.storage.characterCount.characters())
-    : 0
+
 
   return (
     <>
       <EditorContent editor={editor} />
       {editor ? <RichTextEditorToolbar editor={editor} setLink={setLink} addImage={addImage} /> : null}
-      <div className={`flex flex-row items-center gap-2 text-sms ${editor?.storage.characterCount.characters() === limit ? 'text-red-500' : 'text-gray-500'}`}>
-        <svg
-          height="10"
-          width="10"
-          viewBox="0 0 10 10"
-        >
-          <circle
-            r="5"
-            cx="5"
-            cy="5"
-            fill="#e9ecef"
-          />
-          <circle
-            r="2.5"
-            cx="5"
-            cy="5"
-            fill="transparent"
-            stroke="currentColor"
-            strokeWidth="5"
-            strokeDasharray={`calc(${percentage} * 31.4 / 100) 31.4`}
-            transform="rotate(-90) translate(-10)"
-          />
-          <circle
-            r="3"
-            cx="5"
-            cy="5"
-            fill="white"
-          />
-        </svg>
-
-        {editor?.storage.characterCount.characters()} / {limit} characters
+      <div className={`flex flex-row items-center gap-2 text-sms text-gray-500`}>
+
+
+        {editor?.storage.characterCount.characters()} characters
 
       </div>
     </>