From aeff047225b1e436fa94cab52cc6f1f9581356a1 Mon Sep 17 00:00:00 2001
From: Syauqizaidan Khairan Khalaf <syaokay@gmail.com>
Date: Sat, 17 Feb 2024 14:03:20 +0700
Subject: [PATCH] chore: renaming storybook examples

---
 .../stories/examples/DataDisplay.stories.tsx  |  7 ++-
 .../src/stories/examples/Footer.stories.tsx   | 52 +++++++++----------
 .../examples/TablePagination.stories.tsx      |  2 +-
 3 files changed, 30 insertions(+), 31 deletions(-)

diff --git a/packages/ui/src/stories/examples/DataDisplay.stories.tsx b/packages/ui/src/stories/examples/DataDisplay.stories.tsx
index 105d789..29901ae 100644
--- a/packages/ui/src/stories/examples/DataDisplay.stories.tsx
+++ b/packages/ui/src/stories/examples/DataDisplay.stories.tsx
@@ -4,13 +4,13 @@ import { Table, TableBody, TableCell, TableRow } from '@bootwind/table'
 import { HiPaperClip } from 'react-icons/hi2'
 
 export default {
-    title: 'Examples/DataDisplay',
+    title: '❖ • Examples/Data Display',
     argTypes: {},
 } as Meta;
 
 export const CardWithTable = () => {
     return (
-        <Card noPadding title="Applicant Information" className="max-w-[800px] overflow-hidden" subtitle="Personal details and application."  cardHeaderBorder>
+        <Card noPadding title="Applicant Information" className="max-w-[800px] overflow-hidden" subtitle="Personal details and application." cardHeaderBorder>
             <Table variant="striped">
                 <TableBody>
                     <TableRow>
@@ -35,7 +35,7 @@ export const CardWithTable = () => {
                             <ul>
                                 <li className="flex between items-center gap-2 justify-between">
                                     <div className="name flex items-center">
-                                        <HiPaperClip/>
+                                        <HiPaperClip />
                                         <span>resume_backend_developer.zip</span>
                                     </div>
                                     <a href="#">Download</a>
@@ -48,4 +48,3 @@ export const CardWithTable = () => {
         </Card>
     )
 }
-  
\ No newline at end of file
diff --git a/packages/ui/src/stories/examples/Footer.stories.tsx b/packages/ui/src/stories/examples/Footer.stories.tsx
index 9cf47d5..05292e7 100644
--- a/packages/ui/src/stories/examples/Footer.stories.tsx
+++ b/packages/ui/src/stories/examples/Footer.stories.tsx
@@ -7,7 +7,7 @@ import { Input } from '@bootwind/forms'
 import { Button } from '@bootwind/button'
 
 export default {
-    title: 'Examples/Footer',
+    title: '❖ • Examples/Footer',
     argTypes: {},
 } as Meta;
 
@@ -30,13 +30,13 @@ export const FooterWithNewsletter = () => {
                                         <h4>{menu}</h4>
                                     </div>
                                     <div className="footer-menu-items ">
-                                            {menus[menu as keyof typeof menus].map(item => {
-                                                return (
-                                                    <div className="footer-menu-item mb-5">
-                                                        <a href="#" className="color-default">{item}</a>
-                                                    </div>
-                                                )
-                                            })}
+                                        {menus[menu as keyof typeof menus].map(item => {
+                                            return (
+                                                <div className="footer-menu-item mb-5">
+                                                    <a href="#" className="color-default">{item}</a>
+                                                </div>
+                                            )
+                                        })}
                                     </div>
                                 </div>
                             ))
@@ -45,7 +45,7 @@ export const FooterWithNewsletter = () => {
                     <div className="footer-newsletter">
                         <h4 className="font-bold text-lg mb-5">Newsletter</h4>
                         <p className="mb-8">Be the first one to know  about discounts, offers and events. Unsubscribe whenever you like.</p>
-                        <Input placeholder="Enter your email" leftSection={<HiEnvelope/>} rightSection={<Button className="mr-9">Submit</Button>}></Input>
+                        <Input placeholder="Enter your email" leftSection={<HiEnvelope />} rightSection={<Button className="mr-9">Submit</Button>}></Input>
                     </div>
                 </section>
                 <section className="footer-copyright text-center py-5">
@@ -59,14 +59,14 @@ const SocialMediaIcons = () => (
     <div className="social-media">
         <ul className="flex gap-3">
             {
-            [<BiLogoFacebookCircle/>, <BiLogoYoutube/>, <BiLogoDribbble/>, <BiLogoFigma/>, <BiLogoWhatsapp/>].map(logo => {
-                return (
-                <li>
-                    <a href="#" className="p-3 bg-indigo-100 block rounded-full">
-                        {logo}
-                    </a>
-                </li>
-                )
+                [<BiLogoFacebookCircle />, <BiLogoYoutube />, <BiLogoDribbble />, <BiLogoFigma />, <BiLogoWhatsapp />].map(logo => {
+                    return (
+                        <li>
+                            <a href="#" className="p-3 bg-indigo-100 block rounded-full">
+                                {logo}
+                            </a>
+                        </li>
+                    )
                 })
             }
         </ul>
@@ -81,9 +81,9 @@ export const FooterWithLogo = () => {
                     <div className="footer-left pr-48">
                         <h4 className="font-bold text-lg mb-5">Logo</h4>
                         <p className="mb-8">
-                        We ara a lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat... Read More
+                            We ara a lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat... Read More
                         </p>
-                        <SocialMediaIcons/>
+                        <SocialMediaIcons />
                     </div>
                     <div className="footer-menus grid lg:grid-cols-3">
                         {
@@ -93,13 +93,13 @@ export const FooterWithLogo = () => {
                                         <h4>{menu}</h4>
                                     </div>
                                     <div className="footer-menu-items ">
-                                            {menus[menu as keyof typeof menus].map(item => {
-                                                return (
-                                                    <div className="footer-menu-item mb-5">
-                                                        <a href="#" className="color-default">{item}</a>
-                                                    </div>
-                                                )
-                                            })}
+                                        {menus[menu as keyof typeof menus].map(item => {
+                                            return (
+                                                <div className="footer-menu-item mb-5">
+                                                    <a href="#" className="color-default">{item}</a>
+                                                </div>
+                                            )
+                                        })}
                                     </div>
                                 </div>
                             ))
diff --git a/packages/ui/src/stories/examples/TablePagination.stories.tsx b/packages/ui/src/stories/examples/TablePagination.stories.tsx
index 1b71942..25e2174 100644
--- a/packages/ui/src/stories/examples/TablePagination.stories.tsx
+++ b/packages/ui/src/stories/examples/TablePagination.stories.tsx
@@ -17,7 +17,7 @@ const columns = [
 ];
 
 export default {
-  title: 'Examples/Table with Pagination',
+  title: '❖ • Examples/Table with Pagination',
   component: Pagination,
   argTypes: {},
 } as Meta;