add prettier formatter to all file

components/blog/detail/Caption.js

@@ -1,47 +1,47 @@
-import CustomLoading from '@/app/component/loading/Custom'
-import MultilineLoading from '@/app/component/loading/Multiline'
-import Image from 'next/image'
-import React from 'react'
+import CustomLoading from "@/app/component/loading/Custom";
+import MultilineLoading from "@/app/component/loading/Multiline";
+import Image from "next/image";
+import React from "react";
 
 function Caption({ data, loading }) {
-    return (
-        <>
-            <CustomLoading loading={loading} width='full' height={500}>
-                <Image
-                    className="rounded-[8px] overflow-hidden w-full"
-                    src={data.cover_first}
-                    alt="cover-blog"
-                    height={570}
-                    width={808}
-                />
-            </CustomLoading>
-            <div className={loading ? 'my-4' : ''}>
-                <MultilineLoading loading={loading} width='full' height={18} line={20}>
-                    <div
-                        className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
-                        dangerouslySetInnerHTML={{ __html: data.caption }}
-                    />
-                </MultilineLoading>
-            </div>
-            <CustomLoading loading={loading} width='full' height={500}>
-                <Image
-                    className="rounded-[8px] overflow-hidden w-full"
-                    src={data.cover_second}
-                    alt="cover-blog"
-                    height={570}
-                    width={808}
-                />
-            </CustomLoading>
-            <div className={loading ? 'my-4' : ''}>
-                <MultilineLoading loading={loading} width='full' height={18} line={20}>
-                    <div
-                        className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
-                        dangerouslySetInnerHTML={{ __html: data.caption }}
-                    />
-                </MultilineLoading>
-            </div>
-        </>
-    )
+  return (
+    <>
+      <CustomLoading loading={loading} width="full" height={500}>
+        <Image
+          className="rounded-[8px] overflow-hidden w-full"
+          src={data.cover_first}
+          alt="cover-blog"
+          height={570}
+          width={808}
+        />
+      </CustomLoading>
+      <div className={loading ? "my-4" : ""}>
+        <MultilineLoading loading={loading} width="full" height={18} line={20}>
+          <div
+            className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
+            dangerouslySetInnerHTML={{ __html: data.caption }}
+          />
+        </MultilineLoading>
+      </div>
+      <CustomLoading loading={loading} width="full" height={500}>
+        <Image
+          className="rounded-[8px] overflow-hidden w-full"
+          src={data.cover_second}
+          alt="cover-blog"
+          height={570}
+          width={808}
+        />
+      </CustomLoading>
+      <div className={loading ? "my-4" : ""}>
+        <MultilineLoading loading={loading} width="full" height={18} line={20}>
+          <div
+            className="my-[12px] sm:my-[16px] md:my-[20px] lg:my-[24px] text-[#525252] text-[14px] md:text-[15px] lg:text-[16px] font-normal leading-[26px] sm:leading-[28px] md:leading-[30px] lg:leading-[32px]"
+            dangerouslySetInnerHTML={{ __html: data.caption }}
+          />
+        </MultilineLoading>
+      </div>
+    </>
+  );
 }
 
-export default Caption
+export default Caption;

components/blog/detail/SocialMedia.js

@@ -1,30 +1,26 @@
-import CircularLoading from "@/app/component/loading/Circular"
-import LinkedinB from "@/components/icons/LinkedinB"
-import TelegramB from "@/components/icons/TelegramB"
-import WhatsappB from "@/components/icons/WhatsappB"
+import CircularLoading from "@/app/component/loading/Circular";
+import LinkedinB from "@/components/icons/LinkedinB";
+import TelegramB from "@/components/icons/TelegramB";
+import WhatsappB from "@/components/icons/WhatsappB";
 
