add instructions for project page

Author: Boltzmachine

README.md

@@ -27,3 +27,15 @@ News should be inserted here
 https://github.com/Graph-and-Geometric-Learning/Graph-and-Geometric-Learning.github.io/blob/d294a5bb559925e109aa7117faa575f9543da622/app/page.tsx#L44-L46
 
 The news item should be wrapped by `<li>...</li>`. Wrap the text with `<Link href="link.com">...</Link>` if you want to add a link to your text. Check examples in the same file for reference.
+
+
+## Project Page
+To set up a project page, we support [MDX](https://mdxjs.com/), which is a superset of markdown that lets you write  [JSX](https://react.dev/learn/writing-markup-with-jsx) directly in your markdown files. That is to say, you can write your project page in markdown and include any html elements. We also pre-defined some convenient element for you to use. (e.g. AuthorList).
+
+**Step**
+1. Create a folder of your project under `app/projects`.
+2. Create a `page.mdx` file under the created folder. This is the main file that contains your page content. Assets (e.g. images) should be uploaded to your project folder as well.
+3. Update the `page`key of your publication in `config/publications.ts` with the name of your folder.
+
+
+Find an example in `app/projects/mage`.

app/publications/page.tsx

@@ -7,11 +7,18 @@ import { publications } from "@/config/publications";
 import { PublicationTags } from "@/components/tag";
 
 function Links({ paper, code, page }: { paper: string, code: string | null; page: string | null }) {
-  if (code === null) {
-    return <Link href={paper}>paper</Link>;
-  } else {
-    return <> <Link href={paper}>paper</Link> / <Link href={code}>code</Link> </>
+  let links = [];
+  if (paper !== null) {
+    links.push(<Link href={paper}>paper</Link>);
   }
+  if (code !== null) {
+    links.push(<Link href={code}>code</Link>)
+  }
+  if (page !== null) {
+    let page_link = "projects/" + page;
+    links.push(<Link href={page_link}>page</Link>)
+  } 
+  return <>{links.reduce((prev, curr) => <>{prev} / {curr}</>)}</>
 }
 
 export default function PublicationsPage() {

config/publications.ts

@@ -107,7 +107,7 @@ export const publications = [
     title: "Explaining Graph Neural Networks via Structure-aware Interaction Index",
     authors: "Ngoc Bui, Hieu Trung Nguyen, Viet Anh Nguyen, Rex Ying",
     venue: "ICML 2024",
-    page: null,
+    page: "mage",
     code: "https://github.com/ngocbh/MAGE",
     paper: "https://arxiv.org/abs/2405.14352",
     abstract: "We introduces a novel interaction index, namely the Myerson-Taylor interaction index, that internalizes the graph structure into attributing the node values of Shapley value and the interaction values among nodes. We prove that that the Myerson-Taylor index is the unique one that satisfies a system of five natural axioms accounting for graph structure and high-order interaction among nodes. We propose MAGE, a new graph explainer that uses the second-order Myerson-Taylor index to identify the most important motifs influencing the model prediction.",