Skip to content

Allow users to specify a commit summary when mutating xDS resources #1332

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
minwoox merged 3 commits into from
Jul 14, 2026
Merged

Allow users to specify a commit summary when mutating xDS resources #1332

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
dd1d751
Allow users to specify a commit summary when mutating xDS resources
minwoox Jul 10, 2026
e84c305
AI comment
minwoox Jul 13, 2026
d2f4784
Merge branch 'main' into xds_commit_summary
minwoox Jul 14, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion webapp/src/dogma/common/components/DeleteConfirmationModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import {
ModalHeader,
ModalOverlay,
} from '@chakra-ui/react';
import { ReactNode } from 'react';

interface DeleteConfirmationModalProps {
isOpen: boolean;
Expand All @@ -38,6 +39,8 @@ interface DeleteConfirmationModalProps {
repoName?: string;
handleDelete: () => void;
isLoading: boolean;
// Optional extra content rendered below the confirmation text (e.g. a commit summary input).
children?: ReactNode;
}

export const DeleteConfirmationModal = ({
Expand All @@ -50,6 +53,7 @@ export const DeleteConfirmationModal = ({
repoName,
handleDelete,
isLoading,
children,
}: DeleteConfirmationModalProps): JSX.Element => {
const fromName = from ?? repoName ?? projectName;
return (
Expand All @@ -63,7 +67,7 @@ export const DeleteConfirmationModal = ({
<Mark bg="gray.200" rounded="base" fontWeight="bold" px="1" py="1">
{id}
</Mark>
{fromName ? ` from ${fromName}` : ''}?
{fromName ? ` from ${fromName}` : ''}?{children}
</ModalBody>
<ModalFooter>
<HStack spacing={3}>
Expand Down
55 changes: 50 additions & 5 deletions webapp/src/dogma/features/xds/K8sAggregatorEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -492,6 +492,7 @@ const NewK8sAggregatorEditor = ({ group }: { group: string }) => {
const [previewAggregator, { isLoading: isPreviewing }] = usePreviewK8sAggregatorMutation();
const { isOpen: previewOpen, onOpen: openPreview, onClose: closePreview } = useDisclosure();
const [previewResult, setPreviewResult] = useState<K8sPreviewResult | null>(null);
const [commitSummary, setCommitSummary] = useState('');
const {
register,
control,
Expand All @@ -515,7 +516,12 @@ const NewK8sAggregatorEditor = ({ group }: { group: string }) => {
return;
}
try {
await createAggregator({ group, aggregatorId: data.aggregatorId, body: buildBody(data) }).unwrap();
await createAggregator({
group,
aggregatorId: data.aggregatorId,
body: buildBody(data),
summary: commitSummary || undefined,
}).unwrap();
dispatch(
newNotification('Aggregator created', `Aggregator '${data.aggregatorId}' is created`, 'success'),
);
Expand Down Expand Up @@ -548,6 +554,14 @@ const NewK8sAggregatorEditor = ({ group }: { group: string }) => {
readOnly={false}
/>
<Divider my={4} maxW="3xl" />
<FormControl mb={4} maxW="md">
<FormLabel>Commit summary</FormLabel>
<Input
value={commitSummary}
onChange={(e) => setCommitSummary(e.target.value)}
placeholder="Create kubernetes endpoint: ..."
/>
</FormControl>
<Flex maxW="3xl">
<Spacer />
<HStack spacing={3}>
Expand Down Expand Up @@ -596,6 +610,8 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string
const [previewResult, setPreviewResult] = useState<K8sPreviewResult | null>(null);
// An aggregator opens in read-only view; the user must click Edit to modify it (like the resource editors).
const [editing, setEditing] = useState(false);
const [commitSummary, setCommitSummary] = useState('');
const [deleteCommitSummary, setDeleteCommitSummary] = useState('');
const {
register,
control,
Expand All @@ -615,9 +631,15 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string
const onSubmit = async (formData: FormData) => {
const name = `groups/${group}/k8s/endpointAggregators/${id}`;
try {
await updateAggregator({ group, id, body: buildBody(formData, name) }).unwrap();
await updateAggregator({
group,
id,
body: buildBody(formData, name),
summary: commitSummary || undefined,
}).unwrap();
dispatch(newNotification('Aggregator updated', `Aggregator '${id}' is updated`, 'success'));
setEditing(false);
setCommitSummary('');
} catch (err) {
dispatch(newNotification('Failed to update the aggregator', ErrorMessageParser.parse(err), 'error'));
}
Expand All @@ -628,6 +650,7 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string
reset(parseToFormData(id, (data as FileContentDto).content));
}
setEditing(false);
setCommitSummary('');
};

const onPreview = async (formData: FormData) => {
Expand All @@ -643,14 +666,19 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string

const handleDelete = async () => {
try {
await deleteAggregator({ group, id }).unwrap();
await deleteAggregator({ group, id, summary: deleteCommitSummary || undefined }).unwrap();
dispatch(newNotification('Aggregator deleted', `Aggregator '${id}' is deleted`, 'success'));
Router.push(`/app/xds/group?name=${encodeURIComponent(group)}&type=k8sAggregators`);
} catch (err) {
dispatch(newNotification('Failed to delete the aggregator', ErrorMessageParser.parse(err), 'error'));
}
};

const handleDeleteModalClose = () => {
setDeleteCommitSummary('');
onClose();
};

return (
<Deferred isLoading={isLoading} error={error}>
{() => (
Expand Down Expand Up @@ -706,6 +734,14 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string
{editing && hasWrite && (
<>
<Divider my={4} maxW="3xl" />
<FormControl mb={4} maxW="md">
<FormLabel>Commit summary</FormLabel>
<Input
value={commitSummary}
onChange={(e) => setCommitSummary(e.target.value)}
placeholder="Update kubernetes endpoint aggregator: ..."
/>
</FormControl>
<Flex maxW="3xl">
<Spacer />
<HStack spacing={3}>
Expand Down Expand Up @@ -738,13 +774,22 @@ const ExistingK8sAggregatorEditor = ({ group, id }: { group: string; id: string
/>
<DeleteConfirmationModal
isOpen={isOpen}
onClose={onClose}
onClose={handleDeleteModalClose}
type="aggregator"
id={id}
from={group}
handleDelete={handleDelete}
isLoading={isDeleting}
/>
>
<FormControl mt={4}>
<FormLabel>Commit summary</FormLabel>
<Input
value={deleteCommitSummary}
onChange={(e) => setDeleteCommitSummary(e.target.value)}
placeholder="Delete kubernetes endpoint aggregator: ..."
/>
</FormControl>
</DeleteConfirmationModal>
</Box>
)}
</Deferred>
Expand Down
69 changes: 53 additions & 16 deletions webapp/src/dogma/features/xds/ResourceEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,7 @@ const NewResourceEditor = ({ group, type }: { group: string; type: XdsResourceTy
const { hasWrite, isLoading: accessLoading } = useGroupWriteAccess(group);
const [id, setId] = useState('');
const [content, setContent] = useState(XDS_RESOURCE_TEMPLATES[type]);
const [commitSummary, setCommitSummary] = useState('');
const [createResource, { isLoading }] = useCreateResourceMutation();

const handleCreate = async () => {
Expand All @@ -93,7 +94,7 @@ const NewResourceEditor = ({ group, type }: { group: string; type: XdsResourceTy
return;
}
try {
await createResource({ group, type, id, body: content }).unwrap();
await createResource({ group, type, id, body: content, summary: commitSummary || undefined }).unwrap();
dispatch(newNotification(`${meta.label} created`, `${meta.label} '${id}' is created`, 'success'));
Router.push(`/app/xds/group?name=${encodeURIComponent(group)}&type=${type}`);
} catch (err) {
Expand All @@ -120,6 +121,14 @@ const NewResourceEditor = ({ group, type }: { group: string; type: XdsResourceTy
<Input value={id} onChange={(e) => setId(e.target.value)} placeholder={`Enter ${meta.label} ID ...`} />
</FormControl>
<JsonEditor value={content} onChange={setContent} />
<FormControl mt={4} maxW="md">
<FormLabel>Commit summary</FormLabel>
<Input
value={commitSummary}
onChange={(e) => setCommitSummary(e.target.value)}
placeholder={`Create ${meta.label.toLowerCase()}: ...`}
/>
</FormControl>
<Flex mt={4}>
<Spacer />
<Button colorScheme="teal" leftIcon={<FiSave />} onClick={handleCreate} isLoading={isLoading}>
Expand Down Expand Up @@ -192,6 +201,8 @@ const ExistingResourceEditor = ({
const [content, setContent] = useState('');
// A resource opens in read-only view; the user must click Edit to modify it (like the main web app).
const [editing, setEditing] = useState(false);
const [commitSummary, setCommitSummary] = useState('');
const [deleteCommitSummary, setDeleteCommitSummary] = useState('');
const [updateResource, { isLoading: isSaving }] = useUpdateResourceMutation();
const [deleteResource, { isLoading: isDeleting }] = useDeleteResourceMutation();
const { isOpen, onOpen, onClose } = useDisclosure();
Expand All @@ -217,9 +228,10 @@ const ExistingResourceEditor = ({
return;
}
try {
await updateResource({ group, type, id, body: content }).unwrap();
await updateResource({ group, type, id, body: content, summary: commitSummary || undefined }).unwrap();
dispatch(newNotification(`${meta.label} updated`, `${meta.label} '${id}' is updated`, 'success'));
setEditing(false);
setCommitSummary('');
} catch (err) {
dispatch(newNotification(`Failed to update the ${meta.label}`, ErrorMessageParser.parse(err), 'error'));
}
Expand All @@ -228,18 +240,24 @@ const ExistingResourceEditor = ({
const handleCancel = () => {
setContent(originalContent);
setEditing(false);
setCommitSummary('');
};

const handleDelete = async () => {
try {
await deleteResource({ group, type, id }).unwrap();
await deleteResource({ group, type, id, summary: deleteCommitSummary || undefined }).unwrap();
dispatch(newNotification(`${meta.label} deleted`, `${meta.label} '${id}' is deleted`, 'success'));
Router.push(`/app/xds/group?name=${encodeURIComponent(group)}&type=${type}`);
} catch (err) {
dispatch(newNotification(`Failed to delete the ${meta.label}`, ErrorMessageParser.parse(err), 'error'));
}
};

const handleDeleteModalClose = () => {
setDeleteCommitSummary('');
onClose();
};

// Resources generated by a k8s aggregator are managed by the aggregator, so they are always read-only
// (no edit/save/delete). Otherwise the editor is read-only until the user clicks Edit.
const readOnly = k8s || !editing;
Expand Down Expand Up @@ -317,17 +335,27 @@ const ExistingResourceEditor = ({
readOnly={readOnly}
/>
{editing && hasWrite && (
<Flex mt={4}>
<Spacer />
<Button
colorScheme="teal"
leftIcon={<FiSave />}
onClick={handleSave}
isLoading={isSaving}
>
Save
</Button>
</Flex>
<>
<FormControl mt={4} maxW="md">
<FormLabel>Commit summary</FormLabel>
<Input
value={commitSummary}
onChange={(e) => setCommitSummary(e.target.value)}
placeholder={`Update ${meta.label.toLowerCase()}: ...`}
/>
</FormControl>
<Flex mt={4}>
<Spacer />
<Button
colorScheme="teal"
leftIcon={<FiSave />}
onClick={handleSave}
isLoading={isSaving}
>
Save
</Button>
</Flex>
</>
)}
</TabPanel>
<TabPanel px={0}>
Expand All @@ -338,13 +366,22 @@ const ExistingResourceEditor = ({
</Tabs>
<DeleteConfirmationModal
isOpen={isOpen}
onClose={onClose}
onClose={handleDeleteModalClose}
type={meta.label}
id={id}
from={group}
handleDelete={handleDelete}
isLoading={isDeleting}
/>
>
<FormControl mt={4}>
<FormLabel>Commit summary</FormLabel>
<Input
value={deleteCommitSummary}
onChange={(e) => setDeleteCommitSummary(e.target.value)}
placeholder={`Delete ${meta.label.toLowerCase()}: ...`}
/>
</FormControl>
</DeleteConfirmationModal>
</Box>
)
}
Expand Down
Loading
Loading