From 7ee342f49346d315f186057d5a649b7b833fd610 Mon Sep 17 00:00:00 2001
From: Ardeman <are.theman@gmail.com>
Date: Mon, 3 Feb 2025 17:01:56 +0800
Subject: [PATCH] feat: restructure News layout with new header and footer
 components; remove redundant files

---
 app/{pages/news => layouts}/footer-links.tsx  |  0
 .../news => layouts}/footer-newsletter.tsx    |  0
 app/{pages/news => layouts}/header-menu.tsx   |  0
 app/{pages/news => layouts}/header-search.tsx |  0
 app/{pages/news => layouts}/header-top.tsx    |  0
 app/{pages/news => layouts}/menu.ts           |  0
 app/pages/news/index.tsx                      | 32 +++----------------
 app/routes/_layout.news._index.tsx            |  4 ++-
 app/routes/_layout.news.tsx                   | 26 ++++++++++++---
 9 files changed, 29 insertions(+), 33 deletions(-)
 rename app/{pages/news => layouts}/footer-links.tsx (100%)
 rename app/{pages/news => layouts}/footer-newsletter.tsx (100%)
 rename app/{pages/news => layouts}/header-menu.tsx (100%)
 rename app/{pages/news => layouts}/header-search.tsx (100%)
 rename app/{pages/news => layouts}/header-top.tsx (100%)
 rename app/{pages/news => layouts}/menu.ts (100%)

diff --git a/app/pages/news/footer-links.tsx b/app/layouts/footer-links.tsx
similarity index 100%
rename from app/pages/news/footer-links.tsx
rename to app/layouts/footer-links.tsx
diff --git a/app/pages/news/footer-newsletter.tsx b/app/layouts/footer-newsletter.tsx
similarity index 100%
rename from app/pages/news/footer-newsletter.tsx
rename to app/layouts/footer-newsletter.tsx
diff --git a/app/pages/news/header-menu.tsx b/app/layouts/header-menu.tsx
similarity index 100%
rename from app/pages/news/header-menu.tsx
rename to app/layouts/header-menu.tsx
diff --git a/app/pages/news/header-search.tsx b/app/layouts/header-search.tsx
similarity index 100%
rename from app/pages/news/header-search.tsx
rename to app/layouts/header-search.tsx
diff --git a/app/pages/news/header-top.tsx b/app/layouts/header-top.tsx
similarity index 100%
rename from app/pages/news/header-top.tsx
rename to app/layouts/header-top.tsx
diff --git a/app/pages/news/menu.ts b/app/layouts/menu.ts
similarity index 100%
rename from app/pages/news/menu.ts
rename to app/layouts/menu.ts
diff --git a/app/pages/news/index.tsx b/app/pages/news/index.tsx
index 5fabfb1..7196647 100644
--- a/app/pages/news/index.tsx
+++ b/app/pages/news/index.tsx
@@ -1,31 +1,7 @@
-import React, { type FC, type PropsWithChildren } from 'react'
-
-import { FooterLinks } from './footer-links'
-import { FooterNewsletter } from './footer-newsletter'
-import { HeaderMenu } from './header-menu'
-import { HeaderTop } from './header-top'
-
-export const NewsPage: FC<PropsWithChildren> = ({ children }) => {
+export const NewsPage = () => {
   return (
-    <main className="relative min-h-dvh bg-[#ECECEC]">
-      <header>
-        <HeaderTop />
-        <HeaderMenu />
-      </header>
-      <div className="mx-[50px] my-[25px] grid gap-y-[25px]">
-        <img
-          src="/images/banner.png"
-          alt="banner"
-          className="h-[100px] w-full object-contain"
-        />
-        <div className="border-[.2px] border-black bg-white p-[30px]">
-          {children}
-        </div>
-      </div>
-      <footer className="grid w-full grid-cols-5 gap-16 bg-[#2E2F7C] px-16 py-20 text-white">
-        <FooterNewsletter />
-        <FooterLinks />
-      </footer>
-    </main>
+    <div className="border-[.2px] border-black bg-white p-[30px]">
+      <div>News</div>
+    </div>
   )
 }
diff --git a/app/routes/_layout.news._index.tsx b/app/routes/_layout.news._index.tsx
index db7492b..0038b88 100644
--- a/app/routes/_layout.news._index.tsx
+++ b/app/routes/_layout.news._index.tsx
@@ -1,5 +1,7 @@
+import { NewsPage } from '~/pages/news'
+
 const NewsIndexLayout = () => {
-  return <div>News</div>
+  return <NewsPage />
 }
 
 export default NewsIndexLayout
diff --git a/app/routes/_layout.news.tsx b/app/routes/_layout.news.tsx
index 318fa2d..fc5a9a2 100644
--- a/app/routes/_layout.news.tsx
+++ b/app/routes/_layout.news.tsx
@@ -1,12 +1,30 @@
 import { Outlet } from 'react-router'
 
-import { NewsPage } from '~/pages/news'
+import { FooterLinks } from '~/layouts/footer-links'
+import { FooterNewsletter } from '~/layouts/footer-newsletter'
+import { HeaderMenu } from '~/layouts/header-menu'
+import { HeaderTop } from '~/layouts/header-top'
 
 const NewsLayout = () => {
   return (
-    <NewsPage>
-      <Outlet />
-    </NewsPage>
+    <main className="relative min-h-dvh bg-[#ECECEC]">
+      <header>
+        <HeaderTop />
+        <HeaderMenu />
+      </header>
+      <div className="mx-[50px] my-[25px] grid gap-y-[25px]">
+        <img
+          src="/images/banner.png"
+          alt="banner"
+          className="h-[100px] w-full object-contain"
+        />
+        <Outlet />
+      </div>
+      <footer className="grid w-full grid-cols-5 gap-16 bg-[#2E2F7C] px-16 py-20 text-white">
+        <FooterNewsletter />
+        <FooterLinks />
+      </footer>
+    </main>
   )
 }