The landing page lists the Android app among what works today, with notifications, linking to Download, where its QR code installs it; the iPhone app stays under Coming soon.
1 file+36−140/1 viewed
| 77 | 77 | ); | |
| 78 | 78 | } | |
| 79 | 79 | ||
| 80 | − | /** A point in a list: a check, or a "Coming soon" tag for what is not built yet. */ | |
| 81 | − | type Point = string | { text: string; soon: true }; | |
| 80 | + | /** | |
| 81 | + | * A point in a list: a check, a check whose words link somewhere, or a | |
| 82 | + | * "Coming soon" tag for what is not built yet. | |
| 83 | + | */ | |
| 84 | + | type Point = | |
| 85 | + | | string | |
| 86 | + | | { text: string; link: { to: string; label: string } } | |
| 87 | + | | { text: string; soon: true }; | |
| 82 | 88 | ||
| 83 | 89 | function Points({ | |
| 84 | 90 | points, | |
| ⋯ | |||
| 87 | 93 | points: Point[]; | |
| 88 | 94 | columns?: boolean; | |
| 89 | 95 | }) { | |
| 90 | − | const now = points.filter( | |
| 91 | − | (point): point is string => typeof point === "string", | |
| 92 | − | ); | |
| 96 | + | const now = points.filter((point) => typeof point === "string" || !("soon" in point)); | |
| 93 | 97 | const later = points | |
| 94 | − | .filter((point) => typeof point !== "string") | |
| 98 | + | .filter((point) => typeof point !== "string" && "soon" in point) | |
| 95 | 99 | .map((point) => (point as { text: string }).text); | |
| 96 | 100 | return ( | |
| 97 | 101 | <> | |
| 98 | 102 | <ul | |
| 99 | 103 | className={`mt-6 grid gap-2.5 text-sm ${columns ? "sm:grid-cols-2" : ""}`} | |
| 100 | 104 | > | |
| 101 | − | {now.map((text) => ( | |
| 102 | − | <li key={text} className="flex gap-2.5 text-fg-soft"> | |
| 103 | − | <Check size={15} className="mt-0.5 shrink-0 text-accent" /> | |
| 104 | − | <span>{text}</span> | |
| 105 | − | </li> | |
| 106 | − | ))} | |
| 105 | + | {now.map((point) => | |
| 106 | + | typeof point === "string" ? ( | |
| 107 | + | <li key={point} className="flex gap-2.5 text-fg-soft"> | |
| 108 | + | <Check size={15} className="mt-0.5 shrink-0 text-accent" /> | |
| 109 | + | <span>{point}</span> | |
| 110 | + | </li> | |
| 111 | + | ) : ( | |
| 112 | + | "link" in point && ( | |
| 113 | + | <li key={point.text} className="flex gap-2.5 text-fg-soft"> | |
| 114 | + | <Check size={15} className="mt-0.5 shrink-0 text-accent" /> | |
| 115 | + | <span> | |
| 116 | + | {point.text}{" "} | |
| 117 | + | <Link | |
| 118 | + | to={point.link.to} | |
| 119 | + | className="text-fg underline underline-offset-4 hover:text-accent" | |
| 120 | + | > | |
| 121 | + | {point.link.label} | |
| 122 | + | </Link> | |
| 123 | + | </span> | |
| 124 | + | </li> | |
| 125 | + | ) | |
| 126 | + | ), | |
| 127 | + | )} | |
| 107 | 128 | </ul> | |
| 108 | 129 | {later.length > 0 && ( | |
| 109 | 130 | <div className="mt-5 rounded-xl border border-dashed border-line-strong px-4 py-3.5"> | |
| ⋯ | |||
| 601 | 622 | }, | |
| 602 | 623 | { text: "Chat mentions in Notifications", soon: true }, | |
| 603 | 624 | { | |
| 604 | − | text: "A phone app with notifications, Android first, for g1t.sh or your own g1t", | |
| 605 | − | soon: true, | |
| 625 | + | text: "An Android app with notifications: scan the QR code on", | |
| 626 | + | link: { to: "/download", label: "Download" }, | |
| 606 | 627 | }, | |
| 628 | + | { text: "The phone app on iPhone", soon: true }, | |
| 607 | 629 | ]} | |
| 608 | 630 | /> | |
| 609 | 631 | <More to={`${DOCS}/guides/chat/`}>How Chat works</More> | |