From 8288d09ed788dfb9a82d1b6ace898e3ba05a4776 Mon Sep 17 00:00:00 2001 From: Skidder Date: Mon, 12 Aug 2024 16:19:27 +0800 Subject: [PATCH 1/6] various bug fixes and polishing changes --- assets/css/music.css | 4 ++ components/nav.ts | 2 +- pages/admin/admin.ts | 2 +- pages/admin/dialog.ts | 2 +- pages/admin/review.ts | 38 +++++++++--------- pages/admin/state.ts | 2 +- pages/admin/views/entryReview.ts | 2 +- pages/admin/views/list.ts | 2 +- pages/admin/views/menu.ts | 2 +- pages/holding/distributionAgreement.ts | 2 +- pages/holding/imprint.ts | 2 +- pages/holding/index.ts | 2 +- pages/holding/privacyPolicy.ts | 2 +- pages/holding/termsOfUse.ts | 2 +- pages/hosting/dialogs/deleteFileDialog.ts | 2 +- pages/hosting/dialogs/deleteServerDialog.ts | 2 +- pages/hosting/dialogs/editFileDialog.ts | 2 +- pages/hosting/dialogs/editServerDialog.ts | 2 +- pages/hosting/dialogs/forceRestartDialog.ts | 2 +- pages/hosting/loading.ts | 2 +- pages/hosting/main.ts | 2 +- pages/hosting/views/FileBrowser.ts | 2 +- pages/hosting/views/create.ts | 2 +- pages/hosting/views/menu.ts | 2 +- pages/{_legacy => }/misc/callback.ts | 0 pages/music-landing/main.ts | 2 +- pages/{_legacy => }/music/edit.ts | 40 +++++++------------ pages/music/main.ts | 2 +- pages/music/newDrop.ts | 2 +- .../music => music/views}/changeDrop.ts | 6 +-- .../music => music/views}/changeSongs.ts | 6 +-- pages/music/views/entry.ts | 30 -------------- pages/music/views/list.ts | 31 +++++++++++++- pages/music/views/menu.ts | 2 +- pages/music/views/table.ts | 2 +- pages/payout/main.ts | 2 +- pages/{_legacy => shared}/helper.ts | 0 pages/shared/navigation.ts | 4 +- pages/shared/restSpec.ts | 2 +- pages/user/actions.ts | 2 +- pages/user/oauth.ts | 2 +- pages/user/settings.personal.ts | 2 +- pages/user/settings.ts | 2 +- pages/user/signin.ts | 2 +- pages/wallet/wallet.ts | 2 +- 45 files changed, 108 insertions(+), 121 deletions(-) rename pages/{_legacy => }/misc/callback.ts (100%) rename pages/{_legacy => }/music/edit.ts (79%) rename pages/{_legacy/music => music/views}/changeDrop.ts (96%) rename pages/{_legacy/music => music/views}/changeSongs.ts (92%) delete mode 100644 pages/music/views/entry.ts rename pages/{_legacy => shared}/helper.ts (100%) diff --git a/assets/css/music.css b/assets/css/music.css index ae4f60d..3ba7a14 100644 --- a/assets/css/music.css +++ b/assets/css/music.css @@ -34,4 +34,8 @@ nav.music { nav.music { background: linear-gradient(166deg, #F19D2D 6.59%, #db7621 101.73%); } +} + +div.navigation>div.vertical-stack { + gap: unset !important; } \ No newline at end of file diff --git a/components/nav.ts b/components/nav.ts index 584eef6..7eaea9a 100644 --- a/components/nav.ts +++ b/components/nav.ts @@ -2,7 +2,7 @@ import { delay } from "@std/async"; import { API } from "shared/mod.ts"; import { BasicLabel, Box, Button, ButtonStyle, Component, createElement, Custom, Empty, Grid, Horizontal, Image, Label, LinkButton, MIcon, Spacer, Vertical } from "webgen/mod.ts"; import { Popover } from "webgen/src/components/Popover.ts"; -import { activeUser, IsLoggedIn, permCheck, showProfilePicture } from "../pages/_legacy/helper.ts"; +import { activeUser, IsLoggedIn, permCheck, showProfilePicture } from "../pages/shared/helper.ts"; import "./nav.css"; import { activeTitle, pages } from "./pages.ts"; diff --git a/pages/admin/admin.ts b/pages/admin/admin.ts index c62dc49..e880faa 100644 --- a/pages/admin/admin.ts +++ b/pages/admin/admin.ts @@ -1,7 +1,7 @@ import { Body, Vertical, WebGen } from "webgen/mod.ts"; import "../../assets/css/main.css"; import { DynaNavigation } from "../../components/nav.ts"; -import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../_legacy/helper.ts"; +import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../shared/helper.ts"; import "./admin.css"; import { refreshState } from "./loading.ts"; import { adminMenu } from "./views/menu.ts"; diff --git a/pages/admin/dialog.ts b/pages/admin/dialog.ts index ba3d0b5..806eb07 100644 --- a/pages/admin/dialog.ts +++ b/pages/admin/dialog.ts @@ -3,7 +3,7 @@ import { asState, Box, Button, ButtonStyle, CenterV, Checkbox, createElement, cs import { zod } from "webgen/zod.ts"; import reviewTexts from "../../data/reviewTexts.json" with { type: "json" }; import { Drop, ReviewResponse } from "../../spec/music.ts"; -import { sheetStack } from "../_legacy/helper.ts"; +import { sheetStack } from "../shared/helper.ts"; import { clientRender, dropPatternMatching, rawTemplate, render } from "./email.ts"; document.adoptedStyleSheets.push(css` diff --git a/pages/admin/review.ts b/pages/admin/review.ts index 84a5279..a79cd8c 100644 --- a/pages/admin/review.ts +++ b/pages/admin/review.ts @@ -1,12 +1,12 @@ import { API, createActionList, createBreadcrumb, createTagList, LoadingSpinner, Navigation, stupidErrorAlert } from "shared/mod.ts"; -import { Body, Button, ButtonStyle, Color, Empty, Entry, Grid, Horizontal, isMobile, Label, Spacer, Vertical, WebGen } from "webgen/mod.ts"; +import { BasicLabel, Body, Button, ButtonStyle, Color, Empty, Entry, Grid, Horizontal, isMobile, Label, Spacer, Vertical, WebGen } from "webgen/mod.ts"; import "../../assets/css/main.css"; import "../../assets/css/music.css"; import { DynaNavigation } from "../../components/nav.ts"; -import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, saveBlob, sheetStack, showPreviewImage, showProfilePicture } from "../_legacy/helper.ts"; -import { ChangeDrop } from "../_legacy/music/changeDrop.ts"; -import { ChangeSongs } from "../_legacy/music/changeSongs.ts"; +import { ChangeDrop } from "../music/views/changeDrop.ts"; +import { ChangeSongs } from "../music/views/changeSongs.ts"; import { DropTypeToText } from "../music/views/list.ts"; +import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, saveBlob, sheetStack, showPreviewImage, showProfilePicture } from "../shared/helper.ts"; import { ApproveDialog, DeclineDialog, dialogState } from "./dialog.ts"; import { reviewState } from "./state.ts"; import { changeState, changeTypeDialog } from "./views/entryReview.ts"; @@ -59,17 +59,17 @@ sheetStack.setDefault(Vertical( : LoadingSpinner() ).asRefComponent(), ) - .setCssStyle("border", "solid").setGap().setBorderRadius("tiny"), + .setMaxHeight("calc(100vh - 53px)") + .setCssStyle("overflow", "auto") + .setCssStyle("border", "solid") + .setGap() + .setBorderRadius("tiny"), reviewState.$drop.map((drop) => drop ? Navigation({ title: drop.title, children: [ - Horizontal( - //TODO: Make this look better - Label(DropTypeToText(drop.type)).setTextSize("2xl"), - Spacer(), - ), + Label(DropTypeToText(drop.type)).setTextSize("2xl"), { id: "edit-drop", title: "Drop", @@ -104,13 +104,7 @@ sheetStack.setDefault(Vertical( .setHeader((menu) => isMobile.map((mobile) => { const list = Vertical( - menu.path.map((x) => - x == "-/" - ? Grid( - showPreviewImage(drop).addClass("image-preview"), - ).setEvenColumns(1, "10rem") - : Empty() - ).asRefComponent(), + menu.path.map((x) => x == "-/" ? Grid(showPreviewImage(drop).addClass("image-preview")).setEvenColumns(1, "10rem") : Empty()).asRefComponent(), createBreadcrumb(menu), createTagList(menu), ).setGap(); @@ -124,9 +118,9 @@ sheetStack.setDefault(Vertical( }).asRefComponent() ) : LoadingSpinner() - ).asRefComponent().setJustifyItems("center").setAlignItems("center"), + ).asRefComponent(), Vertical( - Label("Drop History", "h1").setTextAlign("center"), + BasicLabel({ title: "", subtitle: "Drop History" }), reviewState.$drop.map((drop) => drop ? Vertical( @@ -171,7 +165,11 @@ sheetStack.setDefault(Vertical( ApproveDialog.setOnClose(() => refreshReviewState()); }), ).setGap(), - ).setCssStyle("border", "solid").setBorderRadius("tiny"), + ) + .setMaxHeight("calc(100vh - 53px)") + .setCssStyle("overflow", "auto") + .setCssStyle("border", "solid") + .setBorderRadius("tiny"), ) .setGap() .setRawColumns("1fr 3fr 1fr"), diff --git a/pages/admin/state.ts b/pages/admin/state.ts index 29ef61d..2475dfd 100644 --- a/pages/admin/state.ts +++ b/pages/admin/state.ts @@ -1,7 +1,7 @@ import { External } from "shared/mod.ts"; import { asState } from "webgen/mod.ts"; import { Drop, File, Group, OAuthApp, Payout, Server, Transcript, Wallet } from "../../spec/music.ts"; -import { ProfileData } from "../_legacy/helper.ts"; +import { ProfileData } from "../shared/helper.ts"; export const state = asState({ drops: { diff --git a/pages/admin/views/entryReview.ts b/pages/admin/views/entryReview.ts index 48f08ff..6521804 100644 --- a/pages/admin/views/entryReview.ts +++ b/pages/admin/views/entryReview.ts @@ -1,7 +1,7 @@ import { API } from "shared/mod.ts"; import { asState, Button, ButtonStyle, Color, DropDownInput, Entry, Horizontal, SheetDialog, Spacer, Vertical } from "webgen/mod.ts"; import { Drop, DropType } from "../../../spec/music.ts"; -import { sheetStack, showPreviewImage } from "../../_legacy/helper.ts"; +import { sheetStack, showPreviewImage } from "../../shared/helper.ts"; export function ReviewEntry(x: Drop) { return Entry({ diff --git a/pages/admin/views/list.ts b/pages/admin/views/list.ts index c930878..27ba2cf 100644 --- a/pages/admin/views/list.ts +++ b/pages/admin/views/list.ts @@ -2,7 +2,7 @@ import { API, External, fileCache, RenderItem, stupidErrorAlert } from "shared/m import { Box, Button, Cache, Color, Entry, Grid, Horizontal, IconButton, Image, MIcon, ref, SheetDialog, Spacer, TextInput, Vertical } from "webgen/mod.ts"; import { templateArtwork } from "../../../assets/imports.ts"; import { File, OAuthApp, Transcript, Wallet } from "../../../spec/music.ts"; -import { saveBlob, sheetStack } from "../../_legacy/helper.ts"; +import { saveBlob, sheetStack } from "../../shared/helper.ts"; import { state } from "../state.ts"; export function entryWallet(wallet: Wallet) { diff --git a/pages/admin/views/menu.ts b/pages/admin/views/menu.ts index ecfd26a..ffa255f 100644 --- a/pages/admin/views/menu.ts +++ b/pages/admin/views/menu.ts @@ -4,7 +4,7 @@ import loader from "https://esm.sh/@monaco-editor/loader@1.4.0"; import { API, HeavyList, loadMore, Navigation, placeholder, stupidErrorAlert } from "shared/mod.ts"; import { asState, Box, Button, Color, Custom, Entry, Grid, Horizontal, isMobile, Items, Label, lazy, ref, SheetDialog, Spacer, Table, TextInput, Vertical } from "webgen/mod.ts"; import { Drop, DropType, Server, Transcript } from "../../../spec/music.ts"; -import { activeUser, ProfileData, sheetStack, showProfilePicture } from "../../_legacy/helper.ts"; +import { activeUser, ProfileData, sheetStack, showProfilePicture } from "../../shared/helper.ts"; import { upload } from "../loading.ts"; import { state } from "../state.ts"; import { ReviewEntry } from "./entryReview.ts"; diff --git a/pages/holding/distributionAgreement.ts b/pages/holding/distributionAgreement.ts index 852b38f..d3cbbde 100644 --- a/pages/holding/distributionAgreement.ts +++ b/pages/holding/distributionAgreement.ts @@ -1,7 +1,7 @@ import { Footer } from "shared/footer.ts"; import { Body, Box, Label, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; -import { RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import "./flowText.css"; WebGen(); await RegisterAuthRefresh(); diff --git a/pages/holding/imprint.ts b/pages/holding/imprint.ts index d404c6d..856cb4e 100644 --- a/pages/holding/imprint.ts +++ b/pages/holding/imprint.ts @@ -1,7 +1,7 @@ import { Footer } from "shared/footer.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 { RegisterAuthRefresh } from "../shared/helper.ts"; import "./flowText.css"; WebGen(); await RegisterAuthRefresh(); diff --git a/pages/holding/index.ts b/pages/holding/index.ts index 1899677..985db58 100644 --- a/pages/holding/index.ts +++ b/pages/holding/index.ts @@ -1,7 +1,7 @@ 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"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import "./landing.css"; import { data, streamingPool } from "./loading.ts"; // Main diff --git a/pages/holding/privacyPolicy.ts b/pages/holding/privacyPolicy.ts index 417959d..b7202c7 100644 --- a/pages/holding/privacyPolicy.ts +++ b/pages/holding/privacyPolicy.ts @@ -1,7 +1,7 @@ import { Footer } from "shared/footer.ts"; import { Body, Box, Label, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; -import { RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import "./flowText.css"; WebGen(); await RegisterAuthRefresh(); diff --git a/pages/holding/termsOfUse.ts b/pages/holding/termsOfUse.ts index 94763d9..d38f724 100644 --- a/pages/holding/termsOfUse.ts +++ b/pages/holding/termsOfUse.ts @@ -1,7 +1,7 @@ import { Footer } from "shared/footer.ts"; import { Body, Box, Label, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; -import { RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import "./flowText.css"; WebGen(); await RegisterAuthRefresh(); diff --git a/pages/hosting/dialogs/deleteFileDialog.ts b/pages/hosting/dialogs/deleteFileDialog.ts index b207d43..a941580 100644 --- a/pages/hosting/dialogs/deleteFileDialog.ts +++ b/pages/hosting/dialogs/deleteFileDialog.ts @@ -1,5 +1,5 @@ import { Box, Button, Color, Grid, Label, SheetDialog, Vertical } from "webgen/mod.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; export function deleteFileDialog() { const response = Promise.withResolvers(); diff --git a/pages/hosting/dialogs/deleteServerDialog.ts b/pages/hosting/dialogs/deleteServerDialog.ts index 958ddea..ea1a3a3 100644 --- a/pages/hosting/dialogs/deleteServerDialog.ts +++ b/pages/hosting/dialogs/deleteServerDialog.ts @@ -1,6 +1,6 @@ import { API, stupidErrorAlert } from "shared/restSpec.ts"; import { Button, ButtonStyle, Color, Grid, Label, SheetDialog } from "webgen/mod.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; export const deleteServerDialog = (serverId: string) => { const sheet = SheetDialog( diff --git a/pages/hosting/dialogs/editFileDialog.ts b/pages/hosting/dialogs/editFileDialog.ts index 4b3c748..e2bd85e 100644 --- a/pages/hosting/dialogs/editFileDialog.ts +++ b/pages/hosting/dialogs/editFileDialog.ts @@ -3,7 +3,7 @@ import { editor } from "https://esm.sh/monaco-editor@0.44.0/esm/vs/editor/editor import { delay } from "@std/async"; import { asRef, Box, Button, Cache, Color, Custom, Grid, Label, lazy, MIcon, refMerge, SheetDialog, Vertical } from "webgen/mod.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; import { uploadFile } from "../loading.ts"; import "./editFileDialog.css"; diff --git a/pages/hosting/dialogs/editServerDialog.ts b/pages/hosting/dialogs/editServerDialog.ts index 75b7331..23e0a0f 100644 --- a/pages/hosting/dialogs/editServerDialog.ts +++ b/pages/hosting/dialogs/editServerDialog.ts @@ -5,7 +5,7 @@ import { asState, Button, ButtonStyle, Color, DropDownInput, Grid, isMobile, Lab import locations from "../../../data/locations.json" with { type: "json" }; import serverTypes from "../../../data/servers.json" with { type: "json" }; import { Server } from "../../../spec/music.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; import { MB, state } from "../data.ts"; export const editServerDialog = (server: Server, versions: string[]) => { diff --git a/pages/hosting/dialogs/forceRestartDialog.ts b/pages/hosting/dialogs/forceRestartDialog.ts index 2598531..3506016 100644 --- a/pages/hosting/dialogs/forceRestartDialog.ts +++ b/pages/hosting/dialogs/forceRestartDialog.ts @@ -1,6 +1,6 @@ import { API, stupidErrorAlert } from "shared/restSpec.ts"; import { Button, ButtonStyle, Color, Grid, Label, SheetDialog } from "webgen/mod.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; export const forceRestartDialog = (serverId: string) => { const sheet = SheetDialog( diff --git a/pages/hosting/loading.ts b/pages/hosting/loading.ts index 14b6193..57bf664 100644 --- a/pages/hosting/loading.ts +++ b/pages/hosting/loading.ts @@ -4,7 +4,7 @@ import { API, ProgressTracker } from "shared/mod.ts"; import { createStableWebSocket } from "webgen/extended.ts"; import { asRef, asState, lazy, Reference } from "webgen/mod.ts"; import { Deferred, InstalledAddon, Server, SidecarRequest, SidecarResponse } from "../../spec/music.ts"; -import { activeUser, tokens } from "../_legacy/helper.ts"; +import { activeUser, tokens } from "../shared/helper.ts"; import { state } from "./data.ts"; import { canWriteInFolder, currentFiles } from "./views/state.ts"; diff --git a/pages/hosting/main.ts b/pages/hosting/main.ts index 2a7ac75..b4f060a 100644 --- a/pages/hosting/main.ts +++ b/pages/hosting/main.ts @@ -3,7 +3,7 @@ import { API, stupidErrorAlert } from "shared/restSpec.ts"; import { asState, Body, Vertical, WebGen } from "webgen/mod.ts"; import "../../assets/css/main.css"; import { DynaNavigation } from "../../components/nav.ts"; -import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../_legacy/helper.ts"; +import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../shared/helper.ts"; import { state } from "./data.ts"; import { listFiles, liveUpdates, refreshState, startSidecarConnection } from "./loading.ts"; import { hostingMenu } from "./views/menu.ts"; diff --git a/pages/hosting/views/FileBrowser.ts b/pages/hosting/views/FileBrowser.ts index 096c0d2..b7b0ed1 100644 --- a/pages/hosting/views/FileBrowser.ts +++ b/pages/hosting/views/FileBrowser.ts @@ -4,7 +4,7 @@ import { createDownloadStream } from "shared/libs/streamSaver.ts"; import { Progress, ProgressTracker, Table2 } from "shared/mod.ts"; import { asRef, BasicLabel, BIcon, Box, Button, ButtonStyle, Color, Empty, Entry, Grid, IconButton, Label, MIcon, ref, refMerge, SheetDialog } from "webgen/mod.ts"; import { SidecarResponse } from "../../../spec/music.ts"; -import { sheetStack } from "../../_legacy/helper.ts"; +import { sheetStack } from "../../shared/helper.ts"; import { mapFiletoIcon } from "../constants.ts"; import { deleteFileDialog } from "../dialogs/deleteFileDialog.ts"; import { editFileDialog, editFileLanguage, editFilePath, editFileReadOnly, editFilestreamingText } from "../dialogs/editFileDialog.ts"; diff --git a/pages/hosting/views/create.ts b/pages/hosting/views/create.ts index 8f774cb..0ff08a6 100644 --- a/pages/hosting/views/create.ts +++ b/pages/hosting/views/create.ts @@ -4,7 +4,7 @@ import "../../../assets/css/hosting.css"; import "../../../assets/css/main.css"; import { DynaNavigation } from "../../../components/nav.ts"; import { ServerTypes } from "../../../spec/music.ts"; -import { RegisterAuthRefresh, renewAccessTokenIfNeeded } from "../../_legacy/helper.ts"; +import { RegisterAuthRefresh, renewAccessTokenIfNeeded } from "../../shared/helper.ts"; import { refreshState } from "../loading.ts"; import { creationState, state } from "./../data.ts"; import { creationView } from "./wizard.ts"; diff --git a/pages/hosting/views/menu.ts b/pages/hosting/views/menu.ts index 308f789..020adc3 100644 --- a/pages/hosting/views/menu.ts +++ b/pages/hosting/views/menu.ts @@ -8,7 +8,7 @@ import { templateArtwork } from "../../../assets/imports.ts"; import locations from "../../../data/locations.json" with { type: "json" }; import serverTypes from "../../../data/servers.json" with { type: "json" }; import { AuditTypes, InstalledAddon, Server, ServerAudit, ServerTypes } from "../../../spec/music.ts"; -import { activeUser, ProfileData, showProfilePicture } from "../../_legacy/helper.ts"; +import { activeUser, ProfileData, showProfilePicture } from "../../shared/helper.ts"; import { state } from "../data.ts"; import { deleteServerDialog } from "../dialogs/deleteServerDialog.ts"; import { editServerDialog } from "../dialogs/editServerDialog.ts"; diff --git a/pages/_legacy/misc/callback.ts b/pages/misc/callback.ts similarity index 100% rename from pages/_legacy/misc/callback.ts rename to pages/misc/callback.ts diff --git a/pages/music-landing/main.ts b/pages/music-landing/main.ts index 9d0df31..d8f0f13 100644 --- a/pages/music-landing/main.ts +++ b/pages/music-landing/main.ts @@ -1,7 +1,7 @@ import { Footer } from "shared/footer.ts"; import { Body, Box, Button, Color, Content, Empty, FullWidthSection, Grid, Image, Label, LinkButton, mediaQueryRef, MIcon, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; -import { RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import "./main.css"; // @deno-types="https://raw.githubusercontent.com/lucsoft-DevTeam/lucsoft.de/master/custom.d.ts" diff --git a/pages/_legacy/music/edit.ts b/pages/music/edit.ts similarity index 79% rename from pages/_legacy/music/edit.ts rename to pages/music/edit.ts index 8df51d2..f33d03a 100644 --- a/pages/_legacy/music/edit.ts +++ b/pages/music/edit.ts @@ -1,13 +1,13 @@ import { API, createActionList, createBreadcrumb, createTagList, LoadingSpinner, Navigation, stupidErrorAlert } from "shared/mod.ts"; -import { asState, Body, Empty, Grid, Horizontal, isMobile, Label, Spacer, Vertical, WebGen } from "webgen/mod.ts"; -import "../../../assets/css/main.css"; -import "../../../assets/css/music.css"; -import { DynaNavigation } from "../../../components/nav.ts"; -import { Drop, DropType } from "../../../spec/music.ts"; -import { DropTypeToText } from "../../music/views/list.ts"; -import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, saveBlob, sheetStack, showPreviewImage } from "../helper.ts"; -import { ChangeDrop } from "./changeDrop.ts"; -import { ChangeSongs } from "./changeSongs.ts"; +import { asRef, Body, Empty, Grid, isMobile, Label, Vertical, WebGen } from "webgen/mod.ts"; +import "../../assets/css/main.css"; +import "../../assets/css/music.css"; +import { DynaNavigation } from "../../components/nav.ts"; +import { Drop, DropType } from "../../spec/music.ts"; +import { changeThemeColor, permCheck, RegisterAuthRefresh, renewAccessTokenIfNeeded, saveBlob, sheetStack, showPreviewImage } from "../shared/helper.ts"; +import { ChangeDrop } from "./views/changeDrop.ts"; +import { ChangeSongs } from "./views/changeSongs.ts"; +import { DropTypeToText } from "./views/list.ts"; await RegisterAuthRefresh(); @@ -24,22 +24,16 @@ if (!data.id) { location.href = "/c/music"; } -const state = asState({ - drop: undefined, -}); +const drop = asRef( undefined); sheetStack.setDefault(Vertical( DynaNavigation("Music"), - state.$drop.map((drop) => + drop.map((drop) => drop ? Navigation({ title: drop.title, children: [ - Horizontal( - //TODO: Make this look better - Label(DropTypeToText(drop.type)).setTextSize("2xl"), - Spacer(), - ), + Label(DropTypeToText(drop.type)).setTextSize("2xl"), { id: "edit-drop", title: "Drop", @@ -107,13 +101,7 @@ sheetStack.setDefault(Vertical( .setHeader((menu) => isMobile.map((mobile) => { const list = Vertical( - menu.path.map((x) => - x == "-/" - ? Grid( - showPreviewImage( { _id: drop._id, artwork: drop.artwork }).addClass("image-preview"), - ).setEvenColumns(1, "10rem") - : Empty() - ).asRefComponent(), + menu.path.map((x) => x == "-/" ? Grid(showPreviewImage(drop).addClass("image-preview")).setEvenColumns(1, "10rem") : Empty()).asRefComponent(), createBreadcrumb(menu), createTagList(menu), ).setGap(); @@ -142,5 +130,5 @@ const Permissions = { renewAccessTokenIfNeeded().then(async () => { await API.music.id(data.id).get() .then(stupidErrorAlert) - .then((drop) => state.drop = drop); + .then((x) => drop.setValue(x)); }); diff --git a/pages/music/main.ts b/pages/music/main.ts index 96c322c..77ebfaa 100644 --- a/pages/music/main.ts +++ b/pages/music/main.ts @@ -4,7 +4,7 @@ import "../../assets/css/main.css"; import "../../assets/css/music.css"; import { DynaNavigation } from "../../components/nav.ts"; import { DropType } from "../../spec/music.ts"; -import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../_legacy/helper.ts"; +import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../shared/helper.ts"; import { menuState, musicMenu } from "./views/menu.ts"; await RegisterAuthRefresh(); diff --git a/pages/music/newDrop.ts b/pages/music/newDrop.ts index 9ce78dd..94be515 100644 --- a/pages/music/newDrop.ts +++ b/pages/music/newDrop.ts @@ -6,7 +6,7 @@ import { DynaNavigation } from "../../components/nav.ts"; import genres from "../../data/genres.json" with { type: "json" }; import language from "../../data/language.json" with { type: "json" }; import { ArtistRef, ArtistTypes, DropType, pages, Song } from "../../spec/music.ts"; -import { allowedAudioFormats, allowedImageFormats, CenterAndRight, getSecondary, RegisterAuthRefresh, sheetStack } from "../_legacy/helper.ts"; +import { allowedAudioFormats, allowedImageFormats, CenterAndRight, getSecondary, RegisterAuthRefresh, sheetStack } from "../shared/helper.ts"; import { uploadArtwork, uploadSongToDrop } from "./data.ts"; import { EditArtistsDialog, ManageSongs } from "./views/table.ts"; diff --git a/pages/_legacy/music/changeDrop.ts b/pages/music/views/changeDrop.ts similarity index 96% rename from pages/_legacy/music/changeDrop.ts rename to pages/music/views/changeDrop.ts index 69d127f..2baddb4 100644 --- a/pages/_legacy/music/changeDrop.ts +++ b/pages/music/views/changeDrop.ts @@ -6,9 +6,9 @@ import { templateArtwork } from "../../../assets/imports.ts"; import genres from "../../../data/genres.json" with { type: "json" }; import language from "../../../data/language.json" with { type: "json" }; import { artistref, DATE_PATTERN, Drop, song, userString } from "../../../spec/music.ts"; -import { uploadArtwork } from "../../music/data.ts"; -import { EditArtistsDialog } from "../../music/views/table.ts"; -import { allowedImageFormats, getSecondary } from "../helper.ts"; +import { allowedImageFormats, getSecondary } from "../../shared/helper.ts"; +import { uploadArtwork } from "../data.ts"; +import { EditArtistsDialog } from "./table.ts"; export function ChangeDrop(drop: Drop) { const state = asState({ diff --git a/pages/_legacy/music/changeSongs.ts b/pages/music/views/changeSongs.ts similarity index 92% rename from pages/_legacy/music/changeSongs.ts rename to pages/music/views/changeSongs.ts index 20747f8..e502b9a 100644 --- a/pages/_legacy/music/changeSongs.ts +++ b/pages/music/views/changeSongs.ts @@ -2,9 +2,9 @@ import { API } from "shared/mod.ts"; import { asState, Box, Button, CenterV, createFilePicker, Empty, getErrorMessage, Grid, Horizontal, Label, Spacer, Validate } from "webgen/mod.ts"; import { zod } from "webgen/zod.ts"; import { Drop, song } from "../../../spec/music.ts"; -import { uploadSongToDrop } from "../../music/data.ts"; -import { ManageSongs } from "../../music/views/table.ts"; -import { allowedAudioFormats } from "../helper.ts"; +import { allowedAudioFormats } from "../../shared/helper.ts"; +import { uploadSongToDrop } from "../data.ts"; +import { ManageSongs } from "./table.ts"; export function ChangeSongs(drop: Drop) { const state = asState({ diff --git a/pages/music/views/entry.ts b/pages/music/views/entry.ts deleted file mode 100644 index ca74509..0000000 --- a/pages/music/views/entry.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { CenterV, Empty, Entry, Label } from "webgen/mod.ts"; -import { Drop, DropType } from "../../../spec/music.ts"; -import { showPreviewImage } from "../../_legacy/helper.ts"; - -export function DropEntry(x: Drop, small: boolean) { - return Entry({ - title: x.title ?? "(no drop name)", - subtitle: `${x.release ?? "(no release date)"} - ${x.gtin ?? "(no GTIN)"}`, - }) - .addClass(small ? "small" : "normal") - .addPrefix(showPreviewImage(x).addClass("image-square")) - .addSuffix((() => { - if (x.type == DropType.UnderReview) { - return CenterV( - Label("Under Review") - .addClass("entry-subtitle", "under-review"), - ); - } - - if (x.type == DropType.ReviewDeclined) { - return CenterV( - Label("Declined") - .addClass("entry-subtitle", "under-review"), - ); - } - - return Empty(); - })()) - .onClick(() => location.href = x.type === DropType.Unsubmitted ? `/c/music/new-drop?id=${x._id}` : `/c/music/edit?id=${x._id}`); -} diff --git a/pages/music/views/list.ts b/pages/music/views/list.ts index b15e9c6..51bdf47 100644 --- a/pages/music/views/list.ts +++ b/pages/music/views/list.ts @@ -1,7 +1,34 @@ import { placeholder } from "shared/mod.ts"; -import { Component, Label, MediaQuery, Vertical } from "webgen/mod.ts"; +import { CenterV, Component, Empty, Entry, Label, MediaQuery, Vertical } from "webgen/mod.ts"; import { Drop, DropType } from "../../../spec/music.ts"; -import { DropEntry } from "./entry.ts"; +import { showPreviewImage } from "../../shared/helper.ts"; + +function DropEntry(x: Drop, small: boolean) { + return Entry({ + title: x.title ?? "(no drop name)", + subtitle: `${x.release ?? "(no release date)"} - ${x.gtin ?? "(no GTIN)"}`, + }) + .addClass(small ? "small" : "normal") + .addPrefix(showPreviewImage(x).addClass("image-square")) + .addSuffix((() => { + if (x.type == DropType.UnderReview) { + return CenterV( + Label("Under Review") + .addClass("entry-subtitle", "under-review"), + ); + } + + if (x.type == DropType.ReviewDeclined) { + return CenterV( + Label("Declined") + .addClass("entry-subtitle", "under-review"), + ); + } + + return Empty(); + })()) + .onClick(() => location.href = x.type === DropType.Unsubmitted ? `/c/music/new-drop?id=${x._id}` : `/c/music/edit?id=${x._id}`); +} export const musicList = (list: Drop[], type: DropType) => Vertical( diff --git a/pages/music/views/menu.ts b/pages/music/views/menu.ts index 7792809..3ac9030 100644 --- a/pages/music/views/menu.ts +++ b/pages/music/views/menu.ts @@ -2,7 +2,7 @@ import { API, Chart, count, HeavyList, LoadingSpinner, Navigation, placeholder, import { asRef, asState, Button, Component, Entry, Grid, Horizontal, Image, isMobile, LinkButton, MediaQuery, ref } from "webgen/mod.ts"; import { templateArtwork } from "../../../assets/imports.ts"; import { Artist, Drop, DropType, Payout } from "../../../spec/music.ts"; -import { activeUser } from "../../_legacy/helper.ts"; +import { activeUser } from "../../shared/helper.ts"; import { musicList } from "./list.ts"; import { createArtistSheet } from "./table.ts"; diff --git a/pages/music/views/table.ts b/pages/music/views/table.ts index 789c1e8..69b3715 100644 --- a/pages/music/views/table.ts +++ b/pages/music/views/table.ts @@ -3,7 +3,7 @@ import { asRef, asState, Box, Button, Checkbox, Color, DropDownInput, Grid, Hori import genres from "../../../data/genres.json" with { type: "json" }; import language from "../../../data/language.json" with { type: "json" }; import { Artist, ArtistRef, ArtistTypes, Song } from "../../../spec/music.ts"; -import { getSecondary, getYearList, ProfilePicture, sheetStack } from "../../_legacy/helper.ts"; +import { getSecondary, getYearList, ProfilePicture, sheetStack } from "../../shared/helper.ts"; import "./table.css"; export function ManageSongs(songs: Reference, uploadingSongs: Reference<{ [uploadId: string]: number }[]>, primaryGenre: string) { diff --git a/pages/payout/main.ts b/pages/payout/main.ts index 25ab500..f12ac13 100644 --- a/pages/payout/main.ts +++ b/pages/payout/main.ts @@ -5,7 +5,7 @@ import "../../assets/css/main.css"; import "../../assets/css/music.css"; import { DynaNavigation } from "../../components/nav.ts"; import { Drop, Payout } from "../../spec/music.ts"; -import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded } from "../_legacy/helper.ts"; +import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded } from "../shared/helper.ts"; await RegisterAuthRefresh(); diff --git a/pages/_legacy/helper.ts b/pages/shared/helper.ts similarity index 100% rename from pages/_legacy/helper.ts rename to pages/shared/helper.ts diff --git a/pages/shared/navigation.ts b/pages/shared/navigation.ts index 5a17ad7..b925d82 100644 --- a/pages/shared/navigation.ts +++ b/pages/shared/navigation.ts @@ -112,7 +112,7 @@ class MenuImpl extends Component { } const entry = Entry(item.replacement ? asRef(item.replacement).getValue() : item).addClass(isMobile.map((mobile) => mobile ? "small" : "desktop")); - const click = this.createClickHandler(item); + const click = this.#createClickHandler(item); if (item.suffix) { entry.addSuffix(asRef(item.suffix).getValue()); } @@ -146,7 +146,7 @@ class MenuImpl extends Component { }); } - private createClickHandler(menu: MenuNode): undefined | (() => Promise | void) { + #createClickHandler(menu: MenuNode): undefined | (() => Promise | void) { if (menu.clickHandler) { return async () => { await menu.clickHandler?.(`${this.path.getValue() + menu.id}/`, menu); diff --git a/pages/shared/restSpec.ts b/pages/shared/restSpec.ts index 0a79436..0180d8a 100644 --- a/pages/shared/restSpec.ts +++ b/pages/shared/restSpec.ts @@ -1,5 +1,5 @@ import { Artist, BugReport, Drop, DropType, File, Group, Meta, OAuthApp, Payout, RequestPayoutResponse, Server, ServerAudit, ServerCreate, ServerTypes, Song, StoreItems, Wallet } from "../../spec/music.ts"; -import { ProfileData } from "../_legacy/helper.ts"; +import { ProfileData } from "./helper.ts"; export const Permissions = [ "/hmsys", diff --git a/pages/user/actions.ts b/pages/user/actions.ts index 131cd67..cfd288f 100644 --- a/pages/user/actions.ts +++ b/pages/user/actions.ts @@ -1,7 +1,7 @@ import { assert } from "@std/assert"; import { delay } from "@std/async"; import { API, displayError, stupidErrorAlert } from "shared/mod.ts"; -import { forceRefreshToken, gotoGoal } from "../_legacy/helper.ts"; +import { forceRefreshToken, gotoGoal } from "../shared/helper.ts"; import { state } from "./state.ts"; export async function loginUser() { diff --git a/pages/user/oauth.ts b/pages/user/oauth.ts index 339eccb..4c70382 100644 --- a/pages/user/oauth.ts +++ b/pages/user/oauth.ts @@ -5,7 +5,7 @@ import "../../assets/css/main.css"; import { dots, templateArtwork } from "../../assets/imports.ts"; import { DynaNavigation } from "../../components/nav.ts"; import { OAuthScopes } from "../../spec/music.ts"; -import { activeUser, getNameInital, logOut, ProfilePicture, RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { activeUser, getNameInital, logOut, ProfilePicture, RegisterAuthRefresh } from "../shared/helper.ts"; import "./oauth.css"; import "./signin.css"; diff --git a/pages/user/settings.personal.ts b/pages/user/settings.personal.ts index 934e33d..33363d7 100644 --- a/pages/user/settings.personal.ts +++ b/pages/user/settings.personal.ts @@ -2,7 +2,7 @@ import { delay } from "@std/async"; import { API, StreamingUploadHandler, stupidErrorAlert } from "shared/mod.ts"; import { asRef, asState, Box, Button, CenterV, createFilePicker, Empty, getErrorMessage, Grid, Horizontal, IconButton, Image, Label, MIcon, Spacer, TextInput, Validate, Vertical } from "webgen/mod.ts"; import { zod } from "webgen/zod.ts"; -import { activeUser, allowedImageFormats, forceRefreshToken, IsLoggedIn, showProfilePicture } from "../_legacy/helper.ts"; +import { activeUser, allowedImageFormats, forceRefreshToken, IsLoggedIn, showProfilePicture } from "../shared/helper.ts"; export function ChangePersonal() { const state = asState({ diff --git a/pages/user/settings.ts b/pages/user/settings.ts index 5bcd175..ca627f5 100644 --- a/pages/user/settings.ts +++ b/pages/user/settings.ts @@ -3,7 +3,7 @@ import { asState, Body, Box, Button, CenterV, Empty, getErrorMessage, Grid, Hori import { zod } from "webgen/zod.ts"; import "../../assets/css/main.css"; import { DynaNavigation } from "../../components/nav.ts"; -import { logOut, RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { logOut, RegisterAuthRefresh } from "../shared/helper.ts"; import { ChangePersonal } from "./settings.personal.ts"; WebGen(); diff --git a/pages/user/signin.ts b/pages/user/signin.ts index 20e9e49..ae3b15b 100644 --- a/pages/user/signin.ts +++ b/pages/user/signin.ts @@ -5,7 +5,7 @@ import { Body, Box, Button, ButtonStyle, Color, Component, createElement, Custom import "../../assets/css/main.css"; import { discordLogo, googleLogo } from "../../assets/imports.ts"; import { DynaNavigation } from "../../components/nav.ts"; -import { RegisterAuthRefresh } from "../_legacy/helper.ts"; +import { RegisterAuthRefresh } from "../shared/helper.ts"; import { handleStateChange, loginUser, registerUser } from "./actions.ts"; import "./signin.css"; import { state } from "./state.ts"; diff --git a/pages/wallet/wallet.ts b/pages/wallet/wallet.ts index 767702a..e1c93d7 100644 --- a/pages/wallet/wallet.ts +++ b/pages/wallet/wallet.ts @@ -2,7 +2,7 @@ import { API, LoadingSpinner, Navigation, stupidErrorAlert } from "shared/mod.ts import { asState, Body, Button, Color, Grid, isMobile, Label, LinkButton, MediaQuery, SheetDialog, Table, TextInput, Vertical, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; import { Wallet } from "../../spec/music.ts"; -import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../_legacy/helper.ts"; +import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../shared/helper.ts"; import "./wallet.css"; await RegisterAuthRefresh(); From d0cd4fb51bed5311cbe2b0e51703c8844cebc496 Mon Sep 17 00:00:00 2001 From: Skidder Date: Mon, 12 Aug 2024 16:20:12 +0800 Subject: [PATCH 2/6] serve fix --- serve.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/serve.ts b/serve.ts index 9f02452..05f702e 100644 --- a/serve.ts +++ b/serve.ts @@ -56,12 +56,12 @@ serve({ "p/imprint": "./pages/holding/imprint.ts", "p/distribution-agreement": "./pages/holding/distributionAgreement.ts", "signin": "./pages/user/signin.ts", - "callback": "./pages/_legacy/misc/callback.ts", + "callback": "./pages/misc/callback.ts", "oauth": "./pages/user/oauth.ts", "music": "./pages/music-landing/main.ts", "c/music": "./pages/music/main.ts", "c/music/new-drop": "./pages/music/newDrop.ts", - "c/music/edit": "./pages/_legacy/music/edit.ts", + "c/music/edit": "./pages/music/edit.ts", "c/music/payout": "./pages/payout/main.ts", "hosting": "./pages/hosting/main.ts", "hosting/create": "./pages/hosting/views/create.ts", From b310f26a61ac353bf9c143356fb43242f32bef93 Mon Sep 17 00:00:00 2001 From: Skidder Date: Mon, 12 Aug 2024 23:49:54 +0800 Subject: [PATCH 3/6] fixes --- pages/admin/views/list.ts | 10 +++++----- pages/admin/views/menu.ts | 4 ++-- pages/music/views/list.ts | 8 ++++---- pages/music/views/menu.ts | 8 +++++--- pages/wallet/wallet.ts | 9 +++++---- 5 files changed, 21 insertions(+), 18 deletions(-) diff --git a/pages/admin/views/list.ts b/pages/admin/views/list.ts index 27ba2cf..948fe02 100644 --- a/pages/admin/views/list.ts +++ b/pages/admin/views/list.ts @@ -1,5 +1,5 @@ import { API, External, fileCache, RenderItem, stupidErrorAlert } from "shared/mod.ts"; -import { Box, Button, Cache, Color, Entry, Grid, Horizontal, IconButton, Image, MIcon, ref, SheetDialog, Spacer, TextInput, Vertical } from "webgen/mod.ts"; +import { asRef, Box, Button, Cache, Color, Entry, Grid, Horizontal, IconButton, Image, MIcon, ref, SheetDialog, Spacer, TextInput, Vertical } from "webgen/mod.ts"; import { templateArtwork } from "../../../assets/imports.ts"; import { File, OAuthApp, Transcript, Wallet } from "../../../spec/music.ts"; import { saveBlob, sheetStack } from "../../shared/helper.ts"; @@ -73,10 +73,10 @@ const oAuthViewDialog = (oauth: OAuthApp) => "OAuth App Details", Vertical( Grid( - TextInput("text", "Name").setValue(oauth.name).setColor(Color.Disabled), - TextInput("text", "Client ID").setValue(oauth._id).setColor(Color.Disabled), - TextInput("text", "Client Secret").setValue(oauth.secret).setColor(Color.Disabled), - TextInput("text", "Redirect URI").setValue(oauth.redirect.join(",")).setColor(Color.Disabled), + TextInput("text", "Name").ref(asRef(oauth.name)).setColor(Color.Disabled), + TextInput("text", "Client ID").ref(asRef(oauth._id)).setColor(Color.Disabled), + TextInput("text", "Client Secret").ref(asRef(oauth.secret)).setColor(Color.Disabled), + TextInput("text", "Redirect URI").ref(asRef(oauth.redirect.join(","))).setColor(Color.Disabled), ), Horizontal( Spacer(), diff --git a/pages/admin/views/menu.ts b/pages/admin/views/menu.ts index ffa255f..0a28093 100644 --- a/pages/admin/views/menu.ts +++ b/pages/admin/views/menu.ts @@ -2,7 +2,7 @@ import { debounce } from "@std/async"; import { sumOf } from "@std/collections"; import loader from "https://esm.sh/@monaco-editor/loader@1.4.0"; import { API, HeavyList, loadMore, Navigation, placeholder, stupidErrorAlert } from "shared/mod.ts"; -import { asState, Box, Button, Color, Custom, Entry, Grid, Horizontal, isMobile, Items, Label, lazy, ref, SheetDialog, Spacer, Table, TextInput, Vertical } from "webgen/mod.ts"; +import { asRef, asState, Box, Button, Color, Custom, Entry, Grid, Horizontal, isMobile, Items, Label, lazy, ref, SheetDialog, Spacer, Table, TextInput, Vertical } from "webgen/mod.ts"; import { Drop, DropType, Server, Transcript } from "../../../spec/music.ts"; import { activeUser, ProfileData, sheetStack, showProfilePicture } from "../../shared/helper.ts"; import { upload } from "../loading.ts"; @@ -223,7 +223,7 @@ const addOAuthDialog = SheetDialog( Table([ ["URI", "auto", (_, index) => TextInput("text", "URI", "blur") - .setValue(x[index]) + .ref(asRef(x[index])) .onChange((data) => { x[index] = data ?? ""; })], diff --git a/pages/music/views/list.ts b/pages/music/views/list.ts index 51bdf47..d4ff75d 100644 --- a/pages/music/views/list.ts +++ b/pages/music/views/list.ts @@ -1,14 +1,14 @@ import { placeholder } from "shared/mod.ts"; -import { CenterV, Component, Empty, Entry, Label, MediaQuery, Vertical } from "webgen/mod.ts"; +import { CenterV, Component, Empty, Entry, isMobile, Label, Vertical } from "webgen/mod.ts"; import { Drop, DropType } from "../../../spec/music.ts"; import { showPreviewImage } from "../../shared/helper.ts"; -function DropEntry(x: Drop, small: boolean) { +function DropEntry(x: Drop) { return Entry({ title: x.title ?? "(no drop name)", subtitle: `${x.release ?? "(no release date)"} - ${x.gtin ?? "(no GTIN)"}`, }) - .addClass(small ? "small" : "normal") + .addClass(isMobile.map((mobile) => mobile ? "small" : "normal")) .addPrefix(showPreviewImage(x).addClass("image-square")) .addSuffix((() => { if (x.type == DropType.UnderReview) { @@ -51,7 +51,7 @@ export function CategoryRender(dropList: Drop[], title: string): Component[] | n return [ Label(title) .addClass("list-title"), - MediaQuery("(max-width: 700px)", (matches) => Vertical(...dropList.map((x) => DropEntry(x, matches))).setGap("1rem")), + Vertical(...dropList.map((x) => DropEntry(x))).setGap("1rem"), ]; } diff --git a/pages/music/views/menu.ts b/pages/music/views/menu.ts index 3ac9030..dce5393 100644 --- a/pages/music/views/menu.ts +++ b/pages/music/views/menu.ts @@ -1,5 +1,5 @@ import { API, Chart, count, HeavyList, LoadingSpinner, Navigation, placeholder, stupidErrorAlert } from "shared/mod.ts"; -import { asRef, asState, Button, Component, Entry, Grid, Horizontal, Image, isMobile, LinkButton, MediaQuery, ref } from "webgen/mod.ts"; +import { asRef, asState, Button, Component, Entry, Grid, Horizontal, Image, isMobile, LinkButton, ref } from "webgen/mod.ts"; import { templateArtwork } from "../../../assets/imports.ts"; import { Artist, Drop, DropType, Payout } from "../../../spec/music.ts"; import { activeUser } from "../../shared/helper.ts"; @@ -66,6 +66,7 @@ export const musicMenu = Navigation({ ).setGap(), ) .addPrefix(Image(templateArtwork, "").addClass("image-square"))) + .addClass(isMobile.map((mobile) => mobile ? "small" : "normal")) .setPlaceholder(placeholder("No Artists", "Create a new Artist to release music")), ], }, @@ -74,7 +75,7 @@ export const musicMenu = Navigation({ title: ref`Payouts ${count(menuState.$payouts)}`, children: menuState.$payouts.map((payouts) => payouts == "loading" ? [LoadingSpinner()] : [ - MediaQuery("(max-width: 700px)", (small) => + isMobile.map((mobile) => Grid( Chart({ type: "bar", @@ -142,7 +143,8 @@ export const musicMenu = Navigation({ }, }, }), - ).setEvenColumns(small ? 1 : 2)), + ).setEvenColumns(mobile ? 1 : 2) + ).asRefComponent(), HeavyList(menuState.$payouts, (x) => Entry({ title: x.period, diff --git a/pages/wallet/wallet.ts b/pages/wallet/wallet.ts index e1c93d7..d0032fd 100644 --- a/pages/wallet/wallet.ts +++ b/pages/wallet/wallet.ts @@ -1,5 +1,5 @@ import { API, LoadingSpinner, Navigation, stupidErrorAlert } from "shared/mod.ts"; -import { asState, Body, Button, Color, Grid, isMobile, Label, LinkButton, MediaQuery, SheetDialog, Table, TextInput, Vertical, WebGen } from "webgen/mod.ts"; +import { asState, Body, Button, Color, Grid, isMobile, Label, LinkButton, SheetDialog, Table, TextInput, Vertical, WebGen } from "webgen/mod.ts"; import { DynaNavigation } from "../../components/nav.ts"; import { Wallet } from "../../spec/music.ts"; import { changeThemeColor, RegisterAuthRefresh, renewAccessTokenIfNeeded, sheetStack } from "../shared/helper.ts"; @@ -91,7 +91,7 @@ sheetStack.setDefault(Vertical( isMobile.map((mobile) => mobile ? "mobile-navigation" : "navigation"), "limited-width", ), - MediaQuery("(max-width: 700px)", (small) => + isMobile.map((mobile) => Vertical( Grid( Grid( @@ -114,7 +114,7 @@ sheetStack.setDefault(Vertical( .addClass("details-item"), ) .setWidth("100%") - .setEvenColumns(small ? 1 : 2) + .setEvenColumns(mobile ? 1 : 2) .setGap(), Table([ ["Amount", "auto", ({ amount }) => Label(`${amount.toFixed(2)} £`)], @@ -122,7 +122,8 @@ sheetStack.setDefault(Vertical( ["Counterparty", "auto", ({ counterParty }) => Label(counterParty)], ["Date", "auto", ({ timestamp }) => Label(new Date(Number(timestamp)).toDateString())], ], wallet.transactions), - ).setGap()), + ).setGap() + ).asRefComponent(), ).addClass("limited-width") : LoadingSpinner() ).asRefComponent(), From dae4b98320d48efe68b68d6bf98fb0d3014f0ab2 Mon Sep 17 00:00:00 2001 From: lucsoft Date: Mon, 12 Aug 2024 18:06:48 +0200 Subject: [PATCH 4/6] Make sticky-footer work in sheets --- pages/shared/navigation.css | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/pages/shared/navigation.css b/pages/shared/navigation.css index ff68664..ae889a3 100644 --- a/pages/shared/navigation.css +++ b/pages/shared/navigation.css @@ -3,11 +3,8 @@ } .sticky-footer { + position: sticky; height: 37px; -} - -.sticky-footer .action-list-bar { - position: fixed; bottom: var(--gap); padding: 0 var(--gap); left: 0; From 7114bfa33b65c5a2edf90e249a6487408283f058 Mon Sep 17 00:00:00 2001 From: lucsoft Date: Mon, 12 Aug 2024 18:07:02 +0200 Subject: [PATCH 5/6] Move nav to inside of sheetstack --- pages/music/main.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pages/music/main.ts b/pages/music/main.ts index 77ebfaa..7d843cc 100644 --- a/pages/music/main.ts +++ b/pages/music/main.ts @@ -14,9 +14,9 @@ WebGen({ }, }); -sheetStack.setDefault(musicMenu); +sheetStack.setDefault(Vertical(DynaNavigation("Music"), musicMenu)); -Body(Vertical(DynaNavigation("Music"), sheetStack)); +Body(sheetStack); renewAccessTokenIfNeeded() .then(async () => { From 7166e08f3d7bad74d50da36ead89f71b54383607 Mon Sep 17 00:00:00 2001 From: Skidder Date: Tue, 13 Aug 2024 00:18:12 +0800 Subject: [PATCH 6/6] fix for no space --- deno.jsonc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/deno.jsonc b/deno.jsonc index 662e7d1..1a97b66 100644 --- a/deno.jsonc +++ b/deno.jsonc @@ -9,7 +9,7 @@ "@std/path": "jsr:@std/path@^0.225.2", "shared/": "./pages/shared/", // "webgen/": "../WebGen/" - "webgen/": "https://raw.githubusercontent.com/lucsoft/WebGen/e46dd0c/" + "webgen/": "https://raw.githubusercontent.com/lucsoft/WebGen/2a09549/" }, "lock": false, "compilerOptions": {