From b830031de3d932b0526ad9a17fd66ae22f7103b8 Mon Sep 17 00:00:00 2001
From: Shelby Holden <sholden@broadinstitute.org>
Date: Thu, 21 Dec 2023 12:15:30 -0500
Subject: [PATCH] Add data access control group test

---
 .../snapshot/DataAccessControlGroup.test.tsx  | 47 +++++++++++++++++++
 .../snapshot/DataAccessControlGroup.tsx       |  6 +--
 2 files changed, 49 insertions(+), 4 deletions(-)
 create mode 100644 src/components/snapshot/DataAccessControlGroup.test.tsx

diff --git a/src/components/snapshot/DataAccessControlGroup.test.tsx b/src/components/snapshot/DataAccessControlGroup.test.tsx
new file mode 100644
index 000000000..db1ac84c2
--- /dev/null
+++ b/src/components/snapshot/DataAccessControlGroup.test.tsx
@@ -0,0 +1,47 @@
+import { mount } from 'cypress/react';
+import { Router } from 'react-router-dom';
+import { ThemeProvider } from '@mui/styles';
+import { Provider } from 'react-redux';
+import React from 'react';
+import createMockStore from 'redux-mock-store';
+import history from '../../modules/hist';
+import globalTheme from '../../modules/theme';
+import SnapshotAccess from './SnapshotAccess';
+import DataAccessControlGroup from './DataAccessControlGroup';
+
+const snapshot = {
+  id: 'uuid',
+};
+
+const initialState = {
+  snapshots: {
+    snapshot,
+    snapshotAuthDomains: ['authdomain1', 'authdomain2', 'authdomain3'],
+  },
+};
+
+describe('DataAccessControlGroup', () => {
+  beforeEach(() => {
+    const mockStore = createMockStore([]);
+    const store = mockStore(initialState);
+    mount(
+      <Router history={history}>
+        <Provider store={store}>
+          <ThemeProvider theme={globalTheme}>
+            <DataAccessControlGroup />
+          </ThemeProvider>
+        </Provider>
+      </Router>,
+    );
+  });
+  it('Displays snapshot policies and emails', () => {
+    cy.get('[data-cy="data-access-control-container"]').should('contain.text', 'Data Access Control Groups');
+    cy.get('[data-cy="data-access-controls"]')
+      .should('contain.text', 'Data Access Controls')
+      .within(() => {
+        cy.get('[data-cy="user-email"]').then((user) => {
+          cy.wrap(user[0]).should('contain.text', 'authdomain1');
+        });
+      });
+  });
+});
diff --git a/src/components/snapshot/DataAccessControlGroup.tsx b/src/components/snapshot/DataAccessControlGroup.tsx
index 7df0d4ed5..b744d58c3 100644
--- a/src/components/snapshot/DataAccessControlGroup.tsx
+++ b/src/components/snapshot/DataAccessControlGroup.tsx
@@ -1,12 +1,10 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import _ from 'lodash';
-import { withStyles } from '@mui/styles';
 import { Typography, Grid } from '@mui/material';
 import { TdrState } from '../../reducers';
 import UserList from '../UserList';
 
-const styles = () => ({});
 
 type DataAccessControlGroupProps = {
   authDomains: Array<string>;
@@ -15,7 +13,7 @@ type DataAccessControlGroupProps = {
 function DataAccessControlGroup(props: DataAccessControlGroupProps) {
   const { authDomains } = props;
   return (
-    <Grid container spacing={1}>
+    <Grid container spacing={1} data-cy="data-access-control-container">
       <Typography variant="h6">Data Access Control Groups</Typography>
       <Grid item xs={12} data-cy="data-access-controls">
         <UserList
@@ -34,4 +32,4 @@ function mapStateToProps(state: TdrState) {
   };
 }
 
-export default connect(mapStateToProps)(withStyles(styles)(DataAccessControlGroup));
+export default connect(mapStateToProps)(DataAccessControlGroup);