mirror of
https://github.com/ivabus/www
synced 2024-11-10 05:45:16 +03:00
Merge pull request #241 from teaxyz/package-bottle-info
#232 package bottle info in the /+packagePage
This commit is contained in:
commit
d4f44991b9
|
@ -29,5 +29,6 @@ exclude = [
|
|||
"file:///home/runner/work/www/www/public/+github.com/rhash/RHash",
|
||||
"https://app.tea.xyz/api/signups", # can take a little too long, and no reason to hammer here.
|
||||
"https://unicode.org/",
|
||||
"https://gnome.org/"
|
||||
"https://gnome.org/",
|
||||
"https://libuv.org/"
|
||||
]
|
||||
|
|
68
src/assets/scripts/package-bottles.jsx
Normal file
68
src/assets/scripts/package-bottles.jsx
Normal file
|
@ -0,0 +1,68 @@
|
|||
function PackageBottles() {
|
||||
const [bottles, setBottles] = React.useState();
|
||||
|
||||
React.useEffect(() => {
|
||||
const url = window.location.pathname.replace('/+', 'https://app.tea.xyz/api/bottles/');
|
||||
fetch(url)
|
||||
.then((res) => res.json())
|
||||
.then((res) => setBottles(res));
|
||||
}, []);
|
||||
|
||||
if (!bottles) return null;
|
||||
|
||||
const names = [...new Set(bottles.map((b) => b.name))];
|
||||
|
||||
return (
|
||||
<div>
|
||||
{names.map((name) => (
|
||||
<Bottle key={name} name={name} />
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
|
||||
function Bottle({ name }) {
|
||||
const [expanded, toggleExpanded] = React.useState(false);
|
||||
const versions = [
|
||||
...new Set(bottles.map((b) => b.version)),
|
||||
];
|
||||
return (
|
||||
<div className="expand" onClick={() => toggleExpanded(!expanded)}>
|
||||
<div className="expand-text one-box-down">
|
||||
<h4 className="display-6">
|
||||
{versions.length} version{versions.length === 1 ? "" : "s"} bottled
|
||||
</h4>
|
||||
</div>
|
||||
<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>
|
||||
);
|
||||
}
|
||||
}
|
||||
ReactDOM.render(React.createElement(PackageBottles), document.getElementById("packageApp"));
|
|
@ -30,10 +30,18 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Copy to clipboard field -->
|
||||
|
||||
<section>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col bottles-container">
|
||||
|
||||
{{- partial "package-bottle.html" .Title -}}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col grid-gray">
|
||||
Copy the tea one-liner below into your terminal to install  {{- .Title -}}. tea will interpret the documentation and take care of any dependencies.
|
||||
|
@ -71,6 +79,41 @@
|
|||
box-shadow: inset 0vw 0vw 0vw 0.335vw #1a1a1a !important;
|
||||
}
|
||||
|
||||
</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 }}
|
||||
|
|
7
src/layouts/partials/package-bottle.html
Normal file
7
src/layouts/partials/package-bottle.html
Normal 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="packageApp"></div>
|
||||
{{ $packageApp := resources.Get "scripts/package-bottles.jsx" | babel -}}
|
||||
<script src="{{ $packageApp.RelPermalink }}"></script>
|
||||
</section>
|
Loading…
Reference in a new issue