From 51575b6e7b0fef185143c9b9ac346ee2a0396e98 Mon Sep 17 00:00:00 2001 From: emma Date: Mon, 8 Jan 2024 18:44:46 -0500 Subject: [PATCH] wip --- src/electron/electron-rec-preload.ts | 2 +- src/electron/electron-recorder-app.ts | 52 ++--- src/electron/rec-window.ts | 2 +- src/types.ts | 9 + src/ui/app.ts | 17 +- src/ui/coll-index.ts | 112 ++++------ src/ui/coll-info.ts | 284 +++++++++----------------- src/ui/coll.ts | 4 +- src/ui/upload.ts | 2 +- webpack.config.js | 2 +- yarn.lock | 160 ++++++++++++--- 11 files changed, 318 insertions(+), 328 deletions(-) create mode 100644 src/types.ts diff --git a/src/electron/electron-rec-preload.ts b/src/electron/electron-rec-preload.ts index f6d02010..a46abc45 100644 --- a/src/electron/electron-rec-preload.ts +++ b/src/electron/electron-rec-preload.ts @@ -4,7 +4,7 @@ import { ensureDefaultColl } from "../utils"; -import { loader, getDB } from "replaywebpage/src/electron-preload"; +import { loader, getDB } from "replaywebpage/dist/electron-preload"; // eslint-disable-next-line @typescript-eslint/no-var-requires const { ipcRenderer, contextBridge } = require("electron"); diff --git a/src/electron/electron-recorder-app.ts b/src/electron/electron-recorder-app.ts index f227e668..db3ba241 100644 --- a/src/electron/electron-recorder-app.ts +++ b/src/electron/electron-recorder-app.ts @@ -6,7 +6,7 @@ import { ElectronRecorder } from "./electron-recorder"; import { ElectronReplayApp, STATIC_PREFIX, -} from "replaywebpage/src/electron-replay-app"; +} from "replaywebpage/dist/electron-replay-app"; import path from "path"; @@ -19,14 +19,14 @@ class ElectronRecorderApp extends ElectronReplayApp { constructor(opts) { super(opts); -// @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. this.userAgent = null; -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. this.recorders = new Map(); } -// @ts-expect-error - TS2416 - Property 'mainWindowWebPreferences' in type 'ElectronRecorderApp' is not assignable to the same property in base type 'ElectronReplayApp'. + // @ts-expect-error - TS2416 - Property 'mainWindowWebPreferences' in type 'ElectronRecorderApp' is not assignable to the same property in base type 'ElectronReplayApp'. get mainWindowWebPreferences() { return { plugins: true, @@ -49,12 +49,12 @@ class ElectronRecorderApp extends ElectronReplayApp { console.log(`will-download: ${origFilename}`); item.setSavePath( - unusedFilenameSync(path.join(app.getPath("downloads"), origFilename)), + unusedFilenameSync(path.join(app.getPath("downloads"), origFilename)) ); ipcMain.on("dlcancel:" + origFilename, () => { console.log( - `Canceled download for ${origFilename} to ${item.getSavePath()}`, + `Canceled download for ${origFilename} to ${item.getSavePath()}` ); item.cancel(); }); @@ -93,10 +93,10 @@ class ElectronRecorderApp extends ElectronReplayApp { super.onAppReady(); -// @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. | TS2531 - Object is possibly 'null'. + // @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. | TS2531 - Object is possibly 'null'. this.userAgent = this.origUA.replace(/ Electron[^\s]+/, ""); -// @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. app.userAgentFallback = this.userAgent; } @@ -108,7 +108,7 @@ class ElectronRecorderApp extends ElectronReplayApp { const theWindow = super.createMainWindow(argv); theWindow.on("close", async (event) => { -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. if (this.recorders.size) { event.preventDefault(); event.returnValue = false; @@ -127,7 +127,7 @@ class ElectronRecorderApp extends ElectronReplayApp { defaultId: 1, cancelId: 0, title: "Stop Archiving and Quit", -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. message: `There are still ${this.recorders.size} active archiving sessions. Stop all and quit?`, }); @@ -138,9 +138,9 @@ class ElectronRecorderApp extends ElectronReplayApp { const promises = []; -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. for (const rec of this.recorders.values()) { -// @ts-expect-error - TS2345 - Argument of type 'any' is not assignable to parameter of type 'never'. + // @ts-expect-error - TS2345 - Argument of type 'any' is not assignable to parameter of type 'never'. promises.push(rec.shutdownPromise); //rec.detach(); rec.recWindow.close(); @@ -152,7 +152,7 @@ class ElectronRecorderApp extends ElectronReplayApp { } createRecordWindow({ -// @ts-expect-error - TS2525 - Initializer provides no value for this binding element and the binding element has no default value. + // @ts-expect-error - TS2525 - Initializer provides no value for this binding element and the binding element has no default value. url, collId = "", startRec = true, @@ -188,20 +188,20 @@ class ElectronRecorderApp extends ElectronReplayApp { collId, startRec, autorun, - popupView = null, + popupView = null ) { const id = recWebContents.id; const recorder = new ElectronRecorder({ recWC: recWebContents, -// @ts-expect-error - TS2531 - Object is possibly 'null'. + // @ts-expect-error - TS2531 - Object is possibly 'null'. appWC: this.mainWindow.webContents, recWindow, collId, autorun, popup: popupView, staticPrefix: this.staticContentPath, -// @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'userAgent' does not exist on type 'ElectronRecorderApp'. userAgent: this.userAgent, }); @@ -209,22 +209,22 @@ class ElectronRecorderApp extends ElectronReplayApp { console.log("closing..."); event.preventDefault(); recorder.shutdown().then(() => { -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. this.recorders.delete(id); }); }); const newWinContents = popupView -// @ts-expect-error - TS2339 - Property 'webContents' does not exist on type 'never'. - ? popupView.webContents + ? // @ts-expect-error - TS2339 - Property 'webContents' does not exist on type 'never'. + popupView.webContents : recWindow.webContents; newWinContents.on("new-window", (event, url) => { event.preventDefault(); if (url.startsWith(STATIC_PREFIX)) { -// @ts-expect-error - TS2531 - Object is possibly 'null'. + // @ts-expect-error - TS2531 - Object is possibly 'null'. this.mainWindow.loadURL(url); -// @ts-expect-error - TS2531 - Object is possibly 'null'. + // @ts-expect-error - TS2531 - Object is possibly 'null'. this.mainWindow.show(); } }); @@ -255,7 +255,7 @@ class ElectronRecorderApp extends ElectronReplayApp { disposition, options, additionalFeatures, - referrer, + referrer ) => { event.preventDefault(); event.newGuest = this.createRecordWindow({ url, collId, startRec }); @@ -266,13 +266,13 @@ class ElectronRecorderApp extends ElectronReplayApp { disposition, options, additionalFeatures, - referrer, + referrer ); - }, + } ); recWebContents.on("destroyed", () => { -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. this.recorders.delete(id); }); @@ -280,7 +280,7 @@ class ElectronRecorderApp extends ElectronReplayApp { recWebContents.clearHistory(); -// @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. + // @ts-expect-error - TS2339 - Property 'recorders' does not exist on type 'ElectronRecorderApp'. this.recorders.set(id, recorder); if (startRec) { await recorder.attach(); diff --git a/src/electron/rec-window.ts b/src/electron/rec-window.ts index b06489ca..4731f233 100644 --- a/src/electron/rec-window.ts +++ b/src/electron/rec-window.ts @@ -4,7 +4,7 @@ import { css, wrapCss, clickOnSpacebarPress, -} from "replaywebpage/src/misc"; +} from "replaywebpage/dist/misc"; import fasRefresh from "@fortawesome/fontawesome-free/svgs/solid/redo-alt.svg"; //import fasFullscreen from '@fortawesome/fontawesome-free/svgs/solid/desktop.svg'; diff --git a/src/types.ts b/src/types.ts new file mode 100644 index 00000000..79cc1cae --- /dev/null +++ b/src/types.ts @@ -0,0 +1,9 @@ +import { type ItemType } from "replaywebpage"; + +export type WrRecItem = ItemType & { + uploadTime?: number; + mtime: number; + sourceUrl?: string; + ipfsPins?: { url: string }[]; + uploadId: string; +}; diff --git a/src/ui/app.ts b/src/ui/app.ts index afae8eda..91fb1130 100644 --- a/src/ui/app.ts +++ b/src/ui/app.ts @@ -1,4 +1,6 @@ -import { html, css, wrapCss, IS_APP, apiPrefix } from "replaywebpage/src/misc"; +import { ifDefined } from "lit/directives/if-defined.js"; + +import { html, css, wrapCss, IS_APP, apiPrefix } from "replaywebpage/dist/misc"; // replaywebpage imports import { ReplayWebApp, Embed, Loader } from "replaywebpage"; @@ -505,7 +507,7 @@ class ArchiveWebApp extends ReplayWebApp { renderColl() { return html` { - // @ts-expect-error - TS2339 - Property 'ipfsSharePending' does not exist on type 'WrRecCollIndex'. if (!this.ipfsSharePending) { - // @ts-expect-error - TS2339 - Property 'loadColls' does not exist on type 'WrRecCollIndex'. - this.loadColls(); + this.loadItems(); } }, 10000); } - updated(changedProperties) { + updated(changedProperties: PropertyValues) { super.updated(changedProperties); if ( - changedProperties.has("sortedColls") && - // @ts-expect-error - TS2339 - Property 'sortedColls' does not exist on type 'WrRecCollIndex'. - this.sortedColls && - // @ts-expect-error - TS2339 - Property 'sortedColls' does not exist on type 'WrRecCollIndex'. - this.sortedColls.length + changedProperties.has("sortedItems") && + this.sortedItems && + this.sortedItems.length ) { this.dispatchEvent( new CustomEvent("colls-updated", { - // @ts-expect-error - TS2339 - Property 'sortedColls' does not exist on type 'WrRecCollIndex'. - detail: { colls: this.sortedColls }, + detail: { colls: this.sortedItems }, }) ); } } - static get properties() { - return { - ...CollIndex.properties, - - deleteConfirm: { type: Object }, - shareOpts: { type: Object }, - }; - } - - renderCollInfo(coll) { + renderItemInfo(item: WrRecItem) { return html` `; @@ -89,43 +78,23 @@ class WrRecCollIndex extends CollIndex { } renderDeleteConfirm() { - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. if (!this.deleteConfirm) { return null; } return html`

