allow users to set their stream link

[alttp.git] / resources / js / components / users / EditStreamLinkButton.js

diff --git a/resources/js/components/users/EditStreamLinkButton.js b/resources/js/components/users/EditStreamLinkButton.js
new file mode 100644 (file)
index 0000000..a1c8c24
--- /dev/null
+++ b/resources/js/components/users/EditStreamLinkButton.js
@@ -0,0 +1,41 @@
+import PropTypes from 'prop-types';
+import React, { useState } from 'react';
+import { Button } from 'react-bootstrap';
+import { withTranslation } from 'react-i18next';
+
+import EditStreamLinkDialog from './EditStreamLinkDialog';
+import Icon from '../common/Icon';
+import { mayEditStreamLink } from '../../helpers/permissions';
+import { withUser } from '../../helpers/UserContext';
+import i18n from '../../i18n';
+
+const EditStreamLinkButton = ({ authUser, user }) => {
+       const [showDialog, setShowDialog] = useState(false);
+
+       if (mayEditStreamLink(authUser, user)) {
+               return <>
+                       <EditStreamLinkDialog
+                               onHide={() => setShowDialog(false)}
+                               show={showDialog}
+                               user={user}
+                       />
+                       <Button
+                               onClick={() => setShowDialog(true)}
+                               title={i18n.t('button.edit')}
+                               variant="outline-secondary"
+                       >
+                               <Icon.EDIT title="" />
+                       </Button>
+               </>;
+       }
+       return null;
+};
+
+EditStreamLinkButton.propTypes = {
+       authUser: PropTypes.shape({
+       }),
+       user: PropTypes.shape({
+       }),
+};
+
+export default withTranslation()(withUser(EditStreamLinkButton, 'authUser'));