Skip to content

Commit

Permalink
Merge pull request #1430 from openedx/eahmadjaved/ENT-10020
Browse files Browse the repository at this point in the history
feat: update the groups dropdown filters data source to enterprise gr…
  • Loading branch information
jajjibhai008 authored and brobro10000 committed Mar 4, 2025
2 parents 97f1445 + 54e9d02 commit a89e259
Show file tree
Hide file tree
Showing 32 changed files with 405 additions and 158 deletions.
6 changes: 3 additions & 3 deletions src/components/Admin/AdminSearchForm.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -122,10 +122,10 @@ class AdminSearchForm extends React.Component {
</option>
{groups.map(group => (
<option
value={group.enterprise_group_uuid}
key={group.enterprise_group_uuid}
value={group.uuid}
key={group.uuid}
>
{group.enterprise_group_name}
{group.name}
</option>
))}
</Form.Control>
Expand Down
84 changes: 14 additions & 70 deletions src/components/Admin/__snapshots__/Admin.test.jsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -1686,11 +1686,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders # cou
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -3348,11 +3344,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders # of
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -5010,11 +5002,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders # of
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -6672,11 +6660,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders colla
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -8334,11 +8318,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders full
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -9996,11 +9976,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders inact
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -11658,11 +11634,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders inact
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -13320,11 +13292,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders learn
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -14982,11 +14950,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders regis
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -16644,11 +16608,7 @@ exports[`<Admin /> renders correctly with dashboard analytics data renders top a
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -18355,11 +18315,7 @@ exports[`<Admin /> renders correctly with dashboard insights data renders dashbo
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -20017,11 +19973,7 @@ exports[`<Admin /> renders correctly with enterprise budgets data renders budget
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -21679,11 +21631,7 @@ exports[`<Admin /> renders correctly with enterprise groups data renders groups
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down Expand Up @@ -25153,11 +25101,7 @@ exports[`<Admin /> renders correctly with no dashboard insights data 1`] = `
>
All Groups
</option>
<option
value="7d6503dd-e40d-42b8-442b-37dd4c5450e3"
>
Test Group
</option>
<option />
</select>
</div>
</div>
Expand Down
39 changes: 19 additions & 20 deletions src/components/Admin/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ import AIAnalyticsSummary from './AIAnalyticsSummary';
import AIAnalyticsSummarySkeleton from './AIAnalyticsSummarySkeleton';
import BudgetExpiryAlertAndModal from '../BudgetExpiryAlertAndModal';
import ModuleActivityReport from './tabs/ModuleActivityReport';
import EnrollmentsTablePOC from '../EnrollmentsTable/EnrollmentsTable';

class Admin extends React.Component {
constructor() {
Expand Down Expand Up @@ -246,6 +247,7 @@ class Admin extends React.Component {

getTableData(id = 'enrollments') {
const { table } = this.props;
console.log(table, 'tabke');
const tableData = table && table[id];
return tableData && tableData.data;
}
Expand Down Expand Up @@ -531,28 +533,25 @@ class Admin extends React.Component {
>
<div className="row">
<div className="col">
{!error && !loading && !this.hasEmptyData() && (
<>
<div className="row pb-3 mt-2">
<div className="col-12 col-md-12 col-xl-12">
{this.renderDownloadButton()}
</div>
</div>
{this.displaySearchBar() && (
<AdminSearchForm
searchParams={searchParams}
searchEnrollmentsList={() => this.props.searchEnrollmentsList()}
tableData={this.getTableData() ? this.getTableData().results : []}
budgets={budgets}
groups={groups}
enterpriseId={enterpriseId}
/>
)}
</>
)}
{/* {!error && !loading && !this.hasEmptyData() && ( */}
<div className="row pb-3 mt-2">
<div className="col-12 col-md-12 col-xl-12">
{this.renderDownloadButton()}
</div>
</div>
<AdminSearchForm
searchParams={searchParams}
searchEnrollmentsList={() => this.props.searchEnrollmentsList()}
tableData={this.getTableData() ? this.getTableData().results : []}
budgets={budgets}
groups={groups}
enterpriseId={enterpriseId}
/>
{/* )} */}
{csvErrorMessage && this.renderCsvErrorMessage(csvErrorMessage)}
<div className="mt-3 mb-5">
{enterpriseId && tableMetadata.component}
<EnrollmentsTablePOC />
{/* {enterpriseId && tableMetadata.component} */}
</div>
</div>
</div>
Expand Down
107 changes: 107 additions & 0 deletions src/components/Datatable/hooks/useDatatable.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
import { useMemo, useState } from 'react';

const DEFAULT_PAGE_SIZE = 10;
const DEFAULT_PAGE_INDEX = 0;

const doFancyStuffLikeTrackAndUrlsWithoutFetchData = async (arggs) => {
try {
const resolvedData = await arggs.fetchData(arggs);
// Send track events
return resolvedData;
} catch (error) {
console.log(error, 'error');
}
};

const useDatatable = (args) => {
const [data, setData] = useState([]);
const datatableProps = useMemo(() => ({
initialState: {} || args.initialState,
columns: [] || args.columns,
fetchData: null || args.fetchData,
data: [] || args.data,
isPaginated: false || args.isPaginated,
manualPagination: false || args.manualPagination,
isSortable: false || args.isSortable,
manualSortBy: false || args.manualSortBy,
isFilterable: false || args.isFilterable,
manualFilters: false || args.manualFilters,
}), [args]);
const initialState = {
pageSize: null,
pageIndex: null,
filters: null,
sortBy: null,
};
// if (args.data && !args.fetchData) {
// const fetchDataInfo = (argss) => {
// console.log(argss, 'invisible fetchData');
// // Track events
// // Update URL query parameters
// return argss;
// };
// datatableProps.fetchData = fetchDataInfo;
// datatableProps.data = args.data;
// }

// Initial State
datatableProps.initialState = args.initialState;
// columns
datatableProps.columns = args.columns || [];

// manual pagination
if (args.manualPagination) {
datatableProps.manualPagination = true;
datatableProps.isPaginated = true;
datatableProps.initialState.pageSize = args.initialState.pageSize || DEFAULT_PAGE_SIZE;
datatableProps.initialState.pageIndex = args.initialState.pageSize || DEFAULT_PAGE_INDEX;
}

// manual sort
if (args.manualSortBy) {
datatableProps.manualSortBy = true;
datatableProps.isSortable = true;
}

// manual filters
if (args.manualFilters) {
datatableProps.manualFilters = true;
datatableProps.isFilterable = true;
}

// Datatable data and fetch data
if (args.fetchData) {
datatableProps.fetchData = async (arggs) => {
try {
const results = await doFancyStuffLikeTrackAndUrlsWithoutFetchData({ ...arggs, fetchData: args.fetchData });
if (results) {
if (data.length === 0) {
setData({ ...results, datasetArgs: arggs });
}
return results;
}
return [];
} catch (error) {
console.log(error, 'error');
}
return [];
};
// Data attribute
datatableProps.data = data[args.dataAccessor] || data || [];

// item and page count
if (data.count) {
datatableProps.itemCount = data.count;
}
if (data.numPages) {
datatableProps.pageCount = data.numPages;
} else if (datatableProps.itemCount) {
datatableProps.pageCount = Math.ceil(datatableProps.itemCount / datatableProps.data.length);
}
}

console.log(datatableProps, 'datatableProps');
return useMemo(() => datatableProps, [datatableProps]);
};

export default useDatatable;
Loading

0 comments on commit a89e259

Please sign in to comment.