From 9c7d153f150f890281b2566079e8487c264a9d5e Mon Sep 17 00:00:00 2001
From: Ajay <dev@ajay.app>
Date: Fri, 2 Sep 2022 00:15:05 -0400
Subject: [PATCH] Move segment export to backup page and improve margins

---
 public/_locales/en/messages.json                         | 2 +-
 public/options/options.html                              | 6 ++----
 src/components/options/UnsubmittedVideoListComponent.tsx | 3 ++-
 src/components/options/UnsubmittedVideosComponent.tsx    | 5 ++---
 4 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/public/_locales/en/messages.json b/public/_locales/en/messages.json
index e7cbfaa0..20381761 100644
--- a/public/_locales/en/messages.json
+++ b/public/_locales/en/messages.json
@@ -1207,6 +1207,6 @@
         "description": "Header of the unsubmitted segments list"
     },
     "exportSegmentsAsURL": {
-        "message": "Export segments as URL"
+        "message": "Share as URL"
     }
 }
diff --git a/public/options/options.html b/public/options/options.html
index dbf9473f..fa23687a 100644
--- a/public/options/options.html
+++ b/public/options/options.html
@@ -362,6 +362,8 @@
 						</div>
 					</div>
 				</div>
+
+				<div data-type="react-UnsubmittedVideosComponent"></div>
 	
 				<div data-type="private-text-change" data-sync="*" data-confirm-message="exportOptionsWarning">
 					<h2>__MSG_exportOptions__</h2>
@@ -491,10 +493,6 @@
 					<div class="small-description">__MSG_copyDebugInformationOptions__</div>
 				</div>
 
-				<div data-type="react-UnsubmittedVideosComponent">
-
-				</div>
-
 				<div data-type="toggle" data-sync="testingServer" data-confirm-message="testingServerWarning" data-no-safari="true">
 					<div class="switch-container">
 						<label class="switch">
diff --git a/src/components/options/UnsubmittedVideoListComponent.tsx b/src/components/options/UnsubmittedVideoListComponent.tsx
index 2f3aa75a..e63feb99 100644
--- a/src/components/options/UnsubmittedVideoListComponent.tsx
+++ b/src/components/options/UnsubmittedVideoListComponent.tsx
@@ -29,7 +29,8 @@ class UnsubmittedVideoListComponent extends React.Component<UnsubmittedVideoList
 
         return (
             <table id="unsubmittedVideosList"
-                className="categoryChooserTable">
+                className="categoryChooserTable"
+                style={{marginTop: "10px"}} >
                 <tbody>
                     {/* Headers */}
                     <tr id="UnsubmittedVideosListHeader"
diff --git a/src/components/options/UnsubmittedVideosComponent.tsx b/src/components/options/UnsubmittedVideosComponent.tsx
index d01c8294..892c49be 100644
--- a/src/components/options/UnsubmittedVideosComponent.tsx
+++ b/src/components/options/UnsubmittedVideosComponent.tsx
@@ -15,7 +15,6 @@ class UnsubmittedVideosComponent extends React.Component<UnsubmittedVideosProps,
     constructor(props: UnsubmittedVideosProps) {
         super(props);
 
-        // Setup state
         this.state = {
             tableVisible: false,
         };
@@ -23,10 +22,10 @@ class UnsubmittedVideosComponent extends React.Component<UnsubmittedVideosProps,
 
     render(): React.ReactElement {
         const videoCount = Object.keys(Config.config.unsubmittedSegments).length;
-        const segmentCount = Object.values(Config.config.unsubmittedSegments).reduce((acc: number, vid: Array<unknown>) => acc+vid.length, 0);
+        const segmentCount = Object.values(Config.config.unsubmittedSegments).reduce((acc: number, vid: Array<unknown>) => acc + vid.length, 0);
 
         return <>
-            <div>
+            <div style={{marginBottom: "10px"}}>
                 {segmentCount == 0 ?
                     chrome.i18n.getMessage("unsubmittedSegmentCountsZero") :
                     chrome.i18n.getMessage("unsubmittedSegmentCounts")