use new link buttons

BBN-Holding · Dec 21, 2023 · eb8a774 · eb8a774
1 parent 47870d5
commit eb8a774
Show file tree

Hide file tree

Showing 11 changed files with 49 additions and 71 deletions.
diff --git a/components/nav.ts b/components/nav.ts
@@ -1,6 +1,6 @@
 import { API } from "shared/mod.ts";
 import { delay } from "std/async/delay.ts";
-import { BasicLabel, Box, Button, ButtonStyle, Component, Custom, Empty, Grid, Horizontal, Image, Label, MIcon, Spacer, Vertical, createElement } from "webgen/mod.ts";
+import { BasicLabel, Box, Button, ButtonStyle, Component, Custom, Empty, Grid, Horizontal, Image, Label, LinkButton, MIcon, Spacer, Vertical, createElement } from "webgen/mod.ts";
 import { IsLoggedIn, activeUser, permCheck, showProfilePicture } from "../pages/_legacy/helper.ts";
 import './nav.css';
 import { activeLogo, pages } from "./pages.ts";
@@ -11,7 +11,7 @@ const Nav = (component: Component) => {
     return Custom(nav);
 };
 
-const dropOver = activeUser.$permission.map(() => Vertical(
+const dropOver = Box(activeUser.$permission.map(() => Vertical(
     Label("SWITCH TO").addClass("title"),
     pages.map(([ logo, permission, route ]) => permCheck(...permission) ? Horizontal(
         Image(logo, "Logo"),
@@ -29,8 +29,8 @@ const dropOver = activeUser.$permission.map(() => Vertical(
         .onClick(() => location.href = "/settings")
 ))
     .asRefComponent()
+)
     .addClass("drop-over")
-    .setId("drop-over")
     .draw();
 
 dropOver.onblur = () => dropOver.classList.remove("open");
@@ -56,24 +56,22 @@ export function DynaNavigation(type: "Home" | "Music" | "Settings" | "Hosting" |
                     }),
                 Spacer(),
                 (activeUser.$email.map(email => email ?
-                    Button(
+                    LinkButton(
                         Grid(
                             showProfilePicture(IsLoggedIn()!),
                             Label(activeUser.$username),
                         )
                             .setRawColumns("max-content max-content")
                             .setAlign("center")
-                            .setGap(".7rem")
-
+                            .setGap(".7rem"),
+                        "/settings"
                     )
                         .addClass("profile-button")
                         .setStyle(ButtonStyle.Inline)
-                        .asLinkButton("/settings")
                     :
                     (type == "Home" && !location.pathname.startsWith("/signin") ?
-                        Button("Sign in")
+                        LinkButton("Sign in", "/signin")
                             .addClass("login-button")
-                            .asLinkButton("/signin")
                         : Box())
                 ).asRefComponent()
                 ) ?? null,

diff --git a/deno.jsonc b/deno.jsonc
@@ -1,8 +1,8 @@
 {
     "imports": {
-        "webgen/": "https://raw.githubusercontent.com/lucsoft/WebGen/200f637/",
+        "webgen/": "https://raw.githubusercontent.com/lucsoft/WebGen/c4b1348/",
         // "webgen/": "../WebGen/",
-        "std/": "https://deno.land/std@0.209.0/",
+        "std/": "https://deno.land/std@0.210.0/",
         "shared/": "./pages/shared/"
     },
     "lock": false,
@@ -19,10 +19,8 @@
         "start": "deno run -A serve.ts"
     },
     "lint": {
-        "files": {
-            "exclude": [
-                "dist"
-            ]
-        }
+        "exclude": [
+            "dist"
+        ]
     }
 }
diff --git a/pages/admin/loading.ts b/pages/admin/loading.ts
@@ -20,7 +20,6 @@ export async function refreshState() {
         (async () => state.wallets = await API.admin.wallets.list())(),
         (async () => state.oauth = await API.oauth.list())(),
         (async () => state.transcripts = await API.admin.transcripts.list())(),
-        (async () => state.stats = await API.admin.stats())()
     ]);
 }
 

diff --git a/pages/admin/state.ts b/pages/admin/state.ts
@@ -1,6 +1,6 @@
 import { External } from "shared/mod.ts";
 import { State } from "webgen/mod.ts";
-import { AdminStats, Drop, File, Group, OAuthApp, Payout, Server, Transcript, Wallet } from "../../spec/music.ts";
+import { Drop, File, Group, OAuthApp, Payout, Server, Transcript, Wallet } from "../../spec/music.ts";
 import { ProfileData } from "../_legacy/helper.ts";
 
 export const state = State({
@@ -20,7 +20,6 @@ export const state = State({
     servers: <External<Server[]> | "loading">"loading",
     wallets: <External<Wallet[]> | "loading">"loading",
     transcripts: <External<Transcript[]> | "loading">"loading",
-    stats: <External<AdminStats> | "loading">"loading",
 });
 
 export const reviewState = State({

diff --git a/pages/admin/views/menu.ts b/pages/admin/views/menu.ts
@@ -1,4 +1,4 @@
-import { API, count, HeavyList, loadMore, Navigation, placeholder } from "shared/mod.ts";
+import { API, HeavyList, loadMore, Navigation, placeholder } from "shared/mod.ts";
 import { sumOf } from "std/collections/sum_of.ts";
 import { Box, Button, Color, Entry, Grid, Horizontal, isMobile, Label, ref, Spacer, State, Table, TextInput, Vertical } from "webgen/mod.ts";
 import { DropType } from "../../../spec/music.ts";
@@ -9,7 +9,6 @@ import { ReviewEntry } from "./entryReview.ts";
 import { GroupEntry, UserEntry } from "./entryUser.ts";
 import { entryFile, entryOAuth, entryWallet, transcriptMenu } from "./list.ts";
 
-//TODO: Stats
 export const adminMenu = Navigation({
     title: ref`Hi ${activeUser.$username} 👋`,
     categories: [
@@ -52,7 +51,7 @@ export const adminMenu = Navigation({
             children: [
                 {
                     id: "reviews",
-                    title: ref`Reviews ${count(state.drops.$reviews)}`,
+                    title: ref`Reviews`,
                     children: [
                         HeavyList(state.drops.$reviews, it => ReviewEntry(it))
                             .setPlaceholder(placeholder("No Servers", "Welcome! Create a server to get going. 🤖🛠️"))
@@ -61,39 +60,39 @@ export const adminMenu = Navigation({
                 },
                 {
                     id: "publishing",
-                    title: ref`Publishing ${count(state.drops.$publishing)}`,
+                    title: ref`Publishing`,
                     children: [
                         HeavyList(state.drops.$publishing, it => ReviewEntry(it))
                             .enablePaging((offset, limit) => loadMore(state.drops.$publishing, () => API.admin.drops.list(DropType.Publishing, offset, limit)))
                     ]
                 },
                 {
                     id: "published",
-                    title: ref`Published ${count(state.drops.$published)}`,
+                    title: ref`Published`,
                     children: [
                         HeavyList(state.drops.$published, it => ReviewEntry(it))
                             .enablePaging((offset, limit) => loadMore(state.drops.$published, () => API.admin.drops.list(DropType.Published, offset, limit)))
                     ]
                 },
                 {
                     id: "private",
-                    title: ref`Private ${count(state.drops.$private)}`,
+                    title: ref`Private`,
                     children: [
                         HeavyList(state.drops.$private, it => ReviewEntry(it))
                             .enablePaging((offset, limit) => loadMore(state.drops.$private, () => API.admin.drops.list(DropType.Private, offset, limit)))
                     ]
                 },
                 {
                     id: "rejected",
-                    title: ref`Rejected ${count(state.drops.$rejected)}`,
+                    title: ref`Rejected`,
                     children: [
                         HeavyList(state.drops.$rejected, it => ReviewEntry(it))
                             .enablePaging((offset, limit) => loadMore(state.drops.$rejected, () => API.admin.drops.list(DropType.ReviewDeclined, offset, limit)))
                     ]
                 },
                 {
                     id: "drafts",
-                    title: ref`Drafts ${count(state.drops.$drafts)}`,
+                    title: ref`Drafts`,
                     children: [
                         HeavyList(state.drops.$drafts, it => ReviewEntry(it))
                             .enablePaging((offset, limit) => loadMore(state.drops.$drafts, () => API.admin.drops.list(DropType.Unsubmitted, offset, limit)))
@@ -103,23 +102,23 @@ export const adminMenu = Navigation({
         },
         {
             id: "users",
-            title: ref`User ${count(state.$users)}`,
+            title: ref`User`,
             children: [
                 HeavyList(state.$users, val => UserEntry(val))
                     .enablePaging((offset, limit) => loadMore(state.$users, () => API.admin.users.list(offset, limit)))
             ]
         },
         {
             id: "groups",
-            title: ref`Groups ${count(state.$groups)}`,
+            title: ref`Groups`,
             children: [
                 HeavyList(state.$groups, val => GroupEntry(val))
                     .enablePaging((offset, limit) => loadMore(state.$groups, () => API.admin.groups.list(offset, limit)))
             ]
         },
         {
             id: "payouts",
-            title: ref`Payout ${count(state.$payouts)}`,
+            title: ref`Payout`,
             children: [
                 {
                     title: "Upload Payout File (.xlsx)",
@@ -145,7 +144,7 @@ export const adminMenu = Navigation({
         },
         {
             id: "oauth",
-            title: ref`OAuth ${count(state.$oauth)}`,
+            title: ref`OAuth`,
             children: state.$oauth.map(it => it === "loading" || it.status === "rejected"
                 ? [ HeavyList(state.$oauth, entryOAuth) ]
                 : [
@@ -161,28 +160,28 @@ export const adminMenu = Navigation({
         },
         {
             id: "files",
-            title: ref`Files ${count(state.$files)}`,
+            title: ref`Files`,
             children: [ HeavyList(state.$files, entryFile)
             ]
         },
         {
             id: "servers",
-            title: ref`Minecraft Servers ${count(state.$servers)}`,
+            title: ref`Minecraft Servers`,
             children: [
                 // HeavyList(state.$servers, it => entryServer(State(it) as StateHandler<Server>, true))
                 // .enablePaging((offset, limit) => loadMore(state.$servers, () => API.admin.servers.list(offset, limit)))
             ]
         },
         {
             id: "wallets",
-            title: ref`Wallets ${count(state.$wallets)}`,
+            title: ref`Wallets`,
             children: [ HeavyList(state.$wallets, entryWallet)
                 .enablePaging((offset, limit) => loadMore(state.$wallets, () => API.admin.wallets.list(offset, limit)))
             ]
         },
         {
             id: "transcripts",
-            title: ref`Tickets ${count(state.$transcripts)}`,
+            title: ref`Tickets`,
             children:
                 state.$transcripts.map(it => transcriptMenu(it))
         },

diff --git a/pages/holding/imprint.ts b/pages/holding/imprint.ts
@@ -1,5 +1,5 @@
 import { Footer } from "shared/footer.ts";
-import { Body, Box, Button, ButtonStyle, Horizontal, Label, Spacer, WebGen } from "webgen/mod.ts";
+import { Body, Box, ButtonStyle, Horizontal, Label, LinkButton, Spacer, WebGen } from "webgen/mod.ts";
 import { DynaNavigation } from "../../components/nav.ts";
 import { RegisterAuthRefresh } from "../_legacy/helper.ts";
 import './flowText.css';
@@ -16,8 +16,8 @@ Body(Box(
         Box(Label(`Email: support@bbn.one`)),
         Horizontal(
             Label("See also:"),
-            Button("Privacy Policy").setStyle(ButtonStyle.Inline).asLinkButton("/p/privacy-policy"),
-            Button("Terms of Use").setStyle(ButtonStyle.Inline).asLinkButton("/p/terms-of-use"),
+            LinkButton("Privacy Policy", "/p/privacy-policy").setStyle(ButtonStyle.Inline),
+            LinkButton("Terms of Use", "/p/terms-of-use").setStyle(ButtonStyle.Inline),
             Spacer()
         ).addClass("block").setAlign("center"),
         Label(`Contents`, "h3"),

diff --git a/pages/holding/index.ts b/pages/holding/index.ts
@@ -1,4 +1,4 @@
-import { Body, Box, Button, Grid, Image, Label, Vertical, WebGen } from "webgen/mod.ts";
+import { Body, Box, Grid, Image, Label, LinkButton, Vertical, WebGen } from "webgen/mod.ts";
 import '../../assets/css/main.css';
 import { DynaNavigation } from "../../components/nav.ts";
 import { RegisterAuthRefresh } from "../_legacy/helper.ts";
@@ -85,9 +85,7 @@ Body(Box(
         )
             .addClass("live-stats")
             .setRawColumns("auto auto auto"),
-
-        Button("Join and grow these numbers!")
-            .asLinkButton("/hosting"),
+        LinkButton("Join and grow these numbers!", "/hosting"),
         Box(
             Label("Other things we do", "h2"),
             Label("Special goals? We are here for you.", "h3")

diff --git a/pages/shared/footer.ts b/pages/shared/footer.ts
@@ -1,4 +1,4 @@
-import { BIcon, Box, Button, ButtonStyle, Grid, IconButton, Image, Label } from "webgen/mod.ts";
+import { BIcon, Box, ButtonStyle, Grid, IconButton, Image, Label, LinkButton } from "webgen/mod.ts";
 import splash from "../../assets/splash.png";
 import './footer.css';
 
@@ -11,8 +11,7 @@ export function Footer() {
                 Label("Delivering Excellence. Empowering Businesses and\nIndividuals with Premium Services")
                     .addClass("subtitle")
             ).addClass("text-section"),
-            Button("Get started")
-                .asLinkButton("/signin")
+            LinkButton("Get started", "/signin")
                 .addClass("round-button", "large-button"),
         ).addClass("area-fg"),
         Box(
@@ -48,10 +47,9 @@ export function Footer() {
                     Label(text)
                         .addClass("title"),
                     ...items.map(([ title, link ]) =>
-                        Button(title)
+                        LinkButton(title, link)
                             .addClass("link")
                             .setStyle(ButtonStyle.Inline)
-                            .asLinkButton(link)
                     )
                 ).addClass("column")),
             ).addClass("grouped-links"),
@@ -72,12 +70,10 @@ export function Footer() {
                                 .asLinkButton(link)
                         )
                 ).addClass("icons"),
-                Button("Join Now")
+                LinkButton("Join Now", "/signin")
                     .setStyle(ButtonStyle.Secondary)
-                    .asLinkButton("/signin")
                     .addClass("round-button"),
-                Button("Contact Us")
-                    .asLinkButton("mailto:support@bbn.one")
+                LinkButton("Contact Us", "mailto:support@bbn.one")
                     .addClass("round-button")
             )
                 .addClass("icon-bar")

diff --git a/pages/shared/restSpec.ts b/pages/shared/restSpec.ts
@@ -1,4 +1,4 @@
-import { AdminStats, BugReport, Drop, DropType, File, Group, Meta, OAuthApp, Payout, RequestPayoutResponse, Server, ServerAudit, ServerCreate, ServerTypes, StoreItems, Transcript, Wallet } from "../../spec/music.ts";
+import { BugReport, Drop, DropType, File, Group, Meta, OAuthApp, Payout, RequestPayoutResponse, Server, ServerAudit, ServerCreate, ServerTypes, StoreItems, Transcript, Wallet } from "../../spec/music.ts";
 import { ProfileData } from "../_legacy/helper.ts";
 
 export const Permissions = [
@@ -245,11 +245,6 @@ export const API = {
             .then(none())
     }),
     admin: ({
-        stats: async () => await fetch(`${API.BASE_URL}admin/stats`, {
-            headers: headers(API.getToken())
-        })
-            .then(json<AdminStats>())
-            .catch(reject),
         files: {
             list: async (offset: number | undefined = undefined) => {
                 const paging = new URLSearchParams();

diff --git a/pages/user/signin.ts b/pages/user/signin.ts
@@ -1,7 +1,7 @@
 import { Footer } from "shared/footer.ts";
 import { API, LoadingSpinner } from "shared/mod.ts";
 import { assert } from "std/assert/assert.ts";
-import { Body, Box, Button, ButtonStyle, Color, Form, Grid, Horizontal, Image, Label, Spacer, TextInput, Vertical, WebGen, isMobile } from "webgen/mod.ts";
+import { Body, Box, Button, ButtonStyle, Color, Form, Grid, Horizontal, Image, Label, LinkButton, Spacer, TextInput, Vertical, WebGen, isMobile } from "webgen/mod.ts";
 import '../../assets/css/main.css';
 import { discordLogo, googleLogo } from "../../assets/imports.ts";
 import { DynaNavigation } from "../../components/nav.ts";
@@ -94,29 +94,26 @@ Body(Vertical(
 
                 if (state.type == "login")
                     return Form(Grid(
-                        Button("Sign in with Google")
+                        LinkButton("Sign in with Google", API.auth.oauthRedirect("google"))
                             .setJustify("center")
-                            .asLinkButton(API.auth.oauthRedirect("google"))
                             .addPrefix(
                                 Image(googleLogo, "Google Logo")
                                     .addClass("prefix-logo")
                             )
                             .setMargin("0 0 .6rem"),
-                        Button("Sign in with Discord")
+                        LinkButton("Sign in with Discord", API.auth.oauthRedirect("discord"))
                             .setJustify("center")
-                            .asLinkButton(API.auth.oauthRedirect("discord"))
                             .addPrefix(
                                 Image(discordLogo, "Discord Logo")
                                     .addClass("prefix-logo")
                             )
-                            // .setMargin("0 0 .6rem"),
-                            // Button("Sign in with Microsoft")
-                            // .setJustify("center")
-                            // .asLinkButton(API.auth.oauthRedirect("microsoft"))
-                            // .addPrefix(
-                            //     Image(discordLogo, "logo")
-                            //         .addClass("prefix-logo")
-                            // )
+                            //     .setMargin("0 0 .6rem"),
+                            // LinkButton("Sign in with Microsoft", API.auth.oauthRedirect("microsoft"))
+                            //     .setJustify("center")
+                            //     .addPrefix(
+                            //         Image(discordLogo, "logo")
+                            //             .addClass("prefix-logo")
+                            //     )
                             .setMargin("0 0 2rem"),
 
                         TextInput("email", "Email")

diff --git a/spec/music.ts b/spec/music.ts
@@ -555,7 +555,6 @@ export interface Deferred<T> {
 
 export type InstalledAddon = zod.infer<typeof installedAddon>;
 export type Group = zod.infer<typeof group>;
-export type AdminStats = { drops: { all: number, reviews: number, publishing: number, published: number, private: number, rejected: number, drafts: number; }, users: number, payouts: number, oauthApps: number, files: number, servers: number, wallets: number; };
 export type Audit = zod.infer<typeof audit>;
 export type ServerAudit = zod.infer<typeof serverAudit>;
 export type RequestPayoutResponse = zod.infer<typeof requestPayoutResponse>;