Merge pull request #189 from teaxyz/bottle-browser

bottle listing
This commit is contained in:
Chris Waters 2022-12-15 17:26:26 -05:00 committed by GitHub
commit dea1d06e0c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 2019 additions and 7 deletions

View file

@ -64,6 +64,7 @@ export default class TeaXYZ extends Stack {
destinationBucket: bucket,
distribution,
distributionPaths: ["/*"],
memoryLimit: 512,
sources: [s3Deployment.Source.asset('../public')],
});
}

View file

@ -1,3 +0,0 @@
#!/bin/sh
git config --global url."https://teaxyz:$1@github.com/teaxyz/pantry".insteadOf "https://github.com/teaxyz/pantry"

View file

@ -39,7 +39,6 @@ jobs:
with:
cmd: '.github/build-package-pages.sh src/data/packages.json src/content'
- run: .github/mk-pantry-accessible.sh ${{ secrets.TEMP_JACOBS_GITHUB_PAT }}
- uses: teaxyz/setup@v0
with:
target: build

View file

@ -47,8 +47,6 @@ jobs:
with:
cmd: '.github/build-package-pages.sh src/data/packages.json src/content'
- run: .github/mk-pantry-accessible.sh ${{ secrets.TEMP_JACOBS_GITHUB_PAT }}
- uses: teaxyz/setup@v0
with:
target: build

View file

@ -42,6 +42,8 @@ Which resembles the installation tag in tea cli
| Project | Version |
|------------|---------|
| gohugo.io | >=0.99 |
| nodejs.org | >=14 |
| npmjs.com | * |
Install them yourself or use tea:
@ -57,6 +59,7 @@ $ tea .
Builds a static, deployable version of the website.
```sh
npm ci
hugo --source src --destination ../public --minify
```

11
babel.config.js Normal file
View file

@ -0,0 +1,11 @@
module.exports = function (api) {
api.cache(true);
const presets = [
["@babel/preset-react"]
]
const plugins = [];
return {
presets,
plugins
};
}

1789
package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

24
package.json Normal file
View file

@ -0,0 +1,24 @@
{
"name": "tea-www",
"version": "0.1.0",
"description": "basic react config for https://tea.xyz",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/teaxyz/www.git"
},
"author": "Jacob Heider <jacob@tea.xyz>",
"license": "CC-BY-NC-4.0",
"bugs": {
"url": "https://github.com/teaxyz/www/issues"
},
"homepage": "https://github.com/teaxyz/www#readme",
"dependencies": {
"@babel/cli": "^7.19.3",
"@babel/core": "^7.20.2",
"@babel/preset-react": "^7.18.6"
}
}

View file

@ -0,0 +1,74 @@
function Bottles() {
const [bottles, setBottles] = React.useState();
React.useEffect(() => {
fetch("https://app.tea.xyz/api/bottles")
.then((res) => res.json())
.then((res) => setBottles(res));
}, []);
if (!bottles) return null;
const names = [...new Set(bottles.map((b) => b.name))];
return (
<div>
<p>Showing {names.length} packages</p>
{names.map((name) => (
<Bottle key={name} name={name} />
))}
</div>
);
function Bottle({ name }) {
const [expanded, toggleExpanded] = React.useState(false);
const versions = [
...new Set(bottles.filter((b) => b.name === name).map((b) => b.version)),
];
return (
<div className="expand" onClick={() => toggleExpanded(!expanded)}>
<div className="expand-text one-box-down">
<h3 className="display-3">{name}</h3>
<h4 className="display-6">
{versions.length} version{versions.length === 1 ? "" : "s"} bottled
</h4>
</div>
{expanded && (
<table className="one-box-down">
<thead>
<tr>
<th>version</th>
<th>darwin-aarch64</th>
<th>darwin-x86-64</th>
<th>linux-aarch64</th>
<th>linux-x86-64</th>
</tr>
</thead>
<tbody>
{versions.map((v) => {
const available = new Set(
bottles
.filter((b) => b.name === name && b.version == v)
.map((b) => `${b.platform}-${b.arch}`)
);
return (
<tr key={v}>
<th>{v}</th>
<td>{available.has("darwin-aarch64") ? "✅" : "❌"}</td>
<td>{available.has("darwin-x86-64") ? "✅" : "❌"}</td>
<td>{available.has("linux-aarch64") ? "✅" : "❌"}</td>
<td>{available.has("linux-x86-64") ? "✅" : "❌"}</td>
</tr>
);
})}
</tbody>
</table>
)}
<div className="one-box-down">
<hr />
</div>
</div>
);
}
}
ReactDOM.render(React.createElement(Bottles), document.getElementById("app"));

View file

@ -23,3 +23,7 @@ title = 'Equitable Open-Source for Web3'
title = 'github'
url = 'https://github.com/teaxyz'
weight = 6
[security]
[security.exec]
allow = ['^go$', '^postcss$', '^npx$', '^babel$']

5
src/content/bottles.md Normal file
View file

@ -0,0 +1,5 @@
---
title: "Bottles"
Description: "bottles"
layout: "bottles"
---

View file

@ -113,6 +113,38 @@
}
</style>
<!-- Bottle CTA -->
<hr>
<section>
<div class="container">
<div class="row">
<div class="col">
<div class="one-box-down">
<h4 class="text-center">Check our which versions we have bottled</h4>
<p class="text-center">We&#39;ve compiled a list of every package that&#39;s been bottled, along with their corresponding versions.</p>
</div>
<a href="/bottles/">
<button class="detail-btn-large bottle-cta"><i class="icon-enter-arrow"></i>VIEW ALL BOTTLES</button>
</a>
<style>
.bottle-cta{
display: block;
margin-left: auto;
margin-right: auto;
}
</style>
</div>
</div>
</div>
</section>
<!-- Package CTA Section -->
<hr>

View file

@ -0,0 +1,67 @@
{{ define "main" }}
<section>
<div class="container">
<div class="row">
<div class="col title-col" style="padding:1.4vw;">
<h1 class="display-1">Bottles</h1>
</div>
</div>
</div>
</section>
<hr>
<section>
<div class="container">
<div class="row">
<div class="col bottles-container">
{{- partial "bottle-grid.html" -}}
</div>
</div>
</div>
</section>
<style>
table{
color: #fff;
width: 100%;
}
table, th, td {
border: 1px solid #949494;
font-family: "sono", sans-serif;
padding: 20px;
}
.expand{
cursor: pointer;
}
@media screen and (max-width: 576px) {
.bottles-container{
padding: 0px !important;
}
table, th, td {
border: 1px solid #949494;
font-family: "sono", sans-serif;
padding: 10px;
font-size: 12px;
}
.title-col{
padding: 4vw !important;
}
}
</style>
{{ end }}

View file

@ -0,0 +1,7 @@
<section>
<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<div id="app"></div>
{{ $app := resources.Get "scripts/bottles.jsx" | babel -}}
<script src="{{ $app.RelPermalink }}"></script>
</section>

View file

@ -0,0 +1 @@
<i class="icon-tea-logo-iconasset-1">