Cleaned up code, added new test

ucfopen · Oct 12, 2021 · 048816c · 048816c
1 parent 9ff226d
commit 048816c
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 36 deletions.
diff --git a/packages/app/obojobo-repository/shared/components/module-permissions-dialog.jsx b/packages/app/obojobo-repository/shared/components/module-permissions-dialog.jsx
@@ -44,40 +44,30 @@ class ModulePermissionsDialog extends React.Component {
 
 	renderModal() {
 		if (this.state.peoplePickerOpen) {
-			if (this.props.draftPermissions[this.props.draftId] != null) {
-				return (
-					<ReactModal
-						isOpen={true}
-						contentLabel="Module Access"
-						className="repository--modal"
-						overlayClassName="repository--modal-overlay"
-						onRequestClose={this.closePeoplePicker}
-					>
-						<PeopleSearchDialog
-							onClose={this.closePeoplePicker}
-							onSelectPerson={this.addPerson}
-							currentUserId={this.props.currentUserId}
-							draftPermissions={this.props.draftPermissions[this.props.draftId].items}
-						/>
-					</ReactModal>
-				)
-			} else {
-				return (
-					<ReactModal
-						isOpen={true}
-						contentLabel="Module Access"
-						className="repository--modal"
-						overlayClassName="repository--modal-overlay"
-						onRequestClose={this.closePeoplePicker}
-					>
-						<PeopleSearchDialog
-							onClose={this.closePeoplePicker}
-							onSelectPerson={this.addPerson}
-							currentUserId={this.props.currentUserId}
-						/>
-					</ReactModal>
-				)
+			let draftPermissions = null
+
+			if (
+				this.props.draftPermissions[this.props.draftId] !== null &&
+				this.props.draftPermissions[this.props.draftId] !== undefined
+			) {
+				draftPermissions = this.props.draftPermissions[this.props.draftId].items
 			}
+			return (
+				<ReactModal
+					isOpen={true}
+					contentLabel="Module Access"
+					className="repository--modal"
+					overlayClassName="repository--modal-overlay"
+					onRequestClose={this.closePeoplePicker}
+				>
+					<PeopleSearchDialog
+						onClose={this.closePeoplePicker}
+						onSelectPerson={this.addPerson}
+						currentUserId={this.props.currentUserId}
+						draftPermissions={draftPermissions}
+					/>
+				</ReactModal>
+			)
 		}
 		return null
 	}

diff --git a/packages/app/obojobo-repository/shared/components/module-permissions-dialog.test.js b/packages/app/obojobo-repository/shared/components/module-permissions-dialog.test.js
@@ -26,7 +26,7 @@ describe('ModulePermissionsDialog', () => {
 			draftId: 'mockDraftId',
 			title: 'Mock Module Title',
 			currentUserId: 99,
-			draftPermissions: { items: [{ id: 99 }] },
+			draftPermissions: {},
 			loadUsersForModule: jest.fn(),
 			addUserToModule: jest.fn(),
 			deleteModulePermissions: jest.fn(),
@@ -49,6 +49,10 @@ describe('ModulePermissionsDialog', () => {
 		expect(component.root.findAllByType(PeopleSearchDialog).length).toBe(isRendered ? 1 : 0)
 	}
 
+	const expectModulePermissionsModalToBeRendered = (component, isRendered) => {
+		expect(component.root.findAllByType(ReactModal).length).toBe(isRendered ? 1 : 0)
+	}
+
 	test('renders with "null" draftPermissions', () => {
 		let component
 		act(() => {
@@ -112,6 +116,26 @@ describe('ModulePermissionsDialog', () => {
 		expectPeopleSearchModalToBeRendered(component, true)
 	})
 
+	test('clicking the "Add People" button opens the search dialog and passes it draftPermissions', () => {
+		defaultProps.draftPermissions['mockDraftId'] = {
+			items: [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 99 }]
+		}
+		const reusableComponent = <ModulePermissionsDialog {...defaultProps} />
+		let component
+		act(() => {
+			component = create(reusableComponent)
+		})
+
+		expectModulePermissionsModalToBeRendered(component, false)
+
+		act(() => {
+			component.root.findByProps({ id: 'modulePermissionsDialog-addPeopleButton' }).props.onClick()
+			component.update(reusableComponent)
+		})
+
+		expectModulePermissionsModalToBeRendered(component, true)
+	})
+
 	test('modal closes the people search modal when callback is called', () => {
 		const reusableComponent = <ModulePermissionsDialog {...defaultProps} />
 		let component

diff --git a/packages/app/obojobo-repository/shared/components/people-search-dialog.jsx b/packages/app/obojobo-repository/shared/components/people-search-dialog.jsx
@@ -18,6 +18,24 @@ const PeopleSearchDialog = props => {
 		props.onClose()
 	}
 
+	const renderListItem = p => (
+		<PeopleListItem key={p.id} isMe={p.id === props.currentUserId} {...p}>
+			<Button className="select-button" onClick={() => onSelectPerson(p)}>
+				Select
+			</Button>
+		</PeopleListItem>
+	)
+
+	const renderValidListItems = p => {
+		if (props.draftPermissions) {
+			if (props.draftPermissions.every(d => d.id !== p.id)) {
+				return renderListItem(p)
+			}
+		} else {
+			return renderListItem(p)
+		}
+	}
+
 	return (
 		<div className="people-search-dialog">
 			<div className="wrapper">
@@ -35,7 +53,7 @@ const PeopleSearchDialog = props => {
 			</div>
 			<div className="access-list-wrapper">
 				<ul className="access-list">
-					{props.people.map(function(p) {
+					{/* {props.people.map(function(p) {
 						if (props.draftPermissions) {
 							if (props.draftPermissions.every(d => d.id !== p.id)) {
 								return (
@@ -55,7 +73,8 @@ const PeopleSearchDialog = props => {
 								</PeopleListItem>
 							)
 						}
-					})}
+					})} */}
+					{props.people.map(renderValidListItems)}
 				</ul>
 			</div>
 		</div>