diff --git a/src/content.ts b/src/content.ts
index ad83de90..f0915273 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -392,6 +392,9 @@ function messageListener(
                 })
             );
             break;
+        case "submitPortVideo":
+            submitPortVideo(request.ytbID).then((response) => sendResponse(response));
+            break;
     }
 
     sendResponse({});
@@ -1277,7 +1280,7 @@ async function submitPortVideo(ytbID: VideoID): Promise<PortVideo> {
     const newPortVideo = await postPortVideo(getVideoID(), ytbID, getVideo()?.duration);
     portVideo = newPortVideo;
     updatePortVideoElements(portVideo);
-    this.sponsorsLookup(true, true, true);
+    sponsorsLookup(true, true, true);
     return newPortVideo;
 }
 
@@ -1289,7 +1292,7 @@ async function portVideoVote(UUID: string, bvID: VideoID, voteType: number) {
 async function updateSegments(): Promise<FetchResponse> {
     const response = await updatePortedSegments(getVideoID());
     if (response.ok) {
-        this.sponsorsLookup(true, true, true);
+        sponsorsLookup(true, true, true);
     }
     return response;
 }
diff --git a/src/messageTypes.ts b/src/messageTypes.ts
index a1dcbd46..2a5f5d24 100644
--- a/src/messageTypes.ts
+++ b/src/messageTypes.ts
@@ -69,6 +69,11 @@ interface KeyDownMessage {
     metaKey: boolean;
 }
 
+interface SubmitPortVideoMessage {
+    message: "submitPortVideo";
+    ytbID: string;
+}
+
 export type Message = BaseMessage &
     (
         | DefaultMessage
@@ -80,6 +85,7 @@ export type Message = BaseMessage &
         | CopyToClipboardMessage
         | ImportSegmentsMessage
         | KeyDownMessage
+        | SubmitPortVideoMessage
     );
 
 export interface IsInfoFoundMessageResponse {
@@ -115,7 +121,8 @@ export type MessageResponse =
     | Record<string, never> // empty object response {}
     | VoteResponse
     | ImportSegmentsResponse
-    | RefreshSegmentsResponse;
+    | RefreshSegmentsResponse
+    | PortVideo;
 
 export interface VoteResponse {
     successType: number;
diff --git a/src/popup/PortVideoSection.tsx b/src/popup/PortVideoSection.tsx
new file mode 100644
index 00000000..dff1c72c
--- /dev/null
+++ b/src/popup/PortVideoSection.tsx
@@ -0,0 +1,71 @@
+import { MessageInstance } from "antd/es/message/interface";
+import * as React from "react";
+import { Message } from "../messageTypes";
+import { parseYoutubeID } from "../utils/parseVideoID";
+import { PortVideo } from "../types";
+
+interface PortVideoProps {
+    messageApi: MessageInstance;
+    sendTabMessage: (data: Message, callback?) => void;
+    sendTabMessageAsync: (data: Message) => Promise<unknown>;
+}
+
+interface PortVideoState {
+    portVideo: PortVideo;
+}
+
+export class PortVideoSection extends React.Component<PortVideoProps, PortVideoState> {
+    constructor(props: PortVideoProps) {
+        super(props);
+        this.state = {
+            portVideo: null,
+        };
+    }
+
+    private inputRef = React.createRef<HTMLInputElement>();
+
+    private hasPortVideo(): boolean {
+        return !!this.state.portVideo;
+    }
+
+    private async submitPortVideo(): Promise<void> {
+        const YtbInput = this.inputRef.current.value;
+        if (!YtbInput) {
+            return;
+        }
+        const ytbID = parseYoutubeID(YtbInput);
+        // this.setState({ loading: true });
+
+        try {
+            const newPortVideo = await this.props.sendTabMessageAsync({ message: "submitPortVideo", ytbID: ytbID });
+            if (newPortVideo) {
+                this.setState({ portVideo: newPortVideo as PortVideo });
+            }
+        } catch (e) {
+            this.props.messageApi.error(e.getMessage());
+        }
+    }
+
+    render() {
+        return (
+            <div>
+                {this.hasPortVideo() ? (
+                    <div>
+                        <div>{this.state.portVideo.ytbID}</div>
+                    </div>
+                ) : (
+                    <>
+                        <input
+                            ref={this.inputRef}
+                            type="text"
+                            placeholder={chrome.i18n.getMessage("enterPortVideoURL")}
+                        ></input>
+                        <button className="active" onClick={() => this.submitPortVideo()}>
+                            {chrome.i18n.getMessage("submit")}
+                        </button>
+                    </>
+                )}
+            </div>
+        );
+    }
+}
diff --git a/src/popup/VideoInfo/VideoInfo.tsx b/src/popup/VideoInfo/VideoInfo.tsx
index 21c0a0f8..e6a83557 100644
--- a/src/popup/VideoInfo/VideoInfo.tsx
+++ b/src/popup/VideoInfo/VideoInfo.tsx
@@ -25,7 +25,6 @@ interface VideoInfoState {
     importInputOpen: boolean;
 
     downloadedTimes: SponsorTime[];
-    portVideo: PortVideo;
     currentTime: number;
 }
 
@@ -39,7 +38,6 @@ class VideoInfo extends React.Component<VideoInfoProps, VideoInfoState> {
             importInputOpen: false,
 
             downloadedTimes: [],
-            portVideo: null,
             currentTime: 0,
         };
     }
@@ -141,7 +139,7 @@ class VideoInfo extends React.Component<VideoInfoProps, VideoInfoState> {
             .sort((a, b) => a.segment[1] - b.segment[1])
             .sort((a, b) => a.segment[0] - b.segment[0]);
 
-        this.setState({ downloadedTimes: downloadedTimes, portVideo: portVideo, currentTime: time });
+        this.setState({ downloadedTimes: downloadedTimes, currentTime: time });
     }
 
     private SegmentList(): React.ReactNode[] {
@@ -166,6 +164,7 @@ class VideoInfo extends React.Component<VideoInfoProps, VideoInfoState> {
                 <Button id="refreshSegmentsButton" shape="circle" type="text" onClick={this.refreshSegments.bind(this)}>
                     <ReloadOutlined spin={this.state.loading} style={{ fontSize: 16, padding: 1 }} />
                 </Button>
+
                 {/* Video Segments */}
                 <div id="issueReporterContainer">
                     <div id="issueReporterTimeButtons">{this.SegmentList()}</div>
diff --git a/src/popup/app.tsx b/src/popup/app.tsx
index 276d002f..3d320c7e 100644
--- a/src/popup/app.tsx
+++ b/src/popup/app.tsx
@@ -8,6 +8,7 @@ import { waitFor } from "../utils/index";
 import ControlMenu from "./ControlMenu";
 import PopupFooter from "./PopupFooter";
 import { MessageHandler } from "./PopupMessageHandler";
+import { PortVideoSection } from "./PortVideoSection";
 import SubmitBox from "./SubmitBox";
 import UserWork from "./UserWork";
 import VideoInfo from "./VideoInfo/VideoInfo";
@@ -15,6 +16,7 @@ import VideoInfo from "./VideoInfo/VideoInfo";
 function app() {
     const videoInfoRef = React.createRef<VideoInfo>();
     const controlMenuRef = React.createRef<ControlMenu>();
+    const portVideoRef = React.createRef<PortVideoSection>();
     const submitBoxRef = React.createRef<SubmitBox>();
 
     const [messageApi, messageContextHolder] = message.useMessage();
@@ -283,6 +285,13 @@ function app() {
                     sendTabMessageAsync={sendTabMessageAsync}
                 />
 
+                <PortVideoSection
+                    ref={portVideoRef}
+                    messageApi={messageApi}
+                    sendTabMessage={sendTabMessage}
+                    sendTabMessageAsync={sendTabMessageAsync}
+                />
+
                 {/* <!-- Submit box --> */}
                 {!Config.config.cleanPopup && (
                     <>