Use built-in Table rowSelection

This commit is contained in:
CPTProgrammer 2026-07-16 20:43:00 +08:00
parent 9d63c2028f
commit ea657c78b5
No known key found for this signature in database

View File

@ -1,12 +1,11 @@
"use client"; "use client";
import { useState, useCallback, useMemo, useEffect } from "react"; import { useState, useCallback, useMemo, useEffect, useRef } from "react";
import { import {
Modal, Modal,
Steps, Steps,
Button, Button,
Space, Space,
Checkbox,
Table, Table,
Select, Select,
Row, Row,
@ -95,9 +94,8 @@ export function PublishModal({
const [currentStep, setCurrentStep] = useState(0); const [currentStep, setCurrentStep] = useState(0);
// Version selection // Version selection
const [selectedVersions, setSelectedVersions] = useState<Set<string>>( const [selectedModrinth, setSelectedModrinth] = useState<string[]>([]);
new Set(), const [selectedCurseforge, setSelectedCurseforge] = useState<string[]>([]);
);
// Publish settings // Publish settings
const [changelog, setChangelog] = useState(""); const [changelog, setChangelog] = useState("");
@ -202,21 +200,30 @@ export function PublishModal({
[project, versionTmpl, versionNameTmpl, mrExplicitMap, cfExplicitMap, existingModrinth, existingCurseforge], [project, versionTmpl, versionNameTmpl, mrExplicitMap, cfExplicitMap, existingModrinth, existingCurseforge],
); );
// Auto-select all non-existing versions when data first loads
const initRef = useRef(false);
useEffect(() => {
if (open) {
initRef.current = false;
}
}, [open]);
useEffect(() => {
if (!loadingExisting && publishVersions.length > 0 && !initRef.current) {
initRef.current = true;
setSelectedModrinth(
publishVersions.filter((v) => !v.existsModrinth).map((v) => v.key),
);
setSelectedCurseforge(
publishVersions.filter((v) => !v.existsCurseforge).map((v) => v.key),
);
}
}, [loadingExisting, publishVersions]);
// --------------- Steps handling --------------- // --------------- Steps handling ---------------
const handleNext = useCallback(() => { const handleNext = useCallback(() => {
if (currentStep === 0) {
// Init selection with all non-existing entries
const preselected = new Set<string>();
for (const v of publishVersions) {
if (!v.existsModrinth || !v.existsCurseforge) {
preselected.add(v.key);
}
}
setSelectedVersions(preselected);
}
setCurrentStep((prev) => Math.min(prev + 1, 2)); setCurrentStep((prev) => Math.min(prev + 1, 2));
}, [currentStep, publishVersions]); }, []);
const handlePrev = useCallback(() => { const handlePrev = useCallback(() => {
setCurrentStep((prev) => Math.max(prev - 1, 0)); setCurrentStep((prev) => Math.max(prev - 1, 0));
@ -236,7 +243,8 @@ export function PublishModal({
const handleClose = useCallback(() => { const handleClose = useCallback(() => {
if (publishing) return; if (publishing) return;
setCurrentStep(0); setCurrentStep(0);
setSelectedVersions(new Set()); setSelectedModrinth([]);
setSelectedCurseforge([]);
setChangelog(""); setChangelog("");
setVersionType("release"); setVersionType("release");
setPublishResult(null); setPublishResult(null);
@ -265,25 +273,6 @@ export function PublishModal({
dataIndex: "modrinthVersionName", dataIndex: "modrinthVersionName",
key: "modrinthVersionName", key: "modrinthVersionName",
}, },
{
title: "",
key: "select",
width: 50,
render: (_: unknown, record: PublishVersion) => (
<Checkbox
disabled={record.existsModrinth}
checked={
record.existsModrinth || selectedVersions.has(record.key)
}
onChange={(e) => {
const next = new Set(selectedVersions);
if (e.target.checked) next.add(record.key);
else next.delete(record.key);
setSelectedVersions(next);
}}
/>
),
},
]; ];
const curseforgeColumns = [ const curseforgeColumns = [
@ -306,25 +295,6 @@ export function PublishModal({
key: "artifact", key: "artifact",
ellipsis: true, ellipsis: true,
}, },
{
title: "",
key: "select",
width: 50,
render: (_: unknown, record: PublishVersion) => (
<Checkbox
disabled={record.existsCurseforge}
checked={
record.existsCurseforge || selectedVersions.has(record.key)
}
onChange={(e) => {
const next = new Set(selectedVersions);
if (e.target.checked) next.add(record.key);
else next.delete(record.key);
setSelectedVersions(next);
}}
/>
),
},
]; ];
return ( return (
@ -360,6 +330,13 @@ export function PublishModal({
<Table <Table
dataSource={publishVersions} dataSource={publishVersions}
columns={modrinthColumns} columns={modrinthColumns}
rowSelection={{
selectedRowKeys: selectedModrinth,
onChange: (keys) => setSelectedModrinth(keys as string[]),
getCheckboxProps: (r: PublishVersion) => ({
disabled: r.existsModrinth,
}),
}}
pagination={false} pagination={false}
size="small" size="small"
bordered bordered
@ -376,6 +353,13 @@ export function PublishModal({
<Table <Table
dataSource={publishVersions} dataSource={publishVersions}
columns={curseforgeColumns} columns={curseforgeColumns}
rowSelection={{
selectedRowKeys: selectedCurseforge,
onChange: (keys) => setSelectedCurseforge(keys as string[]),
getCheckboxProps: (r: PublishVersion) => ({
disabled: r.existsCurseforge,
}),
}}
pagination={false} pagination={false}
size="small" size="small"
bordered bordered
@ -436,16 +420,8 @@ export function PublishModal({
// --------------- Render: Step 3 — Progress & Result --------------- // --------------- Render: Step 3 — Progress & Result ---------------
const renderStep3 = () => { const renderStep3 = () => {
const hasModrinth = publishVersions.some( const hasModrinth = selectedModrinth.length > 0;
(v) => const hasCurseforge = selectedCurseforge.length > 0;
!v.existsModrinth &&
(selectedVersions.has(v.key) || v.existsModrinth),
);
const hasCurseforge = publishVersions.some(
(v) =>
!v.existsCurseforge &&
(selectedVersions.has(v.key) || v.existsCurseforge),
);
return ( return (
<div> <div>