Add copy debug log button to popup

src/popup/PopupComponent.tsx

@@ -4,12 +4,13 @@ import { YourWorkComponent } from "./YourWorkComponent";
 // import { FormattingOptionsComponent } from "./FormattingOptionsComponent";
 import { isSafari } from "../../maze-utils/src/config";
 import { showDonationLink } from "../utils/configUtils";
-import Config from "../config";
+import Config, { generateDebugDetails } from "../config";
-import { GetChannelIDResponse, IsInfoFoundMessageResponse, Message, MessageResponse, PopupMessage } from "../messageTypes";
+import { GetChannelIDResponse, IsInfoFoundMessageResponse, LogResponse, Message, MessageResponse, PopupMessage } from "../messageTypes";
 import { AnimationUtils } from "../../maze-utils/src/animationUtils";
 import { SegmentListComponent } from "./SegmentListComponent";
 import { ActionType, SegmentUUID, SponsorSourceType, SponsorTime } from "../types";
 import { SegmentSubmissionComponent } from "./SegmentSubmissionComponent";
+import { copyToClipboardPopup } from "./popupUtils";
 
 export enum LoadingStatus {
     Loading,
@@ -261,6 +262,14 @@ export const PopupComponent = () => {
                     <a href="https://matrix.to/#/#sponsor:ajay.app?via=ajay.app&via=matrix.org&via=mozilla.org" target="_blank" rel="noreferrer">
                         Matrix
                     </a>
+                    <a id="debugLogs"
+                            onClick={async () => {
+                                const logs = await sendMessage({ message: "getLogs" }) as LogResponse;
+
+                                copyToClipboardPopup(`${generateDebugDetails()}\n\nWarn:\n${logs.warn.join("\n")}\n\nDebug:\n${logs.debug.join("\n")}`, sendMessage);
+                            }}>
+                        {chrome.i18n.getMessage("copyDebugLogs")}
+                    </a>
                 </footer>
             }
 

src/popup/SegmentListComponent.tsx

@@ -10,6 +10,7 @@ import { Message, MessageResponse, VoteResponse } from "../messageTypes";
 import { LoadingStatus } from "./PopupComponent";
 import GenericNotice from "../render/GenericNotice";
 import { exportTimes } from "../utils/exporter";
+import { copyToClipboardPopup } from "./popupUtils";
 
 interface SegmentListComponentProps {
     videoID: VideoID;
@@ -192,7 +193,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, startingLooped,
                         const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.3);
 
                         if (segment.UUID.length > 60) {
-                            copyToClipboard(segment.UUID, sendMessage);
+                            copyToClipboardPopup(segment.UUID, sendMessage);
                         } else {
                             const segmentIDData = await asyncRequestToServer("GET", "/api/segmentID", {
                                 UUID: segment.UUID,
@@ -200,7 +201,7 @@ function SegmentListItem({ segment, videoID, currentTime, isVip, startingLooped,
                             });
                 
                             if (segmentIDData.ok && segmentIDData.responseText) {
-                                copyToClipboard(segmentIDData.responseText, sendMessage);
+                                copyToClipboardPopup(segmentIDData.responseText, sendMessage);
                             }
                         }
 
@@ -360,17 +361,6 @@ function loopChapter({ segment, element, sendMessage }: {
     }
 }
 
-function copyToClipboard(text: string, sendMessage: (request: Message) => Promise<MessageResponse>): void {
-    if (window === window.top) {
-        window.navigator.clipboard.writeText(text);
-    } else {
-        sendMessage({
-            message: "copyToClipboard",
-            text
-        });
-    }
-}
-
 interface ImportSegmentsProps {
     status: LoadingStatus;
     segments: SponsorTime[];
@@ -397,8 +387,8 @@ function ImportSegments(props: ImportSegmentsProps) {
                     className={props.segments.length === 0 ? "hidden" : ""}
                     title={chrome.i18n.getMessage("exportSegments")}
                     onClick={(e) => {
-                        copyToClipboard(exportTimes(props.segments), props.sendMessage);
+                        copyToClipboardPopup(exportTimes(props.segments), props.sendMessage);
-                        
+
                         const stopAnimation = AnimationUtils.applyLoadingAnimation(e.currentTarget, 0.3);
                         stopAnimation();
                         new GenericNotice(null, "exportCopied", {

src/popup/popupUtils.ts

@@ -0,0 +1,12 @@
+import { Message, MessageResponse } from "../messageTypes";
+
+export function copyToClipboardPopup(text: string, sendMessage: (request: Message) => Promise<MessageResponse>): void {
+    if (window === window.top) {
+        window.navigator.clipboard.writeText(text);
+    } else {
+        sendMessage({
+            message: "copyToClipboard",
+            text
+        });
+    }
+}