Skip to content

Conversation

@yamijuan
Copy link
Collaborator

@yamijuan yamijuan commented May 16, 2025

User description

image

closes #8


PR Type

Enhancement


Description

  • Add "Share Current Page" button

  • Display archiving status card with completion message

  • Add divider between status and content

  • Refactor sharing functionality for selected/current pages


Changes walkthrough 📝

Relevant files
Enhancement
argo-archive-list.ts
Add method to retrieve all pages                                                 

src/argo-archive-list.ts

  • Added getAllPages() method to retrieve all pages from the archive list
  • +4/-0     
    sidepanel.ts
    Implement archiving status card with share button               

    src/sidepanel.ts

  • Added status card UI with "All resources archived" message
  • Added "Share Current Page" button with styling
  • Added getCurrentPage() method to find the current page in archive
  • Refactored sharing functionality into separate methods for
    selected/current pages
  • Added styling for status divider
  • +58/-9   

    Need help?
  • Type /help how to ... in the comments thread for any questions about PR-Agent usage.
  • Check out the documentation for more information.
  • @pr-agent-monadical
    Copy link

    PR Reviewer Guide 🔍

    Here are some key observations to aid the review process:

    🎫 Ticket compliance analysis 🔶

    8 - Partially compliant

    Compliant requirements:

    • Create a card that appears at the top of the sidebar when archiving a page
    • Display completion message when archiving is done

    Non-compliant requirements:

    • Show tooltip on hover with remaining/total count of resources archived
    • Calculate and display percentage of resources found

    Requires further human verification:

    • Card should not appear when replaying a page
    ⏱️ Estimated effort to review: 2 🔵🔵⚪⚪⚪
    🧪 No relevant tests
    🔒 No security concerns identified
    ⚡ Recommended focus areas for review

    Missing Tooltip

    The ticket requires a tooltip on hover of the progress bar showing remaining/total count of resources archived, but this functionality is not implemented in the PR.

            ></md-linear-progress>
          `
        : ""
    }
    Type Safety

    Multiple TypeScript errors are being suppressed with @ts-expect-error annotations instead of properly typing the variables and functions.

        ?.getAllPages()
        // @ts-expect-error - TS2339 - Property 'pageUrl' does not exist on type 'ArgoViewer'.
        .filter((p) => p.url === this.pageUrl);
      if (!sameUrls || !sameUrls.length) {
        return null;
      }
    
      // Sort by timestamp (newest first)
      return sameUrls.sort((a, b) => {
        const tsA = parseInt(a.ts, 10);
        const tsB = parseInt(b.ts, 10);
        return tsB - tsA; // Descending order (newest first)
      })[0];
    }
    
    private async onDownload() {
      const selectedPages = this.archiveList?.getSelectedPages?.() || [];
      if (!selectedPages.length) {
        alert("Please select some pages to share.");
        return;
      }
    
      console.log("Selected pages to share:", selectedPages);
    
      const defaultCollId = (await getLocalOption("defaultCollId")) || "";
      const coll = await collLoader.loadColl(defaultCollId);
    
      const pageTsList = selectedPages.map((p) => p.id);
      const format = "wacz";
      const filename = `archive-${Date.now()}.wacz`;
    
      // Webrecorder swlib API format for download:
      const downloader = new Downloader({
        coll,
        format,
        filename,
        pageList: pageTsList,
      });
    
      const response = await downloader.download();
      if (!(response instanceof Response)) {
        console.error("Download failed:", response);
        alert("Failed to download archive.");
        return;
      }
    
      console.log("Download response:", response);
    
      const blob = await response.blob();
      const url = URL.createObjectURL(blob);
    
      // Create temporary <a> to trigger download
      const a = document.createElement("a");
      a.href = url;
      a.download = filename;
      document.body.appendChild(a);
      a.click();
    
      // Cleanup
      URL.revokeObjectURL(url);
      document.body.removeChild(a);
    
      console.log("WACZ file downloaded:", filename);
    }
    
    private async onShareSelected() {
      const selectedPages = this.archiveList?.getSelectedPages?.() || [];
      if (!selectedPages.length) {
        alert("Please select some pages to share.");
        return;
      }
      console.log("Selected pages to share:", selectedPages);
      await this.onShare(selectedPages);
    }
    
    private async onShareCurrent() {
      const currentPage = this.getCurrentPage?.() || null;
      if (!currentPage) {
        alert("No current page to share.");
        return;
      }
      console.log("Current page to share:", currentPage);
      await this.onShare([currentPage]);
    }
    
    // @ts-expect-error - TS7006 - Parameter 'pages' implicitly has an 'any' type.
    private async onShare(pages) {
      const defaultCollId = (await getLocalOption("defaultCollId")) || "";
      const coll = await collLoader.loadColl(defaultCollId);
    
      // @ts-expect-error - TS7006 - Parameter 'p' implicitly has an 'any' type.
      const pageTsList = pages.map((p) => p.id);

    Comment on lines +236 to +251
    private getCurrentPage() {
    const sameUrls = this.archiveList
    ?.getAllPages()
    // @ts-expect-error - TS2339 - Property 'pageUrl' does not exist on type 'ArgoViewer'.
    .filter((p) => p.url === this.pageUrl);
    if (!sameUrls || !sameUrls.length) {
    return null;
    }

    // Sort by timestamp (newest first)
    return sameUrls.sort((a, b) => {
    const tsA = parseInt(a.ts, 10);
    const tsB = parseInt(b.ts, 10);
    return tsB - tsA; // Descending order (newest first)
    })[0];
    }

    Choose a reason for hiding this comment

    The reason will be displayed to describe this comment to others. Learn more.

    Suggestion: Add null check for this.archiveList before accessing getAllPages() to prevent potential runtime errors when archiveList is null or undefined. [possible issue, importance: 8]

    Suggested change
    private getCurrentPage() {
    const sameUrls = this.archiveList
    ?.getAllPages()
    // @ts-expect-error - TS2339 - Property 'pageUrl' does not exist on type 'ArgoViewer'.
    .filter((p) => p.url === this.pageUrl);
    if (!sameUrls || !sameUrls.length) {
    return null;
    }
    // Sort by timestamp (newest first)
    return sameUrls.sort((a, b) => {
    const tsA = parseInt(a.ts, 10);
    const tsB = parseInt(b.ts, 10);
    return tsB - tsA; // Descending order (newest first)
    })[0];
    }
    private getCurrentPage() {
    if (!this.archiveList) {
    return null;
    }
    const sameUrls = this.archiveList
    .getAllPages()
    // @ts-expect-error - TS2339 - Property 'pageUrl' does not exist on type 'ArgoViewer'.
    .filter((p) => p.url === this.pageUrl);
    if (!sameUrls || !sameUrls.length) {
    return null;
    }
    // Sort by timestamp (newest first)
    return sameUrls.sort((a, b) => {
    const tsA = parseInt(a.ts, 10);
    const tsB = parseInt(b.ts, 10);
    return tsB - tsA; // Descending order (newest first)
    })[0];
    }

    Comment on lines +313 to +321
    private async onShareCurrent() {
    const currentPage = this.getCurrentPage?.() || null;
    if (!currentPage) {
    alert("No current page to share.");
    return;
    }
    console.log("Current page to share:", currentPage);
    await this.onShare([currentPage]);
    }

    Choose a reason for hiding this comment

    The reason will be displayed to describe this comment to others. Learn more.

    Suggestion: Remove the optional chaining operator (?.) when calling this.getCurrentPage() since it's a defined method in the class and not an optional property. [general, importance: 6]

    Suggested change
    private async onShareCurrent() {
    const currentPage = this.getCurrentPage?.() || null;
    if (!currentPage) {
    alert("No current page to share.");
    return;
    }
    console.log("Current page to share:", currentPage);
    await this.onShare([currentPage]);
    }
    private async onShareCurrent() {
    const currentPage = this.getCurrentPage() || null;
    if (!currentPage) {
    alert("No current page to share.");
    return;
    }
    console.log("Current page to share:", currentPage);
    await this.onShare([currentPage]);
    }

    Copy link
    Collaborator

    @Shrinks99 Shrinks99 left a comment

    Choose a reason for hiding this comment

    The reason will be displayed to describe this comment to others. Learn more.

    Tested, looks good!

    @yamijuan yamijuan merged commit e9e3ae7 into main May 19, 2025
    1 of 4 checks passed
    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

    Projects

    None yet

    Development

    Successfully merging this pull request may close these issues.

    Current Page Archiving Status Card

    3 participants