diff --git a/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButton.jsx b/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButton.jsx
new file mode 100644
index 00000000..bacd674b
--- /dev/null
+++ b/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButton.jsx
@@ -0,0 +1,88 @@
+import React from "react";
+import { Button, Confirm } from "semantic-ui-react";
+import { RequestModal, CreateRequestModalContent } from ".";
+import {
+ DirectCreateAndSubmit,
+ ConfirmModalContextProvider,
+} from "@js/oarepo_requests_common";
+import PropTypes from "prop-types";
+
+export const CreateRequestButton = ({
+ requestType,
+ isMutating,
+ buttonIconProps,
+ header,
+}) => {
+ const { dangerous, has_form: hasForm } = requestType;
+ const needsDialog = dangerous || hasForm;
+
+ if (!hasForm && dangerous) {
+ return (
+
+ {({ confirmDialogProps }) => (
+ <>
+
+
+ >
+ )}
+
+ );
+ }
+
+ if (!hasForm && !dangerous) {
+ return (
+
+ {({ confirmDialogProps }) => (
+ <>
+
+
+ >
+ )}
+
+ );
+ }
+
+ if (needsDialog) {
+ return (
+ 0}
+ {...buttonIconProps}
+ />
+ }
+ ContentComponent={CreateRequestModalContent}
+ />
+ );
+ }
+
+ return null;
+};
+
+CreateRequestButton.propTypes = {
+ requestType: PropTypes.object,
+ isMutating: PropTypes.number.isRequired,
+ buttonIconProps: PropTypes.object,
+ header: PropTypes.string.isRequired,
+};
diff --git a/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButtonGroup.jsx b/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButtonGroup.jsx
index a584d0a5..25f67c52 100644
--- a/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButtonGroup.jsx
+++ b/oarepo_requests/ui/theme/assets/semantic-ui/js/oarepo_requests_ui/record-requests/components/CreateRequestButtonGroup.jsx
@@ -1,15 +1,11 @@
import React from "react";
import { i18next } from "@translations/oarepo_requests_ui/i18next";
-import { Button, Placeholder, Message, Confirm } from "semantic-ui-react";
+import { Placeholder, Message } from "semantic-ui-react";
import _isEmpty from "lodash/isEmpty";
-import { RequestModal, CreateRequestModalContent } from ".";
-import {
- useRequestContext,
- DirectCreateAndSubmit,
- ConfirmModalContextProvider,
-} from "@js/oarepo_requests_common";
+import { useRequestContext } from "@js/oarepo_requests_common";
import PropTypes from "prop-types";
import { useIsMutating } from "@tanstack/react-query";
+import { CreateRequestButton } from "./CreateRequestButton";
/**
* @param {{ applicableRequestsLoading: boolean, applicableRequestsLoadingError: Error }} props
@@ -49,82 +45,19 @@ export const CreateRequestButtonGroup = ({
return null; // No need to render anything if there are no requests
} else {
content = createRequests.map((requestType) => {
- const { dangerous, has_form: hasForm } = requestType;
- const needsDialog = dangerous || hasForm;
const header =
requestType.stateful_name || requestType.name || requestType.type_id;
const buttonIconProps = requestButtonsIconsConfig[requestType.type_id];
- if (!hasForm && dangerous) {
- return (
-
- {({ confirmDialogProps }) => (
- <>
-
-
- >
- )}
-
- );
- }
-
- if (!hasForm && !dangerous) {
- return (
-
- {({ confirmDialogProps }) => (
- <>
-
-
- >
- )}
-
- );
- }
-
- if (needsDialog) {
- return (
- 0}
- {...buttonIconProps}
- />
- }
- ContentComponent={CreateRequestModalContent}
- />
- );
- }
-
- return null;
+ return (
+
+ );
});
}