10h30/astroplate
1
0
Fork 0
mirror of https://github.com/10h30/astroplate.git synced 2026-06-05 15:08:00 +09:00
Code Issues Packages Projects Releases Wiki Activity

jsonGenerator Fixed

Browse Source
This commit is contained in:
Al Murad Uzzaman
2024-05-27 11:31:07 +06:00
parent e33a7dddcf
commit b01e1a8e06
5 changed files with 54 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/jsonGenerator.js
+17 -12
View File
@@ -10,7 +10,6 @@ const BLOG_FOLDER = "blog";
// get data from markdown
const getData = (folder, groupDepth, langIndex = 0) => {
// get paths
const getPaths = languages
.map((lang, index) => {
const langFolder = lang.contentDir ? lang.contentDir : lang.languageCode;
@@ -22,7 +21,7 @@ const getData = (folder, groupDepth, langIndex = 0) => {
!filename.startsWith("-") &&
(filename.endsWith(".md") || filename.endsWith(".mdx")),
)
.map((filename) => {
.flatMap((filename) => {
const filepath = path.join(dir, filename);
const stats = fs.statSync(filepath);
const isFolder = stats.isDirectory();
@@ -33,18 +32,26 @@ const getData = (folder, groupDepth, langIndex = 0) => {
const file = fs.readFileSync(filepath, "utf-8");
const { data, content } = matter(file);
const pathParts = filepath.split(path.sep);
const slug =
data.slug ||
pathParts
let slug;
if (data.slug) {
const slugParts = data.slug.split("/");
slugParts[0] = BLOG_FOLDER;
slug = slugParts.join("/");
} else {
slug = pathParts
.slice(CONTENT_DEPTH)
.join("/")
.replace(/\.[^/.]+$/, "");
const group = pathParts[groupDepth];
slug = `${BLOG_FOLDER}/${slug.split("/").slice(1).join("/")}`;
}
data.slug = slug;
const group = "blog";
return {
lang: languages[langIndex].languageCode,
lang: languages[index].languageCode, // Set the correct language code dynamically
group: group,
slug: slug,
slug: data.slug,
frontmatter: data,
content: content,
};
@@ -53,9 +60,7 @@ const getData = (folder, groupDepth, langIndex = 0) => {
})
.flat();
const publishedPages = getPaths.filter(
(page) => !page.frontmatter?.draft && page,
);
const publishedPages = getPaths.filter((page) => !page.frontmatter?.draft);
return publishedPages;
};
@@ -71,7 +76,7 @@ try {
JSON.stringify(getData(BLOG_FOLDER, 3)),
);
// merger json files for search
// merge json files for search
const posts = require(`../${JSON_FOLDER}/posts.json`);
const search = [...posts];
fs.writeFileSync(`${JSON_FOLDER}/search.json`, JSON.stringify(search));
src/config/config.json
+1 -1
View File
@@ -3,7 +3,7 @@
"title": "Astroplate",
"base_url": "https://astroplate.netlify.app",
"base_path": "/",
"trailing_slash": true,
"trailing_slash": false,
"favicon": "/images/favicon.png",
"logo": "/images/logo.png",
"logo_darkmode": "/images/logo-darkmode.png",
src/layouts/Base.astro
+9 -6
View File
@@ -9,6 +9,7 @@ import "@/styles/main.scss";
import { AstroFont } from "astro-font";
import { ViewTransitions } from "astro:transitions";
import SearchModal from "./helpers/SearchModal";
import { getLangFromUrl } from "@/lib/utils/languageParser";
// font families
const pf = theme.fonts.font_family.primary;
@@ -40,6 +41,8 @@ export interface Props {
// distructure frontmatters
const { title, meta_title, description, image, noindex, canonical, lang } =
Astro.props;
const language = lang || getLangFromUrl(Astro.url);
---
<!doctype html>
@@ -108,7 +111,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<meta
name="description"
content={plainify(
description ? description : config.metadata.meta_description,
description ? description : config.metadata.meta_description
)}
/>
@@ -121,7 +124,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<meta
property="og:title"
content={plainify(
meta_title ? meta_title : title ? title : config.site.title,
meta_title ? meta_title : title ? title : config.site.title
)}
/>
@@ -129,7 +132,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<meta
property="og:description"
content={plainify(
description ? description : config.metadata.meta_description,
description ? description : config.metadata.meta_description
)}
/>
<meta property="og:type" content="website" />
@@ -142,7 +145,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<meta
name="twitter:title"
content={plainify(
meta_title ? meta_title : title ? title : config.site.title,
meta_title ? meta_title : title ? title : config.site.title
)}
/>
@@ -150,7 +153,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<meta
name="twitter:description"
content={plainify(
description ? description : config.metadata.meta_description,
description ? description : config.metadata.meta_description
)}
/>
@@ -174,7 +177,7 @@ const { title, meta_title, description, image, noindex, canonical, lang } =
<body>
<TwSizeIndicator />
<Header />
<SearchModal client:load />
<SearchModal lang={language} client:load />
<main id="main-content">
<slot />
</main>
src/layouts/helpers/SearchModal.tsx
+15 -3
View File
@@ -1,8 +1,11 @@
import searchData from ".json/search.json";
import React, { useEffect, useState } from "react";
import SearchResult, { type ISearchItem } from "./SearchResult";
import config from "@/config/config.json";
const { default_language } = config.settings;
const SearchModal = () => {
const SearchModal = ({ lang }: { lang: string | undefined }) => {
lang = lang || default_language;
const [searchString, setSearchString] = useState("");
// handle input change
@@ -39,9 +42,13 @@ const SearchModal = () => {
}
};
// filter language specific search data
const filterSearchData = searchData.filter((item) => item.lang === lang);
// get search result
const startTime = performance.now();
const searchResult = doSearch(searchData);
const searchResult = doSearch(filterSearchData);
const endTime = performance.now();
const totalTime = ((endTime - startTime) / 1000).toFixed(3);
@@ -169,10 +176,15 @@ const SearchModal = () => {
name="search"
value={searchString}
onChange={handleSearch}
autoFocus
autoComplete="off"
/>
</div>
<SearchResult searchResult={searchResult} searchString={searchString} />
<SearchResult
searchResult={searchResult}
searchString={searchString}
lang={lang}
/>
<div className="search-wrapper-footer">
<span className="flex items-center">
<kbd>
src/layouts/helpers/SearchResult.tsx
+12 -4
View File
@@ -1,7 +1,9 @@
import { slugSelector } from "@/lib/utils/languageParser";
import { plainify, titleify } from "@/lib/utils/textConverter";
import React from "react";
export interface ISearchItem {
lang: string;
group: string;
slug: string;
frontmatter: {
@@ -33,10 +35,13 @@ export interface ISearchGroup {
const SearchResult = ({
searchResult,
searchString,
lang
}: {
searchResult: ISearchItem[];
searchString: string;
lang: string;
}) => {
// generate search result group
const generateSearchGroup = (searchResult: ISearchItem[]) => {
const joinDataByGroup: ISearchGroup[] = searchResult.reduce(
@@ -83,6 +88,7 @@ const SearchResult = ({
);
};
// match underline
const matchUnderline = (text: string, substring: string) => {
const parts = text?.split(new RegExp(`(${substring})`, "gi"));
@@ -148,12 +154,14 @@ const SearchResult = ({
<img
src={item.frontmatter.image}
alt={item.frontmatter.title}
width={100}
height={100}
/>
</div>
)}
<div className="search-result-item-body">
<a
href={`/${item.slug}`}
href={`${slugSelector(item.slug, lang)}`}
className="search-result-item-title search-result-item-link"
>
{matchUnderline(item.frontmatter.title, searchString)}
@@ -188,8 +196,8 @@ const SearchResult = ({
{matchUnderline(category, searchString)}
{item.frontmatter.categories &&
index !==
item.frontmatter.categories.length -
1 && <>, </>}
item.frontmatter.categories.length -
1 && <>, </>}
</span>
),
)}
@@ -211,7 +219,7 @@ const SearchResult = ({
{matchUnderline(tag, searchString)}
{item.frontmatter.tags &&
index !==
item.frontmatter.tags.length - 1 && <>, </>}
item.frontmatter.tags.length - 1 && <>, </>}
</span>
))}
</div>