add contributor.md, minimize extra contrib pages, run tile gen again …

…for some reason? (doesnt contain oct adds)

CONTRIBUTING.md

@@ -0,0 +1,43 @@
+# Contributing
+
+## We Develop with GitHub
+
+We use GitHub to host code, to track issues and feature requests, as well as accept pull requests.
+
+## Branch Flow
+
+We use the `main` branch as the development branch. All PRs should be made to the `main` branch from a feature branch. To create a pull request, you can use the following steps:
+
+1. Fork the repository and create a new branch from `main`.
+2. Ensure that any text content matches the tone of the rest of the site and is clean
+3. Follow the "Boy Scout Rule" with code - leave it better than you found it. New code should be well documented. 
+4. Test your changes!
+5. Provide detail (the what and why) behind your changes and label your pull request with the appropriate labels - for example, a change affecting GitHub actions should have the `actions` label added.
+6. Open your pull request, which will be reviewed. Work through any change requests by the maintainer.
+7. If approved and merged, congratulations!
+
+Over time, code formatting and linting will be added to the project, and steps & tests will be added accordingly. Similarly, a Pull request template is on the roadmap.
+
+## How To Get Started
+
+### Prerequisites
+If just contributing text, you may feel more comfortable editing in the GitHub web view. This is perfectly fine, but I strongly encourage learning and exploring something new with setting up the project on your device. 
+
+- Install [Node.js 20+](https://nodejs.org/en/download/).
+- Clone your fork to your device.
+- Run `npm install` from the project root directory
+- If you don't want to run the data generation scripts locally, skip this step. More notes will be added for this process in the future.    
+  - To read the Google Sheet data locally, you'll need to setup a GCP project, enable the Google Sheets API, and generate a service account. 
+  - Add the service account credential to your env file.
+  - The Google Sheet id environment variable can be populated by grabbing the portion of the Community Catalog URL after "/d/" and the next slash. 
+
+### Data Setup (Optional)
+
+Currently, the database file and produced tile mdx files are saved to the repository to let you skip the steps of generating data, setting up a GCP project, etc. If you are doing data setup or code changes around this, you will want to follow the prereq step. Once setup, run `npm run gen:full` which will execute all three generate data scripts. In order, this will:
+1. create a sqlite database in the `/src/data/` directory, with tables for the tiles and importing tiles.
+2. fetch and parse the Community Catalog data into your database.
+3. produce the `src/pages/tiles/` content for each tile.
+
+### General
+
+More to come in this section. For now, you should be goog to go - fire up the local server with `npm run dev` and have fun!

package.json

@@ -9,7 +9,8 @@
     "gen:mdx": "node ./src/data/generateMdxFiles.js",
     "gen:data": "node ./src/data/updateTiles.js",
     "gen:db": "node ./src/data/setupDb.js",
-    "build:full": "npm run gen:db && gen:data && run gen:mdx && next build",
+    "gen:full": "npm run gen:db && gen:data && run gen:mdx",
+    "build:full": "npm run gen:full && next build",
     "build": "next build",
     "dev": "next",
     "start": "next start"

src/components/HorizontalGrid.js

@@ -1,7 +1,6 @@
-// components/HorizontalGrid.js
-
 import React from "react";
 
+// might trash this or hg2, todo land on one component
 const HorizontalGrid = ({ items }) => {
   return (
     <div

src/components/HorizontalGrid2.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-// HorizontalGrid component
+// might trash this or hg1, todo land on one component
 const HorizontalGrid2 = ({ data }) => {
   return (
     <div style={{

src/components/TileDetail.js

@@ -1,6 +1,6 @@
 import React from "react";
 
-// This would typically come from an API or database
+// had AI generate me random sample props for this
 const gameProperties = {
   mechanics: {
     generic: { name: "Generic", checked: true },
@@ -98,7 +98,7 @@ export default function TileDetail() {
                     alignItems: 'center',
                     justifyContent: 'center',
                     color: 'white',
-                    fontSize: '0.75rem', 
+                    fontSize: '0.75rem',
                     fontWeight: 'bold',
                   }}>
                     {property.checked ? '✓' : ''}

src/components/TileTable.js

@@ -20,7 +20,9 @@ import {
 } from "@tanstack/react-table";
 import { rankItem } from "@tanstack/match-sorter-utils";
 
-// Define a custom fuzzy filter function that will apply ranking info to rows (using match-sorter utils)
+// todo: heavily clean up this component
+
+// define a custom fuzzy filter function that will apply ranking info to rows (using match-sorter utils)
 const fuzzyFilter = (row, columnId, value, addMeta) => {
   const itemRank = rankItem(row.getValue(columnId), value);
   addMeta({ itemRank });

src/pages/_meta.js

@@ -6,6 +6,12 @@ export default {
       pagination: false,
     },
   },
+  contributing: {
+    title: "Contributing",
+    theme: {
+      breadcrumb: false,
+    },
+  },
   "--- How to Play": {
     type: "separator",
     title: "How to Play",
@@ -39,10 +45,4 @@ export default {
       toc: false,
     },
   },
-  "--- Contributing": {
-    type: "separator",
-    title: "Contributing",
-  },
-  markdown_and_nextra: "Markdown & Nextra",
-  code: "Code",
 };

src/pages/contributing.mdx

@@ -0,0 +1,11 @@
+# Contributing
+
+Community contributions to this project are welcome! Please review the `CONTRIBUTING.md` guide in the GitHub repository.
+
+Here are some great resources pertaining to writing markdown, or development in the context of Nextra, which is built on top of Next.js, a JavaScript framework:
+- [Javascript Guide](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide)
+- [Markdown Guide](https://www.markdownguide.org/getting-started/)
+- [MDX](https://mdxjs.com/)
+- [Next.js](https://nextjs.org/docs)
+- [Nextra](https://nextra.site/docs)
+

src/pages/index.mdx

@@ -2,7 +2,7 @@ import { Callout } from "nextra/components";
 
 # About
 
-Welcome to the Hextraction Catalog!
+Welcome to the Hextraction Catalog! This site is under active development by [cadeluca](https://github.com/cadeluca).
 
 ## What's all this about?
 
@@ -11,15 +11,16 @@ Welcome to the Hextraction Catalog!
 Hextraction is a free, open source board game designed for 3D printing by [Zach Freedman](https://www.youtube.com/@ZackFreedman).
 You can read more about it on the [official site](https://www.playhextraction.com/what-in-tarnation).
 Please note that this site is purely a community effort and not directly affiliated with Zach or Voidstar Lab.
-If you have questions, for example how to get started printing the game, the community discord is the perfect place.
+If you have questions about the game, for example how to get started printing the game, the Voidstar Lab [Discord](https://discord.com/invite/voidstarlab) is the ideal place. The Discord server is also linked in the site's navigation bar.
 
 ### The Site
 
 This site assumes you have a basic understanding of the game.
-The goal is to make it easy to browse new ways to play and search the countless community tiles to play with!
+The goal is to make it easy to browse new ways to play and search the countless community tiles to play with! Individual tile pages are generated from data - these pages are in the very early stages. You can explore the full list via the Tile Table.
 
-<Callout type="info" emoji="🕑">
-  **COMING SOON:** the sortable, filterable, ergonomic Tile Table!
+<Callout emoji="🚧">
+  The Tile Table [experimental] is [live](/tile_table) - give it a try and share
+  your feedback!
 </Callout>
 
 This site is developed using Nextra, a documentation framework built with Next.js.
@@ -33,6 +34,6 @@ It is highly encouraged if you are a tile maker that you add your tiles to the s
 Please be respectful of the formatting set by the sheet maintainers!
 
 <Callout type="info" emoji="🕑">
-  **COMING SOON:** auto updates via cronjob (in github actions) once the tile
+  To be enabled soon: auto updates via cronjob (in github actions) once the tile
   page design has more detail.
 </Callout>

src/pages/rulesets/_meta.js

@@ -1,3 +1,3 @@
 export default {
-  community_rules_template: "Template"
+  "small_changes": "Small Changes"
 }

src/pages/rulesets/boss_rush.mdx

@@ -1 +1,3 @@
-# Boss Rush
+# Boss Rush
+
+This page will contain rules and tips for the Boss Rush mode.

src/pages/rulesets/small_changes.mdx

@@ -0,0 +1,28 @@
+import { Callout } from "nextra/components";
+
+# Small Changes
+
+Do you play open-handed? Do you _let players choose tiles?_ Alternate ways to play can engage your friends, keep the game fresh, or resolve pain points - it all depends on what works best for you. Have a small change you've enjoyed, or play the game in a completely unique, brand new way? Submit a Pull Request with the `ruleset` label and we'll figure out if it is best suited for this page or it's own sub page!
+
+## Using a Point System
+
+The most common way [I](https://thangs.com/designer/cadeluca) play is with a point system. My Hextraction games were _too_ quick before this change, but it's all about preference and who you play with. My go-to for Points:
+
+- Establish a baseline: scoring a goal is one point. Then for alt-win condition tiles, opt to vote for something that feels rewarding but not instaneous (unless the tile is truly crazy and you want it to be a true win).
+- Get creative: Some tiles work all too well as punishments. Take the blue shell tile for example, a quick rule modification, and now the player in first place might lose some points when the shell is destroyed!
+- Set a time limit, or a winning score: I've done short games at a 5-point cap and medium/long games at 10. Other times, I've used a time limit, and the winner is who has the most at the end of the game.
+
+<Callout type="warning" emoji="⚠️">
+  Trust me, you don't want an hour long stalled game where no one is even close
+  to the winning score! Tune the score amount to the number of players or implement a timer.
+</Callout>
+
+## Reaching Each Goal
+
+Instead of one goal to win, or points per goal, what if you had to hit every goal? The Goals change refers to requiring scoring in each goal.
+With a standard board, this just means just scoring in the other goal, but you can increase the challenge through community models like [Inaudable's](https://thangs.com/designer/Inaudable) [Modular Hextraction Board](https://thangs.com/designer/Inaudable/3d-model/Modular%2520Hextraction%2520Board%2521-972454).
+
+I find this rule change is most optimal with their models, but not a requirement. Using their the three-segment goal design, if building a standard board with two "goals" you now have _six_ goals.
+The flexibility of the board and goal design allows you to break up and disperse the goals, add more, or take them away. You can scale the difficulty as you wish.
+
+The spirit of this change is having to navigate the board in different ways to achieve the win, plus introducing conflict as your opponents will likely interfere with you as they play toward a different goal!

src/pages/tile_table.mdx

@@ -1,5 +1,4 @@
 import TileTable from "../components/TileTable";
-import TakeMeBackButton from "../components/TakeMeBack";
 import { getTiles } from "../data/db";
 import { Callout } from "nextra/components";
 

src/pages/tiles/1-Up.mdx

@@ -0,0 +1,118 @@
+---
+title: "1-Up"
+---
+
+import { Cards } from "nextra/components";
+import { BoxIcon, AccountIcon } from "../../components/icons";
+import HorizontalGrid from '../../components/HorizontalGrid';
+import HorizontalGrid2 from '../../components/HorizontalGrid2';
+import CardBox from '../../components/CardBox';
+
+
+# 1-Up
+
+<Cards>
+  <Cards.Card
+    icon={<BoxIcon />}
+    title="Model Page"
+    href="https://than.gs/m/887119"
+  />
+  <Cards.Card
+    icon={<AccountIcon />}
+    title="Author"
+    href="https://thangs.com/designer/andrewtho5942"
+  />
+</Cards>
+
+## Visual Example 1 (checked feels a bit hard to read)
+
+| Key | Value |
+|-----|-------|
+| Generic | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Combo | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Dispenser | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Hole | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Jump | <ul><li><input disabled checked type="checkbox" /></li></ul>|
+| Layer | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Mechanical | <ul><li><input disabled checked type="checkbox" /></li></ul>|
+| No Path | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Secret | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Trap | <ul><li><input disabled checked type="checkbox" /></li></ul>|
+| On Play/Setup | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Trigger | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| On Destroy | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Ongoing | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Alters Tile(s) | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Alters Ball(s) | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Alters Hand(s) | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Alters Turn(s) | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Forbidden | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Novelty | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Premium | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Unique | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Virtual | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Board | <ul><li><input disabled  type="checkbox" /></li></ul>|
+| Accessory | <ul><li><input disabled  type="checkbox" /></li></ul>|
+
+## Visual Example 2 (just info dumped in a grid layout)
+
+<HorizontalGrid items={["Generic ","Combo ","Dispenser ","Hole ","Jump ✓","Layer ","Mechanical ✓","No Path ","Secret ","Trap ✓","On Play/Setup ","Trigger ","On Destroy ","Ongoing ","Alters Tile(s) ","Alters Ball(s) ","Alters Hand(s) ","Alters Turn(s) ","Forbidden ","Novelty ","Premium ","Unique ","Virtual ","Board ","Accessory "]} />
+
+## Visual Example 3 (separate my higher level tag)
+
+### Mechanics
+<HorizontalGrid2 data={{
+  "generic": "",
+  "combo": "",
+  "dispenser": "",
+  "hole": "",
+  "jump": "✓",
+  "layer": "",
+  "mechanical": "✓",
+  "no_path": "",
+  "secret": "",
+  "trap": "✓"
+}} />
+
+### Cause
+<HorizontalGrid2 data={{
+  "on_play_setup": "",
+  "trigger": "",
+  "on_destroy": "",
+  "ongoing": ""
+}} />
+
+### Action
+<HorizontalGrid2 data={{
+  "alters_tiles": "",
+  "alters_balls": "",
+  "alters_hands": "",
+  "alters_turns": ""
+}} />
+
+### Special
+<HorizontalGrid2 data={{
+  "forbidden": "",
+  "novelty": "",
+  "premium": "",
+  "is_unique": "",
+  "virtual": ""
+}} />
+
+### Components
+<HorizontalGrid2 data={{
+  "board": "",
+  "accessory": ""
+}} />
+---
+
+## Visual Example 4 (Card style)
+<CardBox data={{
+  "forbidden": "",
+  "novelty": "",
+  "premium": "",
+  "is_unique": "",
+  "virtual": ""
+}} />
+
+Pictures (for thangs.com models) will be scraped.