git.iko.soy/urbit.org
on master help sign in
index: detect operating system for download
37874b7Matilde Park
pages/index.js+39−5
compare with master
unifiedsplit
@@ -1,6 +1,6 @@
1import Head from "next/head";
1import Head from "next/head";
2import Link from "next/link";
2import Link from "next/link";
3−import { useState } from "react";
3+import React, { useState, useEffect } from "react";
4import Container from "../components/Container";
4import Container from "../components/Container";
5import SingleColumn from "../components/SingleColumn";
5import SingleColumn from "../components/SingleColumn";
6import Header from "../components/Header";
6import Header from "../components/Header";
@@ -14,6 +14,37 @@ import { contact } from "../lib/constants";
14
14
15export default function Home({ posts, events, openGrantsCount, toggleSearch }) {
15export default function Home({ posts, events, openGrantsCount, toggleSearch }) {
16 const [tab, setTab] = useState(0);
16 const [tab, setTab] = useState(0);
17+ const [heroButton, setHeroButton] = useState(<div />);
18+
19+ const detectOS = () => {
20+ const agent = window.navigator.appVersion;
21+ if (agent.includes("Win")) {
22+ return (
23+ <span className="button-lg type-ui mb-5 bg-ultraDeepWall text-white">
24+ Coming soon for Windows
25+ </span>
26+ );
27+ } else if (agent.includes("Mac")) {
28+ return (
29+ <a href="https://github.com/arthyn/port/releases/latest/download/Port.dmg">
30+ <button className="button-lg type-ui mb-5 bg-green text-white">
31+ Download For macOS
32+ </button>
33+ </a>
34+ );
35+ } else if (agent.includes("Linux")) {
36+ return (
37+ <code className="button-lg type-ui mb-5 bg-ultraDeepWall text-white">
38+ sudo snap install port
39+ </code>
40+ );
41+ }
42+ };
43+
44+ useEffect(() => {
45+ setHeroButton(detectOS());
46+ }, []);
47+
17 return (
48 return (
18 <Container>
49 <Container>
19 <SingleColumn>
50 <SingleColumn>
@@ -43,10 +74,13 @@ export default function Home({ posts, events, openGrantsCount, toggleSearch }) {
43 Getting into Urbit is now as simple as installing an app on your
74 Getting into Urbit is now as simple as installing an app on your
44 computer.
75 computer.
45 </p>
76 </p>
46− <button className="button-lg type-ui mb-5 bg-green text-white">
77+ {heroButton}
47− Download For Mac
78+ <a
48− </button>
79+ href="https://github.com/arthyn/port"
49− <a className="type-ui text-gray">View on GitHub</a>
80+ className="type-ui text-gray"
81+ >
82+ View on GitHub
83+ </a>
50 </div>
84 </div>
51 <div className="w-full hero-image-height hero-image mt-8" />
85 <div className="w-full hero-image-height hero-image mt-8" />
52 </div>
86 </div>