Cleanup, change slug for concerts

frontend/app/api/outstatic/[[...ost]]/route.js

@@ -1,5 +1,11 @@
+/* * */
+
 import { OutstaticApi } from 'outstatic';
 
+/* * */
+
 export const GET = OutstaticApi.GET;
 
+/* * */
+
 export const POST = OutstaticApi.POST;

frontend/app/outstatic/[[...ost]]/page.js

@@ -1,7 +1,11 @@
+/* * */
+
 import 'outstatic/outstatic.css';
 import { Outstatic } from 'outstatic';
 import { OstClient } from 'outstatic/client';
 
+/* * */
+
 export default async function Page({ params }) {
   const ostData = await Outstatic();
   return <OstClient ostData={ostData} params={params} />;

frontend/components/Homepage/Homepage.js

@@ -1,34 +1,31 @@
+/* * */
+
 import styles from './Homepage.module.css';
 import AppWrapper from '@/components/AppWrapper/AppWrapper';
 import HomepageLogo from '@/components/HomepageLogo/HomepageLogo';
 import HomepageIntro from '@/components/HomepageIntro/HomepageIntro';
 import HomepageNews from '@/components/HomepageNews/HomepageNews';
 import HomepageLinks from '@/components/HomepageLinks/HomepageLinks';
+import HomepageConcerts from '@/components/HomepageConcerts/HomepageConcerts';
 import HomepageHistory from '@/components/HomepageHistory/HomepageHistory';
 import HomepageFuture from '@/components/HomepageFuture/HomepageFuture';
 import HomepageContacts from '@/components/HomepageContacts/HomepageContacts';
 
 /* * */
 
 export default function Homepage() {
-  //
-
-  //
-  // A. Render components
-
   return (
     <AppWrapper>
       <div className={styles.container}>
         <HomepageLogo />
         <HomepageIntro />
         <HomepageNews />
         <HomepageLinks />
+        <HomepageConcerts />
         <HomepageHistory />
         <HomepageFuture />
         <HomepageContacts />
       </div>
     </AppWrapper>
   );
-
-  //
 }

frontend/components/HomepageConcerts/HomepageConcerts.js

@@ -0,0 +1,39 @@
+/* * */
+
+import { getDocuments } from 'outstatic/server';
+import styles from './HomepageConcerts.module.css';
+import LinkArticle from '@/components/LinkArticle/LinkArticle';
+import SectionTitle from '@/components/SectionTitle/SectionTitle';
+
+/* * */
+
+async function getAllConcerts() {
+  return getDocuments('concerts', ['slug', 'coverImage', 'title', 'description', 'externalUrl']);
+}
+
+/* * */
+
+export default async function HomepageConcerts() {
+  //
+
+  //
+  // A. Fetch data
+
+  const allConcertsData = await getAllConcerts();
+
+  //
+  // B. Render components
+
+  return (
+    <div className={styles.container}>
+      <SectionTitle pt="Concertos" en="Concerts" />
+      <div className={styles.articlesGrid}>
+        {allConcertsData.map((article) => (
+          <LinkArticle key={article.slug} article={article} />
+        ))}
+      </div>
+    </div>
+  );
+
+  //
+}

frontend/components/HomepageConcerts/HomepageConcerts.module.css

@@ -0,0 +1,29 @@
+/* * */
+/* CONTAINER */
+
+.container {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: flex-start;
+  gap: 30px;
+}
+
+/* * */
+/* ARTICLES GRID */
+
+.articlesGrid {
+  width: 100%;
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  align-items: flex-start;
+  justify-content: flex-start;
+  gap: 25px;
+}
+
+@media (max-width: 600px) {
+  .articlesGrid {
+    grid-template-columns: 1fr;
+  }
+}

frontend/components/HomepageHistory/HomepageHistory.js

@@ -1,3 +1,5 @@
+/* * */
+
 import styles from './HomepageHistory.module.css';
 import Link from 'next/link';
 import Image from 'next/image';

frontend/package.json

@@ -10,21 +10,21 @@
         "lint": "next lint"
     },
     "dependencies": {
-        "@tabler/icons-react": "^2.42.0",
-        "next": "14.0.3",
-        "outstatic": "^1.0.3",
+        "@tabler/icons-react": "2.47.0",
+        "next": "14.1.0",
+        "outstatic": "1.3.0",
         "react": "18.2.0",
         "react-dom": "18.2.0",
-        "remark": "^15.0.1",
-        "remark-html": "^16.0.1",
-        "sharp": "0.32.6"
+        "remark": "15.0.1",
+        "remark-html": "16.0.1",
+        "sharp": "0.33.2"
     },
     "devDependencies": {
-        "@types/node": "20.10.0",
-        "@types/react": "18.2.39",
-        "@types/react-dom": "18.2.17",
-        "eslint": "8.54.0",
-        "eslint-config-next": "14.0.3",
-        "typescript": "5.3.2"
+        "@types/node": "20.11.17",
+        "@types/react": "18.2.55",
+        "@types/react-dom": "18.2.19",
+        "eslint": "8.56.0",
+        "eslint-config-next": "14.1.0",
+        "typescript": "5.3.3"
     }
 }