Futa Arai 2 лет назад
Родитель
Сommit
5037481bc7

+ 1 - 1
apps/app/src/components/PageAlert/FixPageGrantAlert.tsx

@@ -258,7 +258,7 @@ export const FixPageGrantAlert = (): JSX.Element => {
   if (!hasParent) {
   if (!hasParent) {
     return <></>;
     return <></>;
   }
   }
-  if (dataIsGrantNormalized?.isGrantNormalized == null || !dataIsGrantNormalized.isGrantNormalized) {
+  if (dataIsGrantNormalized?.isGrantNormalized == null || dataIsGrantNormalized.isGrantNormalized) {
     return <></>;
     return <></>;
   }
   }
 
 

+ 45 - 0
apps/app/src/components/PageAlert/GroupSelectModal.tsx

@@ -0,0 +1,45 @@
+import { useState } from 'react';
+
+import { GroupType } from '@growi/core';
+import { useTranslation } from 'react-i18next';
+import { Modal, ModalBody, ModalHeader } from 'reactstrap';
+
+export const GroupSelectModal = (): JSX.Element => {
+  const { t } = useTranslation();
+  const [isSelectGroupModalShown, setIsSelectGroupModalShown] = useState(false);
+
+  return (
+    <Modal
+      className="select-grant-group"
+      isOpen={isSelectGroupModalShown}
+      toggle={() => setIsSelectGroupModalShown(false)}
+    >
+      <ModalHeader tag="h4" toggle={() => setIsSelectGroupModalShown(false)} className="bg-purple text-light">
+        {t('user_group.select_group')}
+      </ModalHeader>
+      <ModalBody>
+        <>
+          { myUserGroups.map((group) => {
+            const groupIsGranted = grantedGroups?.find(g => g.id === group.item._id) != null;
+            const activeClass = groupIsGranted ? 'active' : '';
+
+            return (
+              <button
+                className={`btn btn-outline-primary w-100 d-flex justify-content-start mb-3 align-items-center p-3 ${activeClass}`}
+                type="button"
+                key={group.item._id}
+                onClick={() => groupListItemClickHandler(group)}
+              >
+                <span className="align-middle"><input type="checkbox" checked={groupIsGranted} /></span>
+                <h5 className="d-inline-block ml-3">{group.item.name}</h5>
+                {group.type === GroupType.externalUserGroup && <span className="ml-2 badge badge-pill badge-info">{group.item.provider}</span>}
+                {/* TODO: Replace <div className="small">(TBD) List group members</div> */}
+              </button>
+            );
+          }) }
+          <button type="button" className="btn btn-primary mt-2 float-right" onClick={() => setIsSelectGroupModalShown(false)}>{t('Done')}</button>
+        </>
+      </ModalBody>
+    </Modal>
+  );
+};