-const socials = [
-    <WhatsappB />,
-    <TelegramB />,
-    <LinkedinB />
-]
+const socials = [<WhatsappB />, <TelegramB />, <LinkedinB />];
 
 function SocialMedia({ loading }) {
-    return (
-        <ul className="flex mt-0 sm:mt-[3px] md:mt-[6px] lg:mt-[8px] pb-[16px] sm:pb-[21px] md:pb-[27px] lg:pb-[32px] relative items-center justify-end gap-4">
-            {socials.map((item, idx) => (
-                <CircularLoading width={36} height={36} loading={loading}>
-                    <li
-                        key={idx}
-                        className="bg-[#EFEFEF] rounded-full hover-rotate-icon p-[9px]"
-                    >
-                        {item}
-                    </li>
-                </CircularLoading>
-            ))}
-            <span className="absolute right-1/2 translate-x-1/2 bottom-0 w-[calc(100%-32px-36px)] h-px bg-[#D7D7D7] block"></span>
-        </ul>
-    )
+  return (
+    <ul className="flex mt-0 sm:mt-[3px] md:mt-[6px] lg:mt-[8px] pb-[16px] sm:pb-[21px] md:pb-[27px] lg:pb-[32px] relative items-center justify-end gap-4">
+      {socials.map((item, idx) => (
+        <CircularLoading width={36} height={36} loading={loading}>
+          <li
+            key={idx}
+            className="bg-[#EFEFEF] rounded-full hover-rotate-icon p-[9px]"
+          >
+            {item}
+          </li>
+        </CircularLoading>
+      ))}
+      <span className="absolute right-1/2 translate-x-1/2 bottom-0 w-[calc(100%-32px-36px)] h-px bg-[#D7D7D7] block"></span>
+    </ul>
+  );
 }
 
-export default SocialMedia
+export default SocialMedia;

components/blog/detail/commentUser/AddComment.js

@@ -1,19 +1,21 @@
-import { Button } from '@mui/material'
-import React from 'react'
+import { Button } from "@mui/material";
+import React from "react";
 
 function AddComment() {
-    return (
-        <div className='flex flex-col md:flex-row gap-y-[12px] items-start md:items-center justify-start gap-[16px] my-[12px] mb-[16] sm:!my-[16px] md:!my-[20px] lg:!my-[24px]'>
-            <p className='text-[#616161] text-[16px] font-normal'>شما هم نظر خود را به اشتراک بگذارید:</p>
-            <Button
-                variant='outlined'
-                className='!w-full md:!w-fit !border !border-[#5559CE] !rounded-[4px] 
-                !px-[38px] !py-[6px] md:!py-[8px] lg:!py-[9px]'
-            >
-                ثبت نظر
-            </Button>
-        </div>
-    )
+  return (
+    <div className="flex flex-col md:flex-row gap-y-[12px] items-start md:items-center justify-start gap-[16px] my-[12px] mb-[16] sm:!my-[16px] md:!my-[20px] lg:!my-[24px]">
+      <p className="text-[#616161] text-[16px] font-normal">
+        شما هم نظر خود را به اشتراک بگذارید:
+      </p>
+      <Button
+        variant="outlined"
+        className="!w-full md:!w-fit !border !border-[#5559CE] !rounded-[4px] 
+                !px-[38px] !py-[6px] md:!py-[8px] lg:!py-[9px]"
+      >
+        ثبت نظر
+      </Button>
+    </div>
+  );
 }
 
-export default AddComment
+export default AddComment;

components/blog/detail/commentUser/index.js

@@ -1,19 +1,19 @@
-import AnimationTextHead from '@/app/component/AnimationTextHead'
-import Comment from '@/app/component/comment'
-import Underline from '@/components/icons/Underline'
-import React from 'react'
-import AddComment from './AddComment'
+import AnimationTextHead from "@/app/component/AnimationTextHead";
+import Comment from "@/app/component/comment";
+import Underline from "@/components/icons/Underline";
+import React from "react";
+import AddComment from "./AddComment";
 
 function CommentUser({ data, loading }) {
-    return (
-        <div className='mt-[12px] sm:mt-[16px] md:mt-[20px] lg:mt-[24px]'>
-            <AnimationTextHead name='zoom-in-up' text='نظرات'>
-                <Underline />
-            </AnimationTextHead>
-            <AddComment />
-            <Comment data={data} loading={loading} />
-        </div>
-    )
+  return (
+    <div className="mt-[12px] sm:mt-[16px] md:mt-[20px] lg:mt-[24px]">
+      <AnimationTextHead name="zoom-in-up" text="نظرات">
+        <Underline />
+      </AnimationTextHead>
+      <AddComment />
+      <Comment data={data} loading={loading} />
+    </div>
+  );
 }
 
-export default CommentUser
+export default CommentUser;

components/blog/detail/index.js

@@ -3,13 +3,13 @@ import SocialMedia from "./SocialMedia";
 import CommentUser from "./commentUser";
 
 function Detail({ data, loading }) {
-    return (
-        <div className="w-full lg:w-[68%]">
-            <Caption data={data} loading={loading} />
-            <SocialMedia loading={loading} />
-            <CommentUser data={data} loading={loading} />
-        </div>
-    )
+  return (
+    <div className="w-full lg:w-[68%]">
+      <Caption data={data} loading={loading} />
+      <SocialMedia loading={loading} />
+      <CommentUser data={data} loading={loading} />
+    </div>
+  );
 }
 
-export default Detail
+export default Detail;