Merge pull request #33 from bedrock-apis/development

Development
bedrock-apis · Feb 14, 2024 · 365526a · 365526a
2 parents 0faa9fb + d149759
commit 365526a
Show file tree

Hide file tree

Showing 12 changed files with 129 additions and 53 deletions.
diff --git a/src/app/[...slug]/page.tsx b/src/app/[...slug]/page.tsx
@@ -1,16 +1,8 @@
-import { GetFilesTree, RemoveSuffix } from "@/features/functions";
-import { LoadThem, GetWikiPaths } from "@/features/getAllTopics";
-import { Image } from "@/mdx-components";
-import { readFileSync } from "fs";
+import { RemoveSuffix, getProfileInfo } from "@/features/functions";
+import { LoadThem, GetWikiPaths, meta_informations } from "@/features/getAllTopics";
 import { Metadata } from "next";
 
 type StaticSlugParams = { params: Awaited<ReturnType<typeof generateStaticParams>>[number] }
-/*
-const images: {[k: string]: {fileName: string, slugId: string}} = {};
-for (const file of GetFilesTree("./images")){
-    const [base, imagesFolder, fileName] = file.split("/");
-    images[fileName.split(".")[0]] = {fileName, slugId: fileName.split(".")[0]}
-}*/
 export async function generateStaticParams() {
     const slugs = [];
     for (const ss of GetWikiPaths()) {
@@ -22,10 +14,29 @@ export async function generateStaticParams() {
 export default async function GetMarkdownPageView({ params }: StaticSlugParams) {
     const slg = params.slug;
     const [blogs, metadatas] = await LoadThem();
+    const {displayName,author, tags = []} = metadatas[slg.join("/")] as {displayName: string, tags?: string[], author?: string}
+    const info = await getProfileInfo(author??"");
     const MdxData = blogs[slg.join("/")];
+    const tagDefs = meta_informations.tags;
     return (
         <div className="m-[1%] flex">
             <article className="w-full">
+                <div className="flex">
+                    <h1 className="w-full" style={{fontSize: 50}}>{displayName}</h1>
+                    {info?
+                    <div className="self-center mr-[5%]">
+                        <AuthorInfo>{info}</AuthorInfo>
+                    </div>
+                    :undefined}
+                </div>
+                <hr className="border-sub border-t-2 -mt-1 mb-2"></hr>
+                <div className="mb-4 flex flex-wrap">
+                    {tags.map((e: string,i)=>{
+                        if(!(e in tagDefs)) return undefined;
+                        const {color, display, "text-color": textColor} = tagDefs[e];
+                        return <Tag key={i} color={color} textColor={textColor}>{display}</Tag>
+                    })}
+                </div>
                 <MdxData />
             </article>
             {/* <div className="border-opacity-20 my-10 border-gray-400 border-l-2 ml-[2%] float-right min-w-40 max-w-60 w-[40%]" style={{visibility:isMobile()?"hidden":"visible"}}></div> */}
@@ -37,4 +48,20 @@ export async function generateMetadata({ params }: StaticSlugParams): Promise<Me
     return {
         title: `${params.slug.map(x => x.charAt(0).toUpperCase() + x.substring(1)).join("->")} on Bedrock API Wiki`
     }
+}
+function Tag(data: {children?: any, color?: string, textColor?: string}){
+    return <div className="px-1.5 shadow-md mr-1 mb-1 rounded-md"  style={{backgroundColor: data.color}}>
+        <p className="opacity-90" style={{color: data.textColor??"--text-primary", fontWeight:700}}>
+            {data.children}
+        </p>
+    </div>
+}
+function AuthorInfo(data: {children: any}){
+    return <a className="flex w-min h-[2.5rem] self-center rounded-xl hover:bg-gray-500 hover:bg-opacity-5 px-2" href={data.children.html_url}>
+        <p className="self-center text-xl mr-2 text-nowrap">
+            <span className="opacity-80 text-sm mr-2">by </span>
+            {data.children.name}
+        </p>
+        <img src={data.children.avatar_url} className="object-contain h-[100%] shadow-xl self-center mr-3 border-slate-300 border-2 rounded-full"/>
+    </a>
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -4,7 +4,7 @@ import "../styles/globals.css";
 import "../styles/codelights.css";
 import Footer from "@/components/footer";
 import { Metadata } from "next";
-import { LoadThem } from "@/features/getAllTopics";
+import { LoadThem, meta_informations } from "@/features/getAllTopics";
 import { readFileSync } from "fs";
 import BaseView from "@/components/BaseView";
 import { URL } from "url";
@@ -27,10 +27,10 @@ export default async function RootLayout({
 }) {
   const [blogs, metadatas] = await LoadThem();
   const menus = {} as any;
-  const options = {tags: JSON.parse(readFileSync("./wiki/tags_definition.json").toString()), menus};
+  const options = {tags: meta_informations.blog_kind, menus};
   Object.keys(blogs).filter(e=>metadatas[e]?.displayName).forEach(e=>{
-    const {tag="dev", displayName} = metadatas[e]??{};
-    const m = menus[tag] = menus[tag]??[];
+    const {kind="blog", displayName} = metadatas[e]??{};
+    const m = menus[kind] = menus[kind]??[];
     m.push({title:displayName, link: e});
   });
   return (

diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx
@@ -5,6 +5,7 @@ export default function NotFound(){
             <p style={{fontSize:60}}>404 Not found</p>
             <hr className="m-5"/>
             <p className="text-xl">This is not page what are you looking for.</p>
-        </div>  
+        </div>
+        <img src="https://raw.githubusercontent.com/bedrock-apis/wiki/main/public/next.svg"></img>
     </div>
 }
diff --git a/src/components/aside/aside.tsx b/src/components/aside/aside.tsx
@@ -7,7 +7,7 @@ import { useEffect, useState } from "react";
 
 
 export interface SideBarOptions {
-    tags: { [k: string]: { title: string, color?: string } }
+    tags: { [k: string]: { display: string, color?: string } }
     menus: { [k: string]: { title: string, link: string }[] }
 }
 export default function SideBar(params: { options: SideBarOptions }) {
@@ -46,10 +46,14 @@ export default function SideBar(params: { options: SideBarOptions }) {
     let i = 0;
     for (const tag of Object.keys(params.options.tags)) {
         if (!(tag in params.options.menus)) continue;
-        const { title, color } = params.options.tags[tag];
+        const { display: title, color } = params.options.tags[tag];
         const subComponens = [];
         subComponens.push(
-            <div key={"_" + i++} className="rounded-md shadow-md relative -ml-3 -mt-2 -mr-1 px-1.5" style={{ "backgroundColor": color ?? "#ff0000", fontSize: 22 }}>
+            <div key={"_" + i++} className="rounded-md shadow-md relative -ml-3 -mt-2 -mr-1 px-1.5 flex" style={{ "backgroundColor": color ?? "#ff0000", fontSize: 22 }}>
+                {/*<svg className="pt-[0.3rem] m-1 h-5 self-center" width="16" xmlns="http://www.w3.org/2000/svg">
+                    <polygon points="0,0 12,0 6,10" style={{fill:"white"}}/>
+                    Sorry, your browser does not support inline SVG.
+        </svg>*/}
                 {title}
             </div>
         );

diff --git a/src/components/header.tsx b/src/components/header.tsx
@@ -5,10 +5,10 @@ export default function Header() {
     return <header className="w-full z-40">
         <div className="fixed bg-secondary border border-l-0 border-t-0 border-b-1 border-highlight h-[3.5rem] w-full shadow-xl">
             <div className="m-3 h-min w-full flex">
-                <button className="-my-2 px-1 rounded-md hover:bg-slate-100 hover:bg-opacity-[0.02]" onClick={()=>(window as any).__sidebar("Test")}>
+                <button className="-my-1 px-1 rounded-md fixed hover:bg-slate-100 hover:bg-opacity-[0.02]" onClick={()=>(window as any).__sidebar("Test")}>
                     <svg xmlns="http://www.w3.org/2000/svg" height="45" viewBox="0 -960 960 960" width="45"><path d="M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z" /></svg>
                 </button>
-                <ButtonLink link="/" className="float-left text-2xl ml-2 w-min font-bold text-nowrap">
+                <ButtonLink link="/" className="float-left text-2xl ml-16 w-min font-bold text-nowrap">
                     Scripting Wiki
                 </ButtonLink>
                 <div className="w-full mr-[3%]">

diff --git a/src/features/functions.ts b/src/features/functions.ts
@@ -9,4 +9,12 @@ export function* GetFilesTree(base: string): Generator<string, void> {
 export function RemoveSuffix(fileName: string) {
     const spl = fileName.split(".");
     return fileName.substring(0,fileName.length - spl[spl.length-1].length - 1);
+}
+const fetchedUsers: {[k: string]: any} = {};
+export async function getProfileInfo(profileName: string){
+    if(profileName in fetchedUsers) return fetchedUsers[profileName];
+    const source = await fetch("https://api.github.com/users/" + profileName);
+    if(source.status == 404) return null;
+    const data = source.json();
+    return data;
 }
diff --git a/src/features/getAllTopics.ts b/src/features/getAllTopics.ts
@@ -1,8 +1,9 @@
+import { readFileSync } from "fs";
 import { GetFilesTree, RemoveSuffix } from "./functions";
 import { ComponentType } from "react";
 
 export async function LoadThem() {
-    const metadatas: { [k: string]: any } = {};
+    const metadatas: { [k: string]: {[k: string]: any} } = {};
     const obj: { [k: string]: ComponentType<{}> } = {};
     for (const ss of GetWikiPaths()) {
         const j = ss.join("/");
@@ -11,7 +12,7 @@ export async function LoadThem() {
         obj[k] = m.default;
         metadatas[k] = m.metadata;
     }
-    return [obj, metadatas];
+    return [obj, metadatas] as [typeof obj, typeof metadatas];
 }
 export function* GetWikiPaths() {
     for (const filePath of GetFilesTree("./wiki")) {
@@ -21,4 +22,18 @@ export function* GetWikiPaths() {
             yield ss;
         }
     }
-}
+}
+
+
+export const meta_informations: {
+    "blog_kind": {[k: string]: {
+        color: string, 
+        display: string
+    }},
+    "tags": {[k: string]: {
+        color: string,
+        display: string,
+        "text-color"?: string
+    }}
+    "code-languages": {[k: string]: string}
+} = JSON.parse(readFileSync("./wiki/metadata.json").toString());
diff --git a/src/mdx-components.tsx b/src/mdx-components.tsx
@@ -2,6 +2,7 @@ import { existsSync, readFileSync, statfsSync } from "fs";
 import type { MDXComponents } from "mdx/types";
 import Link from "next/link";
 import { resolve } from "path";
+import { meta_informations } from "./features/getAllTopics";
 
 export function useMDXComponents(components: MDXComponents): MDXComponents {
 	return {
@@ -107,7 +108,7 @@ export function BlockQuote(params: any){
 		{params.children}
 	</div>
 }
-const languageToTextMap = JSON.parse(readFileSync("./wiki/language-maps.json").toString()) as { [key: string]: any }
+const languageToTextMap = meta_informations["code-languages"];
 
 
 ////////////////////// Custom elements

diff --git a/wiki/api-environment.md b/wiki/api-environment.md
@@ -1,8 +1,11 @@
 ---
 displayName: API Environment
-tag: docs
+kind: docs
+author: conmaster2112
+tags:
+ - depracated
+ - js
 ---
-# API Environment
 Minecraft: Bedrock Edition uses their own version of JavaScript based on QuickJS. It uses the ECMAScript module (ESM) system for organizing and loading code, which allows for a more modular and organized approach to writing scripts for the game.
 
 ## Common problems

diff --git a/wiki/language-maps.json b/wiki/language-maps.json
diff --git a/wiki/metadata.json b/wiki/metadata.json
@@ -0,0 +1,44 @@
+{
+    "tags":{
+        "depracated":{
+            "display":"Deprecated",
+            "color":"#990000"
+        },
+        "js":{
+            "display":"JavaScript",
+            "color":"#cca300",
+            "text-color":"black"
+        }
+    },
+    "blog_kind":{
+        "docs": {
+            "display":"Documentation",
+            "color":"#0059b3"
+        },
+        "blog":{
+            "display": "Blogs",
+            "color":"#660066"
+        },
+        "dev": {
+            "display":"Examples",
+            "color":"#987420"
+        },
+        "guide":{
+            "display":"Guides",
+            "color":"#004d00"
+        }
+    },
+    "code-languages":{
+        "language-js": "JavaScript",
+        "language-javascript": "JavaScript",
+        "language-ts": "TypeScript",
+        "language-typescript": "TypeScript",
+        "language-json": "JSON",
+        "language-md": "Markdown",
+        "language-markdown": "Markdown",
+        "language-cpp": "C++",
+        "language-c": "C",
+        "language-h": "C",
+        "language-hpp": "C"
+    }
+}
diff --git a/wiki/tags_definition.json b/wiki/tags_definition.json