Refactor hero banner and popular product section

1 files changed, 22 insertions, 0 deletions

diff --git a/src/components/skeleton/PopularProductSkeleton.jsx b/src/components/skeleton/PopularProductSkeleton.jsx
new file mode 100644
index 00000000..0aea5c59
--- /dev/null
+++ b/src/components/skeleton/PopularProductSkeleton.jsx
@@ -0,0 +1,22 @@
+import DesktopView from '@/core/components/views/DesktopView'
+import MobileView from '@/core/components/views/MobileView'
+import Skeleton from 'react-loading-skeleton'
+
+const PopularProductSkeleton = () => {
+  return (
+    <>
+      <MobileView>
+        <div className='px-4'>
+          <Skeleton count={1} className='!w-36 h-8' />
+          <Skeleton count={2} className='h-64' containerClassName='flex gap-x-2 mt-4' />
+        </div>
+      </MobileView>
+
+      <DesktopView>
+        <Skeleton count={1} className='h-full' />
+      </DesktopView>
+    </>
+  )
+}
+
+export { PopularProductSkeleton }