This commit is contained in:
Janis
2023-02-05 19:58:46 +01:00
parent 8b8d75ca65
commit d41c8be336
25 changed files with 447 additions and 93 deletions

View File

@@ -1,26 +0,0 @@
"use client";
import React, { useState } from "react";
import { Gallery as ReactGridGallery, Image as ImageType, ThumbnailImageProps } from "react-grid-gallery";
import Image from "next/image";
const ImageComponent = (props: ThumbnailImageProps) => {
const { src, alt, style, title } = props.imageProps;
const { width, height } = props.item;
return (
<Image
alt={alt}
src={src}
title={title || ""}
width={width}
height={height}
onClick={() => {
window.open(src);
}}
style={style}
/>
);
};
export default function Gallery({ images }: { images: ImageType[] }) {
return <ReactGridGallery images={images} enableImageSelection={false} thumbnailImageComponent={ImageComponent} />;
}

View File

@@ -1,24 +0,0 @@
import React from "react";
import { Image } from "@prisma/client";
import { Image as GalleryImage } from "react-grid-gallery";
import urlJoin from "url-join";
import { apiUrl } from "../../../global";
import Gallery from "./Gallery";
async function getImages(): Promise<GalleryImage[]> {
const result = await fetch(urlJoin(apiUrl, `images`), {
cache: "no-cache",
});
const imageData: Image[] = await result.json();
return imageData.map((img, i) => ({
width: img.width,
height: img.height,
src: img.url,
caption: img.name,
}));
}
export default async function AdminImagesPage() {
return <Gallery images={await getImages()} />;
}

View File

@@ -1,53 +1,15 @@
import styles from "../../../styles/modules/Category.module.scss";
import Link from "next/link";
import { apiUrl } from "../../../global";
import { Article, Category } from "@prisma/client";
import urlJoin from "url-join";
async function GetAllArticles(categoryName: string): Promise<any> {
const result: Response = await fetch(urlJoin(apiUrl, `articles?categoryName=${categoryName}`), {
cache: "force-cache",
next: { revalidate: 3600 },
});
return result.json();
}
async function GetPopularArticles(categoryName: string): Promise<any> {
const result: Response = await fetch(
urlJoin(apiUrl, `articles?categoryName=${categoryName}&limit=6&orderBy=popularity`),
{
cache: "force-cache",
next: { revalidate: 3600 },
}
);
return result.json();
}
async function GetRecentArticles(categoryName: string): Promise<any> {
const result: Response = await fetch(
urlJoin(apiUrl, `articles?categoryName=${categoryName}&limit=6&orderBy=recent`),
{
cache: "force-cache",
next: { revalidate: 3600 },
}
);
return result.json();
}
async function GetCategory(categoryName: string): Promise<any> {
const result: Response = await fetch(urlJoin(apiUrl, `categories/name/${categoryName}`), {
cache: "force-cache",
next: { revalidate: 3600 },
});
return result.json();
}
import { ArticleWithIncludes, CategoryWithIncludes, FetchManager } from "../../../manager/fetchManager";
import { formatTextToUrlName } from "../../../utils";
export default async function CategoryPage({ params }: { params: { categoryName: string } }) {
const categoryName = params.categoryName.toLowerCase().replaceAll("%20", " ");
const category: Category = await GetCategory(categoryName);
const allArticles: Article[] = await GetAllArticles(categoryName);
const popularArticles: Article[] = await GetPopularArticles(categoryName);
const recentArticles: Article[] = await GetRecentArticles(categoryName);
const categoryName = formatTextToUrlName(params.categoryName);
const category: CategoryWithIncludes = await FetchManager.Category.get(categoryName);
const allArticles: ArticleWithIncludes[] = await FetchManager.Article.getByCategory(categoryName);
// const popularArticles: Article[] = await GetPopularArticles(categoryName);
// const recentArticles: Article[] = await GetRecentArticles(categoryName);
return (
<div className={styles.category}>
@@ -55,7 +17,7 @@ export default async function CategoryPage({ params }: { params: { categoryName:
<div className={styles.content}>
<div className={`${styles.showcase} ${styles.smallShowcase}`}>
<h2>Most popular articles</h2>
{popularArticles?.map((a, i) => {
{/* {popularArticles?.map((a, i) => {
{
return (
<Link key={i} href={`/articles/${category.name}/${a.name}`}>
@@ -63,7 +25,7 @@ export default async function CategoryPage({ params }: { params: { categoryName:
</Link>
);
}
})}
})} */}
</div>
{/* <div className={`${styles.showcase} ${styles.smallShowcase}`}>
@@ -81,15 +43,17 @@ export default async function CategoryPage({ params }: { params: { categoryName:
<div className={styles.showcase}>
<h2>All articles</h2>
{allArticles?.map((a, i) => {
{
return (
<Link key={i} href={`/articles/${category.name}/${a.name}`}>
{a.title}
</Link>
);
}
})}
{allArticles
? Array.from(allArticles).map((a, i) => {
{
return (
<Link key={i} href={`/articles/${category.name}/${a.name}`}>
{a.title}
</Link>
);
}
})
: ""}
</div>
</div>
</div>