diff --git a/CHANGELOG.md b/CHANGELOG.md
index 966cd43dab..f4e6c7b254 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,7 @@
# Changelog
+
+# [23.10.1] = 2023/12/07
+* [UI]: Fixed issue where filter inputs required focus when they are opened on the project samples page. See [PR 1503](https://github.com/phac-nml/irida/pull/1503)
## [23.10] - 2023/10/15
* [Developer]: Added functionality to delete sequence files from file system when a sequence run is removed. [See PR 1468](https://github.com/phac-nml/irida/pull/1468)
diff --git a/build.gradle.kts b/build.gradle.kts
index 6355e8b1ba..fff4cf4b8b 100644
--- a/build.gradle.kts
+++ b/build.gradle.kts
@@ -14,7 +14,7 @@ plugins {
}
group = "ca.corefacility.bioinformatics"
-version = "23.10"
+version = "23.10.1"
description = "irida"
java {
diff --git a/src/main/webapp/resources/js/pages/projects/samples/components/SamplesTable.jsx b/src/main/webapp/resources/js/pages/projects/samples/components/SamplesTable.jsx
index 8ccc01cf88..8e802cc87b 100644
--- a/src/main/webapp/resources/js/pages/projects/samples/components/SamplesTable.jsx
+++ b/src/main/webapp/resources/js/pages/projects/samples/components/SamplesTable.jsx
@@ -32,6 +32,12 @@ const { RangePicker } = DatePicker;
* @constructor
*/
export function SamplesTable() {
+ const nameInputRef = React.useRef(null);
+ const organismInputRef = React.useRef(null);
+ const collectedByInputRef = React.useRef(null);
+ const createdInputRef = React.useRef(null);
+ const modifiedInputRef = React.useRef(null);
+
const dispatch = useDispatch();
const {
projectId,
@@ -115,106 +121,139 @@ export function SamplesTable() {
confirm({ closeDropdown: false });
};
+ function determineCurrentRef(filterName) {
+ return filterName === "t-organism-select"
+ ? organismInputRef
+ : filterName === "t-name-select"
+ ? nameInputRef
+ : filterName === "t-collectedBy-select"
+ ? collectedByInputRef
+ : filterName === "t-created-filter"
+ ? createdInputRef
+ : filterName === "t-modified-filter"
+ ? modifiedInputRef
+ : null;
+ }
const getColumnSearchProps = (
dataIndex,
filterName = "",
placeholder = ""
- ) => ({
- filterDropdown: ({
- setSelectedKeys,
- selectedKeys,
- confirm,
- clearFilters,
- }) => (
-
-
- ),
- filterIcon: (filtered) => (
-
- ),
- });
-
- const getDateColumnSearchProps = (filterName) => ({
- filterDropdown: ({
- setSelectedKeys,
- selectedKeys,
- confirm,
- clearFilters,
- }) => (
-
-
-
{
+ const currentRef = determineCurrentRef(filterName);
+ return {
+ onFilterDropdownVisibleChange: (visible) => {
+ if (visible) {
+ setTimeout(() => currentRef.current?.focus(), 100);
+ }
+ },
+ filterDropdown: ({
+ setSelectedKeys,
+ selectedKeys,
+ confirm,
+ clearFilters,
+ }) => (
+
+
-
-
-
-
-
- ),
- filterIcon: (filtered) => (
-
- ),
- });
+ ),
+ filterIcon: (filtered) => (
+
+ ),
+ };
+ };
+
+ const getDateColumnSearchProps = (filterName) => {
+ const currentRef = determineCurrentRef(filterName);
+ return {
+ onFilterDropdownVisibleChange: (visible) => {
+ if (visible) {
+ setTimeout(() => currentRef.current?.focus(), 100);
+ }
+ },
+ filterDropdown: ({
+ setSelectedKeys,
+ selectedKeys,
+ confirm,
+ clearFilters,
+ }) => (
+
+
+ {
+ if (dates !== null) {
+ setSelectedKeys([
+ [dates[0].startOf("day"), dates[1].endOf("day")],
+ ]);
+ confirm({ closeDropdown: false });
+ } else {
+ handleClearSearch(clearFilters, confirm);
+ }
+ }}
+ />
+
+
+
+
+
+
+ ),
+ filterIcon: (filtered) => (
+
+ ),
+ };
+ };
const columns = [
{
@@ -298,7 +337,10 @@ export function SamplesTable() {
title: i18n("SamplesTable.Column.collectedBy"),
dataIndex: ["sample", "collectedBy"],
sorter: true,
- ...getColumnSearchProps(["sample", "collectedBy"]),
+ ...getColumnSearchProps(
+ ["sample", "collectedBy"],
+ "t-collectedBy-select"
+ ),
},
{
title: i18n("SamplesTable.Column.created"),