Are you sure you want to permanentely delete the archive - ${ - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. - this.deleteConfirm.title - } + ${this.deleteConfirm.title} (Size: - ${ - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. - prettyBytes(this.deleteConfirm.size) - }) + ${prettyBytes(Number(this.deleteConfirm.size))})

- `; @@ -133,10 +102,8 @@ class WrRecCollIndex extends CollIndex { onIpfsShare(event) { if (event.detail.pending) { - // @ts-expect-error - TS2339 - Property 'ipfsSharePending' does not exist on type 'WrRecCollIndex'. this.ipfsSharePending++; } else { - // @ts-expect-error - TS2339 - Property 'ipfsSharePending' does not exist on type 'WrRecCollIndex'. this.ipfsSharePending--; } } @@ -145,38 +112,31 @@ class WrRecCollIndex extends CollIndex { event.preventDefault(); event.stopPropagation(); - // @ts-expect-error - TS2339 - Property 'sortedColls' does not exist on type 'WrRecCollIndex'. - if (!this.sortedColls) { + if (!this.sortedItems) { return; } const index = Number(event.currentTarget.getAttribute("data-coll-index")); - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. | TS2339 - Property 'sortedColls' does not exist on type 'WrRecCollIndex'. - this.deleteConfirm = this.sortedColls[index]; + this.deleteConfirm = this.sortedItems[index]; } async doDelete() { - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. if (!this.deleteConfirm) { return; } - // @ts-expect-error - TS2339 - Property '_deleting' does not exist on type 'WrRecCollIndex'. | TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. this._deleting[this.deleteConfirm.sourceUrl] = true; this.requestUpdate(); const info = this.renderRoot.querySelector( - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. `wr-rec-coll-info[data-coll="${this.deleteConfirm.id}"]` - ); + ) as WrRecCollInfo; if (info) { - // @ts-expect-error - TS2339 - Property 'doDelete' does not exist on type 'Element'. await info.doDelete(); } - // @ts-expect-error - TS2339 - Property 'deleteConfirm' does not exist on type 'WrRecCollIndex'. this.deleteConfirm = null; } diff --git a/src/ui/coll-info.ts b/src/ui/coll-info.ts index cf69b681..9f866535 100644 --- a/src/ui/coll-info.ts +++ b/src/ui/coll-info.ts @@ -1,4 +1,4 @@ -import { html, css, wrapCss, apiPrefix } from "replaywebpage/src/misc"; +import { html, css, wrapCss, apiPrefix } from "replaywebpage/dist/misc"; import prettyBytes from "pretty-bytes"; @@ -14,33 +14,31 @@ import fasX from "@fortawesome/fontawesome-free/svgs/solid/times.svg"; import btrixCloud from "../../assets/btrix-cloud.svg"; -import { CollInfo } from "replaywebpage"; +import { ItemInfo } from "replaywebpage"; import wrRec from "../../assets/recLogo.svg"; +import { type WrRecItem } from "../types"; const REPLAY_URL = "https://replayweb.page/"; //============================================================================ -class WrRecCollInfo extends CollInfo { - constructor() { - super(); - this.detailed = false; - // @ts-expect-error - TS2339 - Property 'ipfsURL' does not exist on type 'WrRecCollInfo'. - this.ipfsURL = null; - // @ts-expect-error - TS2339 - Property 'shareWait' does not exist on type 'WrRecCollInfo'. - this.shareWait = false; - // @ts-expect-error - TS2551 - Property 'showShareMenu' does not exist on type 'WrRecCollInfo'. Did you mean 'onShowShareMenu'? - this.showShareMenu = false; - // @ts-expect-error - TS2339 - Property 'shareWarn' does not exist on type 'WrRecCollInfo'. - this.shareWarn = false; - // @ts-expect-error - TS2339 - Property 'shareProgressSize' does not exist on type 'WrRecCollInfo'. - this.shareProgressSize = 0; - // @ts-expect-error - TS2339 - Property 'shareProgressTotalSize' does not exist on type 'WrRecCollInfo'. - this.shareProgressTotalSize = 0; - } +class WrRecCollInfo extends ItemInfo { + ipfsURL: string | null = null; + shareWait: boolean = false; + showShareMenu: boolean = false; + shareWarn: boolean = false; + shareProgressSize: number = 0; + shareProgressTotalSize: number = 0; + + items?: WrRecItem[]; + item: WrRecItem | null = null; + isUploadNeeded?: boolean; + shareOpts: TODOFixMe; + ipfsOpts: TODOFixMe; + btrixOpts: TODOFixMe; static get properties() { return { - coll: { type: Object }, + item: { type: Object }, detailed: { type: Boolean }, ipfsURL: { type: String }, shareWait: { type: Boolean }, @@ -110,76 +108,56 @@ class WrRecCollInfo extends CollInfo { width: calc(100% - 0.5em); } - ${CollInfo.compStyles} + ${ItemInfo.compStyles} `; } firstUpdated() { this.renderRoot.addEventListener( "click", - // @ts-expect-error - TS2551 - Property 'showShareMenu' does not exist on type 'WrRecCollInfo'. Did you mean 'onShowShareMenu'? () => (this.showShareMenu = false) ); - // @ts-expect-error - TS2339 - Property 'isUploadNeeded' does not exist on type 'WrRecCollInfo'. - this.isUploadNeeded = - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll && - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.uploadTime && - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.mtime > this.coll.uploadTime; + this.isUploadNeeded = Boolean( + this.item && + this.item.uploadTime && + this.item.mtime > this.item.uploadTime + ); } updated(changedProps) { - // @ts-expect-error - TS2339 - Property 'shareOpts' does not exist on type 'WrRecCollInfo'. if (changedProps.has("shareOpts") && this.shareOpts) { - // @ts-expect-error - TS2339 - Property 'shareOpts' does not exist on type 'WrRecCollInfo'. const { ipfsOpts, btrixOpts } = this.shareOpts; - // @ts-expect-error - TS2339 - Property 'ipfsOpts' does not exist on type 'WrRecCollInfo'. this.ipfsOpts = ipfsOpts; - // @ts-expect-error - TS2339 - Property 'btrixOpts' does not exist on type 'WrRecCollInfo'. this.btrixOpts = btrixOpts; } - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - if (changedProps.has("coll") && this.coll) { + if (changedProps.has("coll") && this.item) { // Fix for loading single collection from previous versions if ( - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.id === "main.archive" && - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.sourceUrl !== "local://main.archive" + this.item.id === "main.archive" && + this.item.sourceUrl !== "local://main.archive" ) { - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll = { ...this.coll, sourceUrl: "local://main.archive" }; + this.item = { ...this.item, sourceUrl: "local://main.archive" }; } - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - if (this.coll.ipfsPins && this.coll.ipfsPins.length) { - // @ts-expect-error - TS2339 - Property 'ipfsURL' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.ipfsURL = this.coll.ipfsPins[this.coll.ipfsPins.length - 1].url; + if (this.item.ipfsPins && this.item.ipfsPins.length) { + this.ipfsURL = this.item.ipfsPins[this.item.ipfsPins.length - 1].url; } - // @ts-expect-error - TS2339 - Property 'isUploadNeeded' does not exist on type 'WrRecCollInfo'. - this.isUploadNeeded = - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll && - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.uploadTime && - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - this.coll.mtime > this.coll.uploadTime; + this.isUploadNeeded = Boolean( + this.item && + this.item.uploadTime && + this.item.mtime > this.item.uploadTime + ); } } render() { - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - const coll = this.coll; + const coll = this.item; const detailed = this.detailed; - // @ts-expect-error - TS2339 - Property 'btrixOpts' does not exist on type 'WrRecCollInfo'. const hasUpload = !!this.btrixOpts; - // @ts-expect-error - TS2339 - Property 'ipfsOpts' does not exist on type 'WrRecCollInfo'. | TS2339 - Property 'ipfsOpts' does not exist on type 'WrRecCollInfo'. const hasIpfs = !!this.ipfsOpts && this.ipfsOpts.daemonUrl; return html` @@ -187,31 +165,29 @@ class WrRecCollInfo extends CollInfo {

Name

- ${detailed - ? html` ${coll.title} ` + ${detailed || coll?.sourceUrl == null + ? html` ${coll?.title} ` : html` ${coll.title}${coll?.title}`}

Date Created

- ${coll.ctime ? new Date(coll.ctime).toLocaleString() : ""} + ${coll?.ctime ? new Date(coll.ctime).toLocaleString() : ""}

Total Size

- ${prettyBytes(Number(coll.size || 0))} + ${prettyBytes(Number(coll?.size || 0))}

Actions

@@ -261,7 +237,7 @@ class WrRecCollInfo extends CollInfo {
` : ""} - ${coll.loadUrl + ${coll?.loadUrl ? html`

Imported From

${coll.loadUrl} @@ -271,31 +247,23 @@ class WrRecCollInfo extends CollInfo {
` : ""}
- ${ - // @ts-expect-error - TS2339 - Property 'shareWarn' does not exist on type 'WrRecCollInfo'. - this.shareWarn ? this.renderShareWarn() : "" - } + ${this.shareWarn ? this.renderShareWarn() : ""} `; } renderIPFSSharing() { - // @ts-expect-error - TS2339 - Property 'ipfsURL' does not exist on type 'WrRecCollInfo'. return this.ipfsURL ? html`
@@ -379,10 +336,7 @@ class WrRecCollInfo extends CollInfo { : html`
`; } renderBtrixUpload() { - // @ts-expect-error - TS2339 - Property 'coll' does not exist on type 'WrRecCollInfo'. - const { uploadId, uploadTime } = this.coll; + const { uploadId, uploadTime } = this.item!; return html`
@@ -421,8 +367,7 @@ class WrRecCollInfo extends CollInfo { > ${uploadTime && uploadId - ? // @ts-expect-error - TS2339 - Property 'isUploadNeeded' does not exist on type 'WrRecCollInfo'. - !this.isUploadNeeded + ? !this.isUploadNeeded ? html`