diff --git a/packages/web_ui/src/components/ModPackViewPage.tsx b/packages/web_ui/src/components/ModPackViewPage.tsx
index 3bd8558f..99cad1d0 100644
--- a/packages/web_ui/src/components/ModPackViewPage.tsx
+++ b/packages/web_ui/src/components/ModPackViewPage.tsx
@@ -182,6 +182,7 @@ function SearchModsTable(props: SearchModsTableProps) {
return <>
{
diff --git a/packages/web_ui/src/components/ModsPage.tsx b/packages/web_ui/src/components/ModsPage.tsx
index 9f22a1a1..731a90a0 100644
--- a/packages/web_ui/src/components/ModsPage.tsx
+++ b/packages/web_ui/src/components/ModsPage.tsx
@@ -1,7 +1,8 @@
-import React, { Fragment, useState, useContext, useEffect, useMemo } from "react";
+import React, { Fragment, useState, useContext, useEffect, useMemo, useRef } from "react";
import { useNavigate } from "react-router-dom";
import {
- Button, Form, Input, Modal, Popconfirm, Space, Table, Typography, Upload, Alert, Select, Tooltip, notification,
+ Button, Form, Input, InputRef, Modal, Popconfirm, Space, Table, Typography, Upload, Alert, Select, Tooltip,
+ notification,
} from "antd";
import {
ImportOutlined, PlusOutlined, SearchOutlined, DownloadOutlined,
@@ -147,6 +148,7 @@ function SearchModsButton() {
const account = useAccount();
const [open, setOpen] = useState(false);
const [form] = Form.useForm();
+ const nameInputRef = useRef(null);
const [searchText, setSearchText] = useState("");
const [factorioVersion, setFactorioVersion] = useState("2.0");
@@ -333,6 +335,7 @@ function SearchModsButton() {
title="Search Mod Portal"
open={open}
onCancel={() => { setOpen(false); }}
+ afterOpenChange={visible => { if (visible) { nameInputRef.current?.focus(); } }}
width={1000}
footer={[