@openedx/frontend-app-instructor-dashboard 1.0.0-alpha.1 → 1.0.0-alpha.11

package/dist/Main.js

@@ -1,19 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { lazy, Suspense } from 'react';
-import { CurrentAppProvider, getAppConfig } from '@openedx/frontend-base';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CurrentAppProvider } from '@openedx/frontend-base';
 import { Outlet } from 'react-router-dom';
 import { AlertProvider } from './providers/AlertProvider';
 import { appId } from './constants';
 import PageWrapper from './pageWrapper/PageWrapper';
 import './app.scss';
-// Use a dynamic import guarded by process.env.NODE_ENV so the consumer's
-// webpack dead-code-eliminates this in production builds, meaning
-// @tanstack/react-query-devtools does not need to be installed by consumers.
-const ReactQueryDevtools = process.env.NODE_ENV === 'development'
-    ? lazy(() => import('@tanstack/react-query-devtools').then((m) => ({ default: m.ReactQueryDevtools })))
-    : null;
-const queryClient = new QueryClient();
-const Main = () => (_jsx(CurrentAppProvider, { appId: appId, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(AlertProvider, { children: _jsxs("main", { className: "d-flex flex-column flex-grow-1", children: [_jsx(PageWrapper, { children: _jsx(Outlet, {}) }), ReactQueryDevtools && getAppConfig(appId).NODE_ENV === 'development' && (_jsx(Suspense, { fallback: null, children: _jsx(ReactQueryDevtools, { initialIsOpen: false }) }))] }) }) }) }));
+const Main = () => (_jsx(CurrentAppProvider, { appId: appId, children: _jsx(AlertProvider, { children: _jsx("main", { className: "d-flex flex-column flex-grow-1", children: _jsx(PageWrapper, { children: _jsx(Outlet, {}) }) }) }) }));
 export default Main;
 //# sourceMappingURL=Main.js.map

package/dist/Main.js.map

@@ -1 +1 @@
-{"version":3,"file":"Main.js","sourceRoot":"","sources":["../src/Main.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,WAAW,MAAM,2BAA2B,CAAC;AAEpD,OAAO,YAAY,CAAC;AAEpB,yEAAyE;AACzE,kEAAkE;AAClE,6EAA6E;AAC7E,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa;IAC/D,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,gCAAgC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC;IACvG,CAAC,CAAC,IAAI,CAAC;AAET,MAAM,WAAW,GAAG,IAAI,WAAW,EAAE,CAAC;AAEtC,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,CACjB,KAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,YAC9B,KAAC,mBAAmB,IAAC,MAAM,EAAE,WAAW,YACtC,KAAC,aAAa,cACZ,gBAAM,SAAS,EAAC,gCAAgC,aAC9C,KAAC,WAAW,cACV,KAAC,MAAM,KAAG,GACE,EACb,kBAAkB,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC,QAAQ,KAAK,aAAa,IAAI,CACvE,KAAC,QAAQ,IAAC,QAAQ,EAAE,IAAI,YACtB,KAAC,kBAAkB,IAAC,aAAa,EAAE,KAAK,GAAI,GACnC,CACZ,IACI,GACO,GACI,GACH,CACtB,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { lazy, Suspense } from 'react';\nimport { CurrentAppProvider, getAppConfig } from '@openedx/frontend-base';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { Outlet } from 'react-router-dom';\nimport { AlertProvider } from './providers/AlertProvider';\nimport { appId } from './constants';\nimport PageWrapper from './pageWrapper/PageWrapper';\n\nimport './app.scss';\n\n// Use a dynamic import guarded by process.env.NODE_ENV so the consumer's\n// webpack dead-code-eliminates this in production builds, meaning\n// @tanstack/react-query-devtools does not need to be installed by consumers.\nconst ReactQueryDevtools = process.env.NODE_ENV === 'development'\n  ? lazy(() => import('@tanstack/react-query-devtools').then((m) => ({ default: m.ReactQueryDevtools })))\n  : null;\n\nconst queryClient = new QueryClient();\n\nconst Main = () => (\n  <CurrentAppProvider appId={appId}>\n    <QueryClientProvider client={queryClient}>\n      <AlertProvider>\n        <main className=\"d-flex flex-column flex-grow-1\">\n          <PageWrapper>\n            <Outlet />\n          </PageWrapper>\n          {ReactQueryDevtools && getAppConfig(appId).NODE_ENV === 'development' && (\n            <Suspense fallback={null}>\n              <ReactQueryDevtools initialIsOpen={false} />\n            </Suspense>\n          )}\n        </main>\n      </AlertProvider>\n    </QueryClientProvider>\n  </CurrentAppProvider>\n);\n\nexport default Main;\n"]}
+{"version":3,"file":"Main.js","sourceRoot":"","sources":["../src/Main.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,WAAW,MAAM,2BAA2B,CAAC;AAEpD,OAAO,YAAY,CAAC;AAEpB,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,CACjB,KAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,YAC9B,KAAC,aAAa,cACZ,eAAM,SAAS,EAAC,gCAAgC,YAC9C,KAAC,WAAW,cACV,KAAC,MAAM,KAAG,GACE,GACT,GACO,GACG,CACtB,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { CurrentAppProvider } from '@openedx/frontend-base';\nimport { Outlet } from 'react-router-dom';\nimport { AlertProvider } from './providers/AlertProvider';\nimport { appId } from './constants';\nimport PageWrapper from './pageWrapper/PageWrapper';\n\nimport './app.scss';\n\nconst Main = () => (\n  <CurrentAppProvider appId={appId}>\n    <AlertProvider>\n      <main className=\"d-flex flex-column flex-grow-1\">\n        <PageWrapper>\n          <Outlet />\n        </PageWrapper>\n      </main>\n    </AlertProvider>\n  </CurrentAppProvider>\n);\n\nexport default Main;\n"]}

package/dist/app.js

@@ -1,18 +1,12 @@
 import { appId } from './constants';
 import routes from './routes';
-import messages from './i18n';
 import slots from './slots';
-import providers from './providers';
+import provides from './provides';
 const app = {
     appId,
     routes,
-    messages,
-    providers,
+    provides,
     slots,
-    config: {
-        NODE_ENV: 'development',
-        LMS_BASE_URL: 'http://local.openedx.io:8000'
-    }
 };
 export default app;
 //# sourceMappingURL=app.js.map

package/dist/app.js.map

@@ -1 +1 @@
-{"version":3,"file":"app.js","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,SAAS,MAAM,gBAAgB,CAAC;AAEvC,MAAM,GAAG,GAAQ;IACf,KAAK;IACL,MAAM;IACN,QAAQ;IACR,SAAS;IACT,KAAK;IACL,MAAM,EAAE;QACN,QAAQ,EAAE,aAAa;QACvB,YAAY,EAAE,8BAA8B;KAC7C;CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { App } from '@openedx/frontend-base';\nimport { appId } from '@src/constants';\nimport routes from '@src/routes';\nimport messages from '@src/i18n';\nimport slots from '@src/slots';\nimport providers from '@src/providers';\n\nconst app: App = {\n  appId,\n  routes,\n  messages,\n  providers,\n  slots,\n  config: {\n    NODE_ENV: 'development',\n    LMS_BASE_URL: 'http://local.openedx.io:8000'\n  }\n};\n\nexport default app;\n"]}
+{"version":3,"file":"app.js","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,KAAK,MAAM,YAAY,CAAC;AAC/B,OAAO,QAAQ,MAAM,eAAe,CAAC;AAErC,MAAM,GAAG,GAAQ;IACf,KAAK;IACL,MAAM;IACN,QAAQ;IACR,KAAK;CACN,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { App } from '@openedx/frontend-base';\nimport { appId } from '@src/constants';\nimport routes from '@src/routes';\nimport slots from '@src/slots';\nimport provides from '@src/provides';\n\nconst app: App = {\n  appId,\n  routes,\n  provides,\n  slots,\n};\n\nexport default app;\n"]}

package/dist/app.scss

@@ -8,3 +8,7 @@
 .text-prewrap {
     white-space: pre-wrap;
 }
+
+.username .form-control::placeholder {
+    font-size: var(--pgn-typography-form-input-font-size-sm);
+}

package/dist/cohorts/CohortsPage.js

@@ -31,7 +31,7 @@ const CohortsPageContent = () => {
         });
         setIsOpenDisableModal(false);
     };
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "d-inline-flex align-items-center", children: [_jsx("h3", { className: "mb-0 text-gray-700", children: intl.formatMessage(messages.cohortsTitle) }), isCohorted && (_jsx("div", { className: "small", children: _jsx(IconButton, { alt: intl.formatMessage(messages.disableCohorts), iconAs: Settings, iconClassNames: "mb-2 text-gray-500", size: "sm", variant: "secondary", onClick: () => setIsOpenDisableModal(true) }) }))] }), isCohorted ? (_jsx(EnabledCohortsView, {})) : (_jsx(DisabledCohortsView, { onEnableCohorts: handleEnableCohorts })), _jsx(DisableCohortsModal, { isOpen: isOpenDisableModal, onClose: () => setIsOpenDisableModal(false), onConfirmDisable: handleDisableCohorts })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "d-inline-flex align-items-center", children: [_jsx("h3", { className: "mb-0 text-primary-700", children: intl.formatMessage(messages.cohortsTitle) }), isCohorted && (_jsx("div", { className: "small", children: _jsx(IconButton, { alt: intl.formatMessage(messages.disableCohorts), iconAs: Settings, iconClassNames: "mb-2 text-gray-500", size: "sm", variant: "secondary", onClick: () => setIsOpenDisableModal(true) }) }))] }), isCohorted ? (_jsx(EnabledCohortsView, {})) : (_jsx(DisabledCohortsView, { onEnableCohorts: handleEnableCohorts })), _jsx(DisableCohortsModal, { isOpen: isOpenDisableModal, onClose: () => setIsOpenDisableModal(false), onConfirmDisable: handleDisableCohorts })] }));
 };
 // It was necessary to wrap the entire content with CohortProvider here to avoid errors in the use of cohort hooks within a provider
 const CohortsPage = () => {

package/dist/cohorts/CohortsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CohortsPage.js","sourceRoot":"","sources":["../../src/cohorts/CohortsPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useIntl } from '@openedx/frontend-base';\nimport { IconButton } from '@openedx/paragon';\nimport { Settings } from '@openedx/paragon/icons';\nimport { useParams } from 'react-router-dom';\nimport { useState } from 'react';\nimport { CohortProvider, useCohortContext } from '@src/cohorts/components/CohortContext';\nimport DisableCohortsModal from '@src/cohorts/components/DisableCohortsModal';\nimport DisabledCohortsView from '@src/cohorts/components/DisabledCohortsView';\nimport EnabledCohortsView from '@src/cohorts/components/EnabledCohortsView';\nimport { useCohortStatus, useToggleCohorts } from '@src/cohorts/data/apiHook';\nimport messages from '@src/cohorts/messages';\nimport './CohortsPage.scss';\n\nconst CohortsPageContent = () => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams();\n  const { data: cohortStatus } = useCohortStatus(courseId);\n  const { mutate: toggleCohortsMutate } = useToggleCohorts(courseId);\n  const [isOpenDisableModal, setIsOpenDisableModal] = useState(false);\n  const { clearSelectedCohort } = useCohortContext();\n  const { isCohorted = false } = cohortStatus ?? {};\n\n  const handleEnableCohorts = () => {\n    toggleCohortsMutate({ isCohorted: true },\n      {\n        onError: (error) => console.log(error)\n      });\n  };\n\n  const handleDisableCohorts = () => {\n    toggleCohortsMutate({ isCohorted: false },\n      {\n        onSuccess: () => clearSelectedCohort(),\n        onError: (error) => console.log(error)\n      });\n    setIsOpenDisableModal(false);\n  };\n\n  return (\n    <>\n      <div className=\"d-inline-flex align-items-center\">\n        <h3 className=\"mb-0 text-gray-700\">{intl.formatMessage(messages.cohortsTitle)}</h3>\n        {isCohorted && (\n          <div className=\"small\">\n            <IconButton\n              alt={intl.formatMessage(messages.disableCohorts)}\n              iconAs={Settings}\n              iconClassNames=\"mb-2 text-gray-500\"\n              size=\"sm\"\n              variant=\"secondary\"\n              onClick={() => setIsOpenDisableModal(true)}\n            />\n          </div>\n        )}\n      </div>\n      {isCohorted ? (\n        <EnabledCohortsView />\n      ) : (\n        <DisabledCohortsView onEnableCohorts={handleEnableCohorts} />\n      )}\n      <DisableCohortsModal isOpen={isOpenDisableModal} onClose={() => setIsOpenDisableModal(false)} onConfirmDisable={handleDisableCohorts} />\n    </>\n  );\n};\n\n// It was necessary to wrap the entire content with CohortProvider here to avoid errors in the use of cohort hooks within a provider\nconst CohortsPage = () => {\n  return (\n    <CohortProvider>\n      <CohortsPageContent />\n    </CohortProvider>\n  );\n};\n\nexport default CohortsPage;\n"]}
+{"version":3,"file":"CohortsPage.js","sourceRoot":"","sources":["../../src/cohorts/CohortsPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useIntl } from '@openedx/frontend-base';\nimport { IconButton } from '@openedx/paragon';\nimport { Settings } from '@openedx/paragon/icons';\nimport { useParams } from 'react-router-dom';\nimport { useState } from 'react';\nimport { CohortProvider, useCohortContext } from '@src/cohorts/components/CohortContext';\nimport DisableCohortsModal from '@src/cohorts/components/DisableCohortsModal';\nimport DisabledCohortsView from '@src/cohorts/components/DisabledCohortsView';\nimport EnabledCohortsView from '@src/cohorts/components/EnabledCohortsView';\nimport { useCohortStatus, useToggleCohorts } from '@src/cohorts/data/apiHook';\nimport messages from '@src/cohorts/messages';\nimport './CohortsPage.scss';\n\nconst CohortsPageContent = () => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams();\n  const { data: cohortStatus } = useCohortStatus(courseId);\n  const { mutate: toggleCohortsMutate } = useToggleCohorts(courseId);\n  const [isOpenDisableModal, setIsOpenDisableModal] = useState(false);\n  const { clearSelectedCohort } = useCohortContext();\n  const { isCohorted = false } = cohortStatus ?? {};\n\n  const handleEnableCohorts = () => {\n    toggleCohortsMutate({ isCohorted: true },\n      {\n        onError: (error) => console.log(error)\n      });\n  };\n\n  const handleDisableCohorts = () => {\n    toggleCohortsMutate({ isCohorted: false },\n      {\n        onSuccess: () => clearSelectedCohort(),\n        onError: (error) => console.log(error)\n      });\n    setIsOpenDisableModal(false);\n  };\n\n  return (\n    <>\n      <div className=\"d-inline-flex align-items-center\">\n        <h3 className=\"mb-0 text-primary-700\">{intl.formatMessage(messages.cohortsTitle)}</h3>\n        {isCohorted && (\n          <div className=\"small\">\n            <IconButton\n              alt={intl.formatMessage(messages.disableCohorts)}\n              iconAs={Settings}\n              iconClassNames=\"mb-2 text-gray-500\"\n              size=\"sm\"\n              variant=\"secondary\"\n              onClick={() => setIsOpenDisableModal(true)}\n            />\n          </div>\n        )}\n      </div>\n      {isCohorted ? (\n        <EnabledCohortsView />\n      ) : (\n        <DisabledCohortsView onEnableCohorts={handleEnableCohorts} />\n      )}\n      <DisableCohortsModal isOpen={isOpenDisableModal} onClose={() => setIsOpenDisableModal(false)} onConfirmDisable={handleDisableCohorts} />\n    </>\n  );\n};\n\n// It was necessary to wrap the entire content with CohortProvider here to avoid errors in the use of cohort hooks within a provider\nconst CohortsPage = () => {\n  return (\n    <CohortProvider>\n      <CohortsPageContent />\n    </CohortProvider>\n  );\n};\n\nexport default CohortsPage;\n"]}

package/dist/cohorts/data/queryKeys.d.ts

@@ -1,7 +1,7 @@
 export declare const cohortsQueryKeys: {
-    all: readonly ["org.openedx.frontend.app.instructor", "cohorts"];
-    byCourse: (courseId: string) => readonly ["org.openedx.frontend.app.instructor", "cohorts", "byCourse", string];
-    list: (courseId: string) => readonly ["org.openedx.frontend.app.instructor", "cohorts", "byCourse", string, string, "list"];
+    all: readonly ["org.openedx.frontend.app.instructorDashboard", "cohorts"];
+    byCourse: (courseId: string) => readonly ["org.openedx.frontend.app.instructorDashboard", "cohorts", "byCourse", string];
+    list: (courseId: string) => readonly ["org.openedx.frontend.app.instructorDashboard", "cohorts", "byCourse", string, string, "list"];
     enabled: (courseId: string) => readonly ["cohortsEnabled", string];
-    contentGroups: (courseId: string) => readonly ["org.openedx.frontend.app.instructor", "cohorts", "byCourse", string, "contentGroups"];
+    contentGroups: (courseId: string) => readonly ["org.openedx.frontend.app.instructorDashboard", "cohorts", "byCourse", string, "contentGroups"];
 };

package/dist/components/SpecifyLearnerField.d.ts

@@ -1,5 +1,7 @@
+import { SelectedLearner } from '../types';
 interface SpecifyLearnerFieldProps {
-    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    learner?: SelectedLearner;
+    onClickSelect: (emailOrUsername: string) => void;
 }
-declare const SpecifyLearnerField: ({ onChange }: SpecifyLearnerFieldProps) => import("react/jsx-runtime").JSX.Element;
+declare const SpecifyLearnerField: ({ learner, onClickSelect }: SpecifyLearnerFieldProps) => import("react/jsx-runtime").JSX.Element;
 export default SpecifyLearnerField;

package/dist/components/SpecifyLearnerField.js

@@ -1,10 +1,44 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, FormControl, FormGroup, FormLabel } from '@openedx/paragon';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
+import { isAxiosError } from 'axios';
+import { useParams } from 'react-router-dom';
+import { Avatar, Button, FormControl, FormGroup, FormLabel, useToggle } from '@openedx/paragon';
 import { useIntl } from '@openedx/frontend-base';
+import { SpinnerIcon } from '@openedx/paragon/icons';
+import { useDebouncedFilter } from '../hooks/useDebouncedFilter';
+import { useCourseInfo, useLearner } from '../data/apiHook';
 import messages from './messages';
-const SpecifyLearnerField = ({ onChange }) => {
+const SpecifyLearnerField = ({ learner, onClickSelect }) => {
+    var _a;
     const intl = useIntl();
-    return (_jsxs(FormGroup, { size: "sm", children: [_jsx(FormLabel, { children: intl.formatMessage(messages.specifyLearner) }), _jsxs("div", { className: "d-flex", children: [_jsx(FormControl, { className: "mr-2", name: "emailOrUsername", placeholder: intl.formatMessage(messages.specifyLearnerPlaceholder), size: "md", autoResize: true, onChange: onChange }), _jsx(Button, { children: intl.formatMessage(messages.select) })] })] }));
+    const { courseId = '' } = useParams();
+    const [identifier, setIdentifier] = useState('');
+    const [showLearner, enableShowLearner, disableShowLearner] = useToggle(false);
+    const { data: courseInfo } = useCourseInfo(courseId);
+    const permissions = (courseInfo === null || courseInfo === void 0 ? void 0 : courseInfo.permissions) || { admin: false, dataResearcher: false };
+    const { inputValue, handleChange } = useDebouncedFilter({
+        filterValue: identifier,
+        setFilter: setIdentifier,
+    });
+    const { data = { email: '', fullName: '', username: '' }, refetch, error } = useLearner(courseId, inputValue);
+    const selectedLearner = learner || data;
+    const handleInputChange = (event) => {
+        handleChange(event.target.value);
+        if (showLearner) {
+            disableShowLearner();
+        }
+    };
+    const handleClickSelect = () => {
+        if (inputValue) {
+            onClickSelect(inputValue);
+            refetch();
+            enableShowLearner();
+        }
+    };
+    return (_jsxs(FormGroup, { className: "mb-0", size: "sm", children: [_jsx(FormLabel, { className: "text-primary-500 d-flex", children: intl.formatMessage(messages.specifyLearner) }), _jsxs("div", { className: "d-flex align-items-center", children: [_jsx(FormControl, { className: `mr-2 ${selectedLearner.username && showLearner ? 'd-none' : ''}`, name: "emailOrUsername", placeholder: intl.formatMessage(messages.specifyLearnerPlaceholder), size: "md", autoResize: true, value: inputValue, onChange: handleInputChange }), selectedLearner.username && showLearner ? (_jsxs(_Fragment, { children: [_jsx(Avatar, { className: "mr-2.5", size: "sm" }), _jsxs("div", { className: "d-flex flex-column mr-3 text-primary-500", children: [_jsx("p", { className: "mb-0", children: selectedLearner.username }), (permissions.admin || permissions.dataResearcher)
+                                        && (_jsxs("div", { className: "d-flex x-small", children: [_jsx("p", { className: "mr-3 mb-0", children: selectedLearner.fullName }), _jsx("p", { className: "mb-0", children: selectedLearner.email })] }))] }), !learner && _jsx(Button, { iconBefore: SpinnerIcon, onClick: disableShowLearner, children: intl.formatMessage(messages.change) })] })) : (_jsx(Button, { onClick: handleClickSelect, disabled: !inputValue, children: intl.formatMessage(messages.select) }))] }), showLearner && error
+                && isAxiosError(error)
+                && ((_a = error.response) === null || _a === void 0 ? void 0 : _a.status) === 404 && (_jsx("p", { className: "text-danger-500 mb-0 x-small mt-2", children: intl.formatMessage(messages.learnerNotFound, { identifier }) }))] }));
 };
 export default SpecifyLearnerField;
 //# sourceMappingURL=SpecifyLearnerField.js.map

package/dist/components/SpecifyLearnerField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpecifyLearnerField.js","sourceRoot":"","sources":["../../src/components/SpecifyLearnerField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,QAAQ,MAAM,YAAY,CAAC;AAMlC,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAA4B,EAAE,EAAE;IACrE,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IAEvB,OAAO,CACL,MAAC,SAAS,IAAC,IAAI,EAAC,IAAI,aAClB,KAAC,SAAS,cAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAa,EACpE,eAAK,SAAS,EAAC,QAAQ,aACrB,KAAC,WAAW,IAAC,SAAS,EAAC,MAAM,EAAC,IAAI,EAAC,iBAAiB,EAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,EAAE,IAAI,EAAC,IAAI,EAAC,UAAU,QAAC,QAAQ,EAAE,QAAQ,GAAI,EACrK,KAAC,MAAM,cAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAU,IAClD,IACI,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["import { Button, FormControl, FormGroup, FormLabel } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport messages from './messages';\n\ninterface SpecifyLearnerFieldProps {\n  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void,\n}\n\nconst SpecifyLearnerField = ({ onChange }: SpecifyLearnerFieldProps) => {\n  const intl = useIntl();\n\n  return (\n    <FormGroup size=\"sm\">\n      <FormLabel>{intl.formatMessage(messages.specifyLearner)}</FormLabel>\n      <div className=\"d-flex\">\n        <FormControl className=\"mr-2\" name=\"emailOrUsername\" placeholder={intl.formatMessage(messages.specifyLearnerPlaceholder)} size=\"md\" autoResize onChange={onChange} />\n        <Button>{intl.formatMessage(messages.select)}</Button>\n      </div>\n    </FormGroup>\n  );\n};\n\nexport default SpecifyLearnerField;\n"]}
+{"version":3,"file":"SpecifyLearnerField.js","sourceRoot":"","sources":["../../src/components/SpecifyLearnerField.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, ChangeEvent } from 'react';\nimport { isAxiosError } from 'axios';\nimport { useParams } from 'react-router-dom';\nimport { Avatar, Button, FormControl, FormGroup, FormLabel, useToggle } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { SpinnerIcon } from '@openedx/paragon/icons';\nimport { useDebouncedFilter } from '@src/hooks/useDebouncedFilter';\nimport { useCourseInfo, useLearner } from '@src/data/apiHook';\nimport { SelectedLearner } from '@src/types';\nimport messages from './messages';\n\ninterface SpecifyLearnerFieldProps {\n  learner?: SelectedLearner,\n  onClickSelect: (emailOrUsername: string) => void,\n}\n\nconst SpecifyLearnerField = ({ learner, onClickSelect }: SpecifyLearnerFieldProps) => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const [identifier, setIdentifier] = useState('');\n  const [showLearner, enableShowLearner, disableShowLearner] = useToggle(false);\n  const { data: courseInfo } = useCourseInfo(courseId);\n  const permissions = courseInfo?.permissions || { admin: false, dataResearcher: false };\n  const { inputValue, handleChange } = useDebouncedFilter({\n    filterValue: identifier,\n    setFilter: setIdentifier,\n  });\n  const { data = { email: '', fullName: '', username: '' }, refetch, error } = useLearner(courseId, inputValue);\n\n  const selectedLearner = learner || data;\n\n  const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n    handleChange(event.target.value);\n\n    if (showLearner) {\n      disableShowLearner();\n    }\n  };\n\n  const handleClickSelect = () => {\n    if (inputValue) {\n      onClickSelect(inputValue);\n      refetch();\n      enableShowLearner();\n    }\n  };\n\n  return (\n    <FormGroup className=\"mb-0\" size=\"sm\">\n      <FormLabel className=\"text-primary-500 d-flex\">{intl.formatMessage(messages.specifyLearner)}</FormLabel>\n      <div className=\"d-flex align-items-center\">\n        <FormControl\n          className={`mr-2 ${selectedLearner.username && showLearner ? 'd-none' : ''}`}\n          name=\"emailOrUsername\"\n          placeholder={intl.formatMessage(messages.specifyLearnerPlaceholder)}\n          size=\"md\"\n          autoResize\n          value={inputValue}\n          onChange={handleInputChange}\n        />\n        {selectedLearner.username && showLearner ? (\n          <>\n            <Avatar className=\"mr-2.5\" size=\"sm\" />\n            <div className=\"d-flex flex-column mr-3 text-primary-500\">\n              <p className=\"mb-0\">{selectedLearner.username}</p>\n              {(permissions.admin || permissions.dataResearcher)\n              && (\n                <div className=\"d-flex x-small\">\n                  <p className=\"mr-3 mb-0\">{selectedLearner.fullName}</p>\n                  <p className=\"mb-0\">{selectedLearner.email}</p>\n                </div>\n              )}\n            </div>\n            {!learner && <Button iconBefore={SpinnerIcon} onClick={disableShowLearner}>{intl.formatMessage(messages.change)}</Button>}\n          </>\n        ) : (\n          <Button onClick={handleClickSelect} disabled={!inputValue}>{intl.formatMessage(messages.select)}</Button>\n        )}\n      </div>\n      {showLearner && error\n      && isAxiosError(error)\n      && error.response?.status === 404 && (\n        <p className=\"text-danger-500 mb-0 x-small mt-2\">\n          {intl.formatMessage(messages.learnerNotFound, { identifier })}\n        </p>\n      )}\n    </FormGroup>\n  );\n};\n\nexport default SpecifyLearnerField;\n"]}

package/dist/components/SpecifyProblem.d.ts

@@ -0,0 +1,2 @@
+declare const SpecifyProblem: () => import("react/jsx-runtime").JSX.Element;
+export default SpecifyProblem;

package/dist/components/SpecifyProblem.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const SpecifyProblem = () => {
+    return _jsx("div", { children: "Specify Problem" });
+};
+export default SpecifyProblem;
+//# sourceMappingURL=SpecifyProblem.js.map

package/dist/components/SpecifyProblem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpecifyProblem.js","sourceRoot":"","sources":["../../src/components/SpecifyProblem.tsx"],"names":[],"mappings":";AAAA,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,OAAO,4CAA0B,CAAC;AACpC,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["const SpecifyProblem = () => {\n  return <div>Specify Problem</div>;\n};\n\nexport default SpecifyProblem;\n"]}

package/dist/components/UsernameFilter.d.ts

@@ -0,0 +1,7 @@
+declare const UsernameFilter: ({ column: { filterValue, setFilter } }: {
+    column: {
+        filterValue: string;
+        setFilter: (value: string) => void;
+    };
+}) => import("react/jsx-runtime").JSX.Element;
+export default UsernameFilter;

package/dist/components/UsernameFilter.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useIntl } from '@openedx/frontend-base';
+import { FormControl, Icon } from '@openedx/paragon';
+import { Search } from '@openedx/paragon/icons';
+import { useDebouncedFilter } from '../hooks/useDebouncedFilter';
+import messages from '../components/messages';
+const UsernameFilter = ({ column: { filterValue, setFilter } }) => {
+    const intl = useIntl();
+    const { inputValue, handleChange } = useDebouncedFilter({
+        filterValue,
+        setFilter,
+    });
+    const handleInputChange = (e) => {
+        handleChange(e.target.value);
+    };
+    return (_jsx(FormControl, { className: "mb-0 username", onChange: handleInputChange, placeholder: intl.formatMessage(messages.searchPlaceholder), trailingElement: _jsx(Icon, { src: Search }), value: inputValue }));
+};
+export default UsernameFilter;
+//# sourceMappingURL=UsernameFilter.js.map

package/dist/components/UsernameFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UsernameFilter.js","sourceRoot":"","sources":["../../src/components/UsernameFilter.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAEhD,MAAM,cAAc,GAAG,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,EAA2E,EAAE,EAAE;IACzI,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,kBAAkB,CAAC;QACtD,WAAW;QACX,SAAS;KACV,CAAC,CAAC;IAEH,MAAM,iBAAiB,GAAG,CAAC,CAAsC,EAAE,EAAE;QACnE,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,WAAW,IACV,SAAS,EAAC,eAAe,EACzB,QAAQ,EAAE,iBAAiB,EAC3B,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAC3D,eAAe,EAAE,KAAC,IAAI,IAAC,GAAG,EAAE,MAAM,GAAI,EACtC,KAAK,EAAE,UAAU,GACjB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useIntl } from '@openedx/frontend-base';\nimport { FormControl, Icon } from '@openedx/paragon';\nimport { Search } from '@openedx/paragon/icons';\nimport { useDebouncedFilter } from '@src/hooks/useDebouncedFilter';\nimport messages from '@src/components/messages';\n\nconst UsernameFilter = ({ column: { filterValue, setFilter } }: { column: { filterValue: string, setFilter: (value: string) => void } }) => {\n  const intl = useIntl();\n  const { inputValue, handleChange } = useDebouncedFilter({\n    filterValue,\n    setFilter,\n  });\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    handleChange(e.target.value);\n  };\n\n  return (\n    <FormControl\n      className=\"mb-0 username\"\n      onChange={handleInputChange}\n      placeholder={intl.formatMessage(messages.searchPlaceholder)}\n      trailingElement={<Icon src={Search} />}\n      value={inputValue}\n    />\n  );\n};\n\nexport default UsernameFilter;\n"]}

package/dist/components/messages.d.ts

@@ -104,5 +104,20 @@ declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    change: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    learnerNotFound: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    searchPlaceholder: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };
 export default messages;

package/dist/components/messages.js

@@ -104,6 +104,21 @@ const messages = defineMessages({
         id: 'instruct.csvComponent.uploadingFileMessage',
         defaultMessage: 'File chosen: {fileName}',
         description: 'Message displayed when a file is being uploaded, with the file name included'
+    },
+    change: {
+        id: 'instruct.specifyLearner.change',
+        defaultMessage: 'Change',
+        description: 'Label for change button in specify learner field',
+    },
+    learnerNotFound: {
+        id: 'instruct.specifyLearner.learnerNotFound',
+        defaultMessage: 'Could not find student matching identifier: {identifier}',
+        description: 'Error message displayed when a learner cannot be found based on the provided identifier (email or username)',
+    },
+    searchPlaceholder: {
+        id: 'instruct.usernameFilter.searchPlaceholder',
+        defaultMessage: 'Search By Username or Email',
+        description: 'Placeholder text for the username filter input',
     }
 });
 export default messages;

package/dist/components/messages.js.map

@@ -1 +1 @@
-{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../src/components/messages.ts"],"names":[],"mappings":"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","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  select: {\n    id: 'instruct.specifyLearner.select',\n    defaultMessage: 'Select',\n    description: 'Label for select dropdown in specify learner field',\n  },\n  specifyLearner: {\n    id: 'instruct.specifyLearner.label',\n    defaultMessage: 'Specify Learner:',\n    description: 'Label for specify learner field',\n  },\n  specifyLearnerPlaceholder: {\n    id: 'instruct.specifyLearner.placeholder',\n    defaultMessage: 'Learner email address or username',\n    description: 'Placeholder text for specify learner input field',\n  },\n  pageNotFoundHeader: {\n    id: 'instruct.pageNotFound.header',\n    defaultMessage: 'Page not found',\n    description: 'Header for page not found error',\n  },\n  pageNotFoundBody: {\n    id: 'instruct.pageNotFound.body',\n    defaultMessage: \"The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again.\",\n    description: 'Body text for page not found error',\n  },\n  pendingTasksTitle: {\n    id: 'instruct.pendingTasks.section.title',\n    defaultMessage: 'Pending Tasks',\n    description: 'Title for the pending tasks section',\n  },\n  noTasksMessage: {\n    id: 'instruct.pendingTasks.section.noTasks',\n    defaultMessage: 'No tasks currently running.',\n    description: 'Message displayed when there are no pending tasks',\n  },\n  taskTypeColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskType',\n    defaultMessage: 'Task Type',\n    description: 'Column name for task type in pending tasks table',\n  },\n  taskInputColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskInput',\n    defaultMessage: 'Task Input',\n    description: 'Column name for task input in pending tasks table',\n  },\n  taskIdColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskId',\n    defaultMessage: 'Task ID',\n    description: 'Column name for task ID in pending tasks table',\n  },\n  requesterColumnName: {\n    id: 'instruct.pendingTasks.table.column.requester',\n    defaultMessage: 'Requester',\n    description: 'Column name for requester in pending tasks table',\n  },\n  taskStateColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskState',\n    defaultMessage: 'Task State',\n    description: 'Column name for task state in pending tasks table',\n  },\n  createdColumnName: {\n    id: 'instruct.pendingTasks.table.column.created',\n    defaultMessage: 'Created',\n    description: 'Column name for created date in pending tasks table',\n  },\n  taskOutputColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskOutput',\n    defaultMessage: 'Task Output',\n    description: 'Column name for task output in pending tasks table',\n  },\n  durationColumnName: {\n    id: 'instruct.pendingTasks.table.column.duration',\n    defaultMessage: 'Duration (sec)',\n    description: 'Column name for duration in pending tasks table',\n  },\n  statusColumnName: {\n    id: 'instruct.pendingTasks.table.column.status',\n    defaultMessage: 'Status',\n    description: 'Column name for status in pending tasks table',\n  },\n  taskMessageColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskMessage',\n    defaultMessage: 'Task Message',\n    description: 'Column name for task message in pending tasks table',\n  },\n  downloadCSVTitle: {\n    id: 'instruct.csvComponent.downloadCSVTitle',\n    defaultMessage: 'Upload CSV File',\n    description: 'Title for the upload CSV file section'\n  },\n  downloadCSVDescription: {\n    id: 'instruct.csvComponent.downloadCSVDescription',\n    defaultMessage: 'Only properly formatted CSV files will be accepted',\n    description: 'Description for the upload CSV file section'\n  },\n  viewCSVTemplate: {\n    id: 'instruct.csvComponent.viewCSVTemplate',\n    defaultMessage: 'View Template',\n    description: 'Label for the view CSV template link'\n  },\n  uploadingFileMessage: {\n    id: 'instruct.csvComponent.uploadingFileMessage',\n    defaultMessage: 'File chosen: {fileName}',\n    description: 'Message displayed when a file is being uploaded, with the file name included'\n  }\n});\n\nexport default messages;\n"]}
+{"version":3,"file":"messages.js","sourceRoot":"","sources":["../../src/components/messages.ts"],"names":[],"mappings":"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","sourcesContent":["import { defineMessages } from '@openedx/frontend-base';\n\nconst messages = defineMessages({\n  select: {\n    id: 'instruct.specifyLearner.select',\n    defaultMessage: 'Select',\n    description: 'Label for select dropdown in specify learner field',\n  },\n  specifyLearner: {\n    id: 'instruct.specifyLearner.label',\n    defaultMessage: 'Specify Learner:',\n    description: 'Label for specify learner field',\n  },\n  specifyLearnerPlaceholder: {\n    id: 'instruct.specifyLearner.placeholder',\n    defaultMessage: 'Learner email address or username',\n    description: 'Placeholder text for specify learner input field',\n  },\n  pageNotFoundHeader: {\n    id: 'instruct.pageNotFound.header',\n    defaultMessage: 'Page not found',\n    description: 'Header for page not found error',\n  },\n  pageNotFoundBody: {\n    id: 'instruct.pageNotFound.body',\n    defaultMessage: \"The page you're looking for is unavailable or there's an error in the URL. Please check the URL and try again.\",\n    description: 'Body text for page not found error',\n  },\n  pendingTasksTitle: {\n    id: 'instruct.pendingTasks.section.title',\n    defaultMessage: 'Pending Tasks',\n    description: 'Title for the pending tasks section',\n  },\n  noTasksMessage: {\n    id: 'instruct.pendingTasks.section.noTasks',\n    defaultMessage: 'No tasks currently running.',\n    description: 'Message displayed when there are no pending tasks',\n  },\n  taskTypeColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskType',\n    defaultMessage: 'Task Type',\n    description: 'Column name for task type in pending tasks table',\n  },\n  taskInputColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskInput',\n    defaultMessage: 'Task Input',\n    description: 'Column name for task input in pending tasks table',\n  },\n  taskIdColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskId',\n    defaultMessage: 'Task ID',\n    description: 'Column name for task ID in pending tasks table',\n  },\n  requesterColumnName: {\n    id: 'instruct.pendingTasks.table.column.requester',\n    defaultMessage: 'Requester',\n    description: 'Column name for requester in pending tasks table',\n  },\n  taskStateColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskState',\n    defaultMessage: 'Task State',\n    description: 'Column name for task state in pending tasks table',\n  },\n  createdColumnName: {\n    id: 'instruct.pendingTasks.table.column.created',\n    defaultMessage: 'Created',\n    description: 'Column name for created date in pending tasks table',\n  },\n  taskOutputColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskOutput',\n    defaultMessage: 'Task Output',\n    description: 'Column name for task output in pending tasks table',\n  },\n  durationColumnName: {\n    id: 'instruct.pendingTasks.table.column.duration',\n    defaultMessage: 'Duration (sec)',\n    description: 'Column name for duration in pending tasks table',\n  },\n  statusColumnName: {\n    id: 'instruct.pendingTasks.table.column.status',\n    defaultMessage: 'Status',\n    description: 'Column name for status in pending tasks table',\n  },\n  taskMessageColumnName: {\n    id: 'instruct.pendingTasks.table.column.taskMessage',\n    defaultMessage: 'Task Message',\n    description: 'Column name for task message in pending tasks table',\n  },\n  downloadCSVTitle: {\n    id: 'instruct.csvComponent.downloadCSVTitle',\n    defaultMessage: 'Upload CSV File',\n    description: 'Title for the upload CSV file section'\n  },\n  downloadCSVDescription: {\n    id: 'instruct.csvComponent.downloadCSVDescription',\n    defaultMessage: 'Only properly formatted CSV files will be accepted',\n    description: 'Description for the upload CSV file section'\n  },\n  viewCSVTemplate: {\n    id: 'instruct.csvComponent.viewCSVTemplate',\n    defaultMessage: 'View Template',\n    description: 'Label for the view CSV template link'\n  },\n  uploadingFileMessage: {\n    id: 'instruct.csvComponent.uploadingFileMessage',\n    defaultMessage: 'File chosen: {fileName}',\n    description: 'Message displayed when a file is being uploaded, with the file name included'\n  },\n  change: {\n    id: 'instruct.specifyLearner.change',\n    defaultMessage: 'Change',\n    description: 'Label for change button in specify learner field',\n  },\n  learnerNotFound: {\n    id: 'instruct.specifyLearner.learnerNotFound',\n    defaultMessage: 'Could not find student matching identifier: {identifier}',\n    description: 'Error message displayed when a learner cannot be found based on the provided identifier (email or username)',\n  },\n  searchPlaceholder: {\n    id: 'instruct.usernameFilter.searchPlaceholder',\n    defaultMessage: 'Search By Username or Email',\n    description: 'Placeholder text for the username filter input',\n  }\n});\n\nexport default messages;\n"]}

package/dist/constants.d.ts

@@ -1 +1,2 @@
-export declare const appId = "org.openedx.frontend.app.instructor";
+export declare const appId = "org.openedx.frontend.app.instructorDashboard";
+export declare const instructorDashboardRole = "org.openedx.frontend.role.instructorDashboard";

package/dist/constants.js

@@ -1,2 +1,3 @@
-export const appId = 'org.openedx.frontend.app.instructor';
+export const appId = 'org.openedx.frontend.app.instructorDashboard';
+export const instructorDashboardRole = 'org.openedx.frontend.role.instructorDashboard';
 //# sourceMappingURL=constants.js.map

package/dist/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG,qCAAqC,CAAC","sourcesContent":["export const appId = 'org.openedx.frontend.app.instructor';\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG,8CAA8C,CAAC;AACpE,MAAM,CAAC,MAAM,uBAAuB,GAAG,+CAA+C,CAAC","sourcesContent":["export const appId = 'org.openedx.frontend.app.instructorDashboard';\nexport const instructorDashboardRole = 'org.openedx.frontend.role.instructorDashboard';\n"]}

package/dist/courseInfo/types.d.ts

@@ -20,6 +20,13 @@ export interface CourseInfoResponse {
     gradeCutoffs: string | null;
     staffCount: number;
     learnerCount: number;
+    permissions: {
+        admin: boolean;
+        dataResearcher: boolean;
+        [key: string]: boolean;
+    };
+    gradebookUrl: string;
+    studioGradingUrl?: string;
 }
 interface EnrollmentCounts extends Record<string, number> {
     total: number;

package/dist/courseInfo/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/courseInfo/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TabProps } from '@src/instructorNav/InstructorNav';\n\nexport interface CourseInfoResponse {\n  courseId: string,\n  displayName: string,\n  courseNumber: string,\n  courseRun: string,\n  enrollmentCounts: EnrollmentCounts,\n  start: string | null,\n  end: string | null,\n  tabs?: TabProps[],\n  totalEnrollment: number,\n  studioUrl: string,\n  pacing: string,\n  org?: string,\n  numSections: number,\n  hasStarted: boolean,\n  hasEnded: boolean,\n  enrollmentEnd: string | null,\n  enrollmentStart: string | null,\n  gradeCutoffs: string | null,\n  staffCount: number,\n  learnerCount: number,\n}\n\ninterface EnrollmentCounts extends Record<string, number> {\n  total: number,\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/courseInfo/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TabProps } from '@src/instructorNav/InstructorNav';\n\nexport interface CourseInfoResponse {\n  courseId: string,\n  displayName: string,\n  courseNumber: string,\n  courseRun: string,\n  enrollmentCounts: EnrollmentCounts,\n  start: string | null,\n  end: string | null,\n  tabs?: TabProps[],\n  totalEnrollment: number,\n  studioUrl: string,\n  pacing: string,\n  org?: string,\n  numSections: number,\n  hasStarted: boolean,\n  hasEnded: boolean,\n  enrollmentEnd: string | null,\n  enrollmentStart: string | null,\n  gradeCutoffs: string | null,\n  staffCount: number,\n  learnerCount: number,\n  permissions: {\n    admin: boolean,\n    dataResearcher: boolean,\n    [key: string]: boolean,\n  },\n  gradebookUrl: string,\n  studioGradingUrl?: string,\n}\n\ninterface EnrollmentCounts extends Record<string, number> {\n  total: number,\n}\n"]}

package/dist/courseTeam/CourseTeamPage.js

@@ -1,6 +1,13 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useIntl } from '@openedx/frontend-base';
+import { Button, Tab, Tabs } from '@openedx/paragon';
+import { Plus } from '@openedx/paragon/icons';
+import MembersContent from '../courseTeam/components/MembersContent';
+import RolesContent from '../courseTeam/components/RolesContent';
+import messages from '../courseTeam/messages';
 const CourseTeamPage = () => {
-    return (_jsx("div", { children: _jsx("h3", { children: "Course Team" }) }));
+    const intl = useIntl();
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "d-flex justify-content-between align-items-center mb-3", children: [_jsx("h3", { className: "text-primary-700 mb-0", children: intl.formatMessage(messages.courseTeamTitle) }), _jsx(Button, { iconBefore: Plus, variant: "primary", children: intl.formatMessage(messages.addTeamMember) })] }), _jsxs(Tabs, { children: [_jsx(Tab, { eventKey: "members", title: intl.formatMessage(messages.membersTab), children: _jsx(MembersContent, {}) }), _jsx(Tab, { eventKey: "roles", title: intl.formatMessage(messages.rolesTab), children: _jsx(RolesContent, {}) })] })] }));
 };
 export default CourseTeamPage;
 //# sourceMappingURL=CourseTeamPage.js.map

package/dist/courseTeam/CourseTeamPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CourseTeamPage.js","sourceRoot":"","sources":["../../src/courseTeam/CourseTeamPage.tsx"],"names":[],"mappings":";AAAA,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,OAAO,CACL,wBACE,uCAAoB,GAChB,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["const CourseTeamPage = () => {\n  return (\n    <div>\n      <h3>Course Team</h3>\n    </div>\n  );\n};\n\nexport default CourseTeamPage;\n"]}
+{"version":3,"file":"CourseTeamPage.js","sourceRoot":"","sources":["../../src/courseTeam/CourseTeamPage.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,cAAc,MAAM,2CAA2C,CAAC;AACvE,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAEhD,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IAEvB,OAAO,CACL,8BACE,eAAK,SAAS,EAAC,wDAAwD,aACrE,aAAI,SAAS,EAAC,uBAAuB,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,eAAe,CAAC,GAAM,EACzF,KAAC,MAAM,IAAC,UAAU,EAAE,IAAI,EAAE,OAAO,EAAC,SAAS,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAU,IAC7F,EACN,MAAC,IAAI,eACH,KAAC,GAAG,IAAC,QAAQ,EAAC,SAAS,EAAC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,UAAU,CAAC,YACpE,KAAC,cAAc,KAAG,GACd,EACN,KAAC,GAAG,IAAC,QAAQ,EAAC,OAAO,EAAC,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,YAChE,KAAC,YAAY,KAAG,GACZ,IACD,IACN,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useIntl } from '@openedx/frontend-base';\nimport { Button, Tab, Tabs } from '@openedx/paragon';\nimport { Plus } from '@openedx/paragon/icons';\nimport MembersContent from '@src/courseTeam/components/MembersContent';\nimport RolesContent from '@src/courseTeam/components/RolesContent';\nimport messages from '@src/courseTeam/messages';\n\nconst CourseTeamPage = () => {\n  const intl = useIntl();\n\n  return (\n    <>\n      <div className=\"d-flex justify-content-between align-items-center mb-3\">\n        <h3 className=\"text-primary-700 mb-0\">{intl.formatMessage(messages.courseTeamTitle)}</h3>\n        <Button iconBefore={Plus} variant=\"primary\">{intl.formatMessage(messages.addTeamMember)}</Button>\n      </div>\n      <Tabs>\n        <Tab eventKey=\"members\" title={intl.formatMessage(messages.membersTab)}>\n          <MembersContent />\n        </Tab>\n        <Tab eventKey=\"roles\" title={intl.formatMessage(messages.rolesTab)}>\n          <RolesContent />\n        </Tab>\n      </Tabs>\n    </>\n  );\n};\n\nexport default CourseTeamPage;\n"]}

package/dist/courseTeam/components/MembersContent.d.ts

@@ -0,0 +1,2 @@
+declare const MembersContent: () => import("react/jsx-runtime").JSX.Element;
+export default MembersContent;

package/dist/courseTeam/components/MembersContent.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useMemo } from 'react';
+import { useParams } from 'react-router-dom';
+import { useIntl } from '@openedx/frontend-base';
+import { Button, DataTable, FormControl, Icon } from '@openedx/paragon';
+import { FilterList } from '@openedx/paragon/icons';
+import UsernameFilter from '../../components/UsernameFilter';
+import { useRoles, useTeamMembers } from '../../courseTeam/data/apiHook';
+import messages from '../../courseTeam/messages';
+const TEAM_MEMBERS_PAGE_SIZE = 25;
+const RoleFilter = ({ column: { filterValue, setFilter } }) => {
+    const intl = useIntl();
+    const { courseId = '' } = useParams();
+    const { data } = useRoles(courseId);
+    const handleSelectChange = (e) => {
+        setFilter(e.target.value);
+    };
+    const roles = useMemo(() => {
+        return [{ value: '', label: intl.formatMessage(messages.allRoles) }, ...((data === null || data === void 0 ? void 0 : data.results) || []).map((role) => ({ value: role.role, label: role.displayName }))];
+    }, [data, intl]);
+    return (_jsx(FormControl, { as: "select", className: "mb-0", disabled: !data, name: "role", size: "md", value: filterValue, onChange: handleSelectChange, leadingElement: _jsx(Icon, { src: FilterList }), children: roles.map(role => (_jsx("option", { value: role.value, children: role.label }, role.value))) }));
+};
+const MembersContent = () => {
+    const intl = useIntl();
+    const { courseId = '' } = useParams();
+    const [filters, setFilters] = useState({ page: 0, emailOrUsername: '', role: '' });
+    const { data: { results: teamMembers = [], numPages = 1, count = 0 } = {}, isLoading = false } = useTeamMembers(courseId, Object.assign(Object.assign({}, filters), { pageSize: TEAM_MEMBERS_PAGE_SIZE }));
+    const tableColumns = useMemo(() => [
+        { accessor: 'username', Header: intl.formatMessage(messages.username), Filter: UsernameFilter },
+        { accessor: 'email', Header: intl.formatMessage(messages.email), disableFilters: true },
+        { accessor: 'role', Header: intl.formatMessage(messages.role), Filter: RoleFilter },
+    ], [intl]);
+    const additionalColumns = useMemo(() => [{
+            id: 'actions',
+            Header: intl.formatMessage(messages.actions),
+            Cell: () => (_jsx(Button, { variant: "link", size: "inline", children: intl.formatMessage(messages.edit) }))
+        }], [intl]);
+    const handleFetchData = (data) => {
+        var _a, _b;
+        const usernameFilter = (_a = data.filters) === null || _a === void 0 ? void 0 : _a.find((f) => f.id === 'username');
+        const newEmailOrUsername = usernameFilter ? usernameFilter.value : '';
+        const rolesFilter = (_b = data.filters) === null || _b === void 0 ? void 0 : _b.find((f) => f.id === 'role');
+        const newRole = rolesFilter ? rolesFilter.value : '';
+        const filtersChanged = (newEmailOrUsername !== filters.emailOrUsername) || (newRole !== filters.role);
+        if (filtersChanged) {
+            setFilters((prevFilters) => (Object.assign(Object.assign({}, prevFilters), { emailOrUsername: newEmailOrUsername, role: newRole, page: 0 })));
+            return;
+        }
+        if (data.pageIndex !== filters.page) {
+            setFilters((prevFilters) => (Object.assign(Object.assign({}, prevFilters), { page: data.pageIndex })));
+        }
+    };
+    const tableState = useMemo(() => ({
+        pageIndex: filters.page,
+        pageSize: TEAM_MEMBERS_PAGE_SIZE,
+    }), [filters.page]);
+    return (_jsxs(DataTable, { additionalColumns: additionalColumns, columns: tableColumns, data: teamMembers, fetchData: handleFetchData, state: tableState, isFilterable: true, isLoading: isLoading, isPaginated: true, itemCount: count, manualFilters: true, manualPagination: true, numBreakoutFilters: 2, pageSize: TEAM_MEMBERS_PAGE_SIZE, pageCount: numPages, RowStatusComponent: () => null, children: [_jsx(DataTable.TableControlBar, {}), _jsx(DataTable.Table, {}), _jsx(DataTable.EmptyTable, { content: intl.formatMessage(messages.noTeamMembers) }), _jsx(DataTable.TableFooter, {})] }));
+};
+export default MembersContent;
+//# sourceMappingURL=MembersContent.js.map

package/dist/courseTeam/components/MembersContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MembersContent.js","sourceRoot":"","sources":["../../../src/courseTeam/components/MembersContent.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Button, DataTable, FormControl, Icon } from '@openedx/paragon';\nimport { FilterList } from '@openedx/paragon/icons';\nimport UsernameFilter from '@src/components/UsernameFilter';\nimport { useRoles, useTeamMembers } from '@src/courseTeam/data/apiHook';\nimport messages from '@src/courseTeam/messages';\nimport { Role } from '@src/courseTeam/types';\nimport { DataTableFetchDataProps } from '@src/types';\n\nconst TEAM_MEMBERS_PAGE_SIZE = 25;\n\nconst RoleFilter = ({ column: { filterValue, setFilter } }: { column: { filterValue: string, setFilter: (value: string) => void } }) => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const { data } = useRoles(courseId);\n\n  const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    setFilter(e.target.value);\n  };\n\n  const roles = useMemo(() => {\n    return [{ value: '', label: intl.formatMessage(messages.allRoles) }, ...(data?.results || []).map((role: Role) => ({ value: role.role, label: role.displayName }))];\n  }, [data, intl]);\n\n  return (\n    <FormControl\n      as=\"select\"\n      className=\"mb-0\"\n      disabled={!data}\n      name=\"role\"\n      size=\"md\"\n      value={filterValue}\n      onChange={handleSelectChange}\n      leadingElement={<Icon src={FilterList} />}\n    >\n      {roles.map(role => (\n        <option key={role.value} value={role.value}>\n          {role.label}\n        </option>\n      ))}\n    </FormControl>\n  );\n};\n\nconst MembersContent = () => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const [filters, setFilters] = useState({ page: 0, emailOrUsername: '', role: '' });\n  const { data: { results: teamMembers = [], numPages = 1, count = 0 } = {}, isLoading = false } = useTeamMembers(courseId, { ...filters, pageSize: TEAM_MEMBERS_PAGE_SIZE });\n\n  const tableColumns = useMemo(() => [\n    { accessor: 'username', Header: intl.formatMessage(messages.username), Filter: UsernameFilter },\n    { accessor: 'email', Header: intl.formatMessage(messages.email), disableFilters: true },\n    { accessor: 'role', Header: intl.formatMessage(messages.role), Filter: RoleFilter },\n  ], [intl]);\n\n  const additionalColumns = useMemo(() => [{\n    id: 'actions',\n    Header: intl.formatMessage(messages.actions),\n    Cell: () => (\n      <Button variant=\"link\" size=\"inline\">\n        {intl.formatMessage(messages.edit)}\n      </Button>\n    )\n  }], [intl]);\n\n  const handleFetchData = (data: DataTableFetchDataProps) => {\n    const usernameFilter = data.filters?.find((f) => f.id === 'username');\n    const newEmailOrUsername = usernameFilter ? usernameFilter.value : '';\n    const rolesFilter = data.filters?.find((f) => f.id === 'role');\n    const newRole = rolesFilter ? rolesFilter.value : '';\n    const filtersChanged = (newEmailOrUsername !== filters.emailOrUsername) || (newRole !== filters.role);\n\n    if (filtersChanged) {\n      setFilters((prevFilters) => ({\n        ...prevFilters,\n        emailOrUsername: newEmailOrUsername,\n        role: newRole,\n        page: 0,\n      }));\n      return;\n    }\n\n    if (data.pageIndex !== filters.page) {\n      setFilters((prevFilters) => ({ ...prevFilters, page: data.pageIndex }));\n    }\n  };\n\n  const tableState = useMemo(() => ({\n    pageIndex: filters.page,\n    pageSize: TEAM_MEMBERS_PAGE_SIZE,\n  }), [filters.page]);\n\n  return (\n    <DataTable\n      additionalColumns={additionalColumns}\n      columns={tableColumns}\n      data={teamMembers}\n      fetchData={handleFetchData}\n      state={tableState}\n      isFilterable\n      isLoading={isLoading}\n      isPaginated\n      itemCount={count}\n      manualFilters\n      manualPagination\n      numBreakoutFilters={2}\n      pageSize={TEAM_MEMBERS_PAGE_SIZE}\n      pageCount={numPages}\n      RowStatusComponent={() => null}\n    >\n      <DataTable.TableControlBar />\n      <DataTable.Table />\n      <DataTable.EmptyTable content={intl.formatMessage(messages.noTeamMembers)} />\n      <DataTable.TableFooter />\n    </DataTable>\n  );\n};\n\nexport default MembersContent;\n"]}

package/dist/courseTeam/components/RolesContent.d.ts

@@ -0,0 +1,3 @@
+export declare const rolesOrder: readonly ["staff", "limitedStaff", "admin", "beta", "courseDataResearchers", "discussionAdmin", "discussionModerator", "groupCommunityTA", "communityTA"];
+declare const RolesContent: () => import("react/jsx-runtime").JSX.Element;
+export default RolesContent;

package/dist/courseTeam/components/RolesContent.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useParams } from 'react-router-dom';
+import { useIntl } from '@openedx/frontend-base';
+import messages from '../../courseTeam/messages';
+import { useRoles } from '../../courseTeam/data/apiHook';
+export const rolesOrder = [
+    'staff',
+    'limitedStaff',
+    'admin',
+    'beta',
+    'courseDataResearchers',
+    'discussionAdmin',
+    'discussionModerator',
+    'groupCommunityTA',
+    'communityTA'
+];
+const RolesContent = () => {
+    const intl = useIntl();
+    const { courseId = '' } = useParams();
+    const { data: { results } = { results: [] } } = useRoles(courseId);
+    const isCCXCoachEnabled = !!(results === null || results === void 0 ? void 0 : results.find(({ role }) => role === 'ccx_coach'));
+    return (_jsxs("div", { className: "mt-4", children: [rolesOrder.map((role) => (_jsxs("div", { className: "mb-4", children: [_jsx("h4", { className: "text-primary-500", children: intl.formatMessage(messages[role]) }), _jsx("p", { className: "text-gray-700", children: intl.formatMessage(messages[`${role}Description`]) })] }, role))), isCCXCoachEnabled && (_jsxs("div", { className: "mb-4", children: [_jsx("h4", { className: "text-primary-500", children: intl.formatMessage(messages.ccxCoach) }), _jsx("p", { className: "text-gray-700", children: intl.formatMessage(messages.ccxCoachDescription) })] }))] }));
+};
+export default RolesContent;
+//# sourceMappingURL=RolesContent.js.map

package/dist/courseTeam/components/RolesContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RolesContent.js","sourceRoot":"","sources":["../../../src/courseTeam/components/RolesContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,QAAQ,MAAM,0BAA0B,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAGxD,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,OAAO;IACP,cAAc;IACd,OAAO;IACP,MAAM;IACN,uBAAuB;IACvB,iBAAiB;IACjB,qBAAqB;IACrB,kBAAkB;IAClB,aAAa;CACL,CAAC;AAEX,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,SAAS,EAAwB,CAAC;IAC5D,MAAM,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACnE,MAAM,iBAAiB,GAAG,CAAC,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAC,CAAC,EAAE,IAAI,EAAQ,EAAE,EAAE,CAAC,IAAI,KAAK,WAAW,CAAC,CAAA,CAAC;IAEpF,OAAO,CACL,eAAK,SAAS,EAAC,MAAM,aAEjB,UAAU,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACvB,eAAgB,SAAS,EAAC,MAAM,aAC9B,aAAI,SAAS,EAAC,kBAAkB,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAM,EAC1E,YAAG,SAAS,EAAC,eAAe,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,IAAI,aAAa,CAAC,CAAC,GAAK,KAF7E,IAAI,CAGR,CACP,CAAC,EAGF,iBAAiB,IAAI,CACnB,eAAK,SAAS,EAAC,MAAM,aACnB,aAAI,SAAS,EAAC,kBAAkB,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAM,EAC7E,YAAG,SAAS,EAAC,eAAe,YAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,mBAAmB,CAAC,GAAK,IAC/E,CACP,IAEC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { useParams } from 'react-router-dom';\nimport { useIntl } from '@openedx/frontend-base';\nimport messages from '@src/courseTeam/messages';\nimport { useRoles } from '@src/courseTeam/data/apiHook';\nimport { Role } from '@src/courseTeam/types';\n\nexport const rolesOrder = [\n  'staff',\n  'limitedStaff',\n  'admin',\n  'beta',\n  'courseDataResearchers',\n  'discussionAdmin',\n  'discussionModerator',\n  'groupCommunityTA',\n  'communityTA'\n] as const;\n\nconst RolesContent = () => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const { data: { results } = { results: [] } } = useRoles(courseId);\n  const isCCXCoachEnabled = !!results?.find(({ role }: Role) => role === 'ccx_coach');\n\n  return (\n    <div className=\"mt-4\">\n      {\n        rolesOrder.map((role) => (\n          <div key={role} className=\"mb-4\">\n            <h4 className=\"text-primary-500\">{intl.formatMessage(messages[role])}</h4>\n            <p className=\"text-gray-700\">{intl.formatMessage(messages[`${role}Description`])}</p>\n          </div>\n        ))\n      }\n      {\n        isCCXCoachEnabled && (\n          <div className=\"mb-4\">\n            <h4 className=\"text-primary-500\">{intl.formatMessage(messages.ccxCoach)}</h4>\n            <p className=\"text-gray-700\">{intl.formatMessage(messages.ccxCoachDescription)}</p>\n          </div>\n        )\n      }\n    </div>\n  );\n};\n\nexport default RolesContent;\n"]}

package/dist/courseTeam/data/api.d.ts

@@ -0,0 +1,4 @@
+import { DataList } from '../../types';
+import { CourseTeamMember, CourseTeamMemberQueryParams, Role } from '../../courseTeam/types';
+export declare const getTeamMembers: (courseId: string, params: CourseTeamMemberQueryParams) => Promise<DataList<CourseTeamMember>>;
+export declare const getRoles: (courseId: string) => Promise<Omit<DataList<Role>, "numPages" | "count">>;

package/dist/courseTeam/data/api.js

@@ -0,0 +1,30 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { camelCaseObject, getAuthenticatedHttpClient } from '@openedx/frontend-base';
+import { getApiBaseUrl } from '../../data/api';
+export const getTeamMembers = (courseId, params) => __awaiter(void 0, void 0, void 0, function* () {
+    const queryParams = new URLSearchParams({
+        page: (params.page + 1).toString(),
+        page_size: params.pageSize.toString(),
+    });
+    if (params.emailOrUsername) {
+        queryParams.append('email_or_username', params.emailOrUsername);
+    }
+    if (params.role) {
+        queryParams.append('role', params.role);
+    }
+    const { data } = yield getAuthenticatedHttpClient().get(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/team?${queryParams.toString()}`);
+    return camelCaseObject(data);
+});
+export const getRoles = (courseId) => __awaiter(void 0, void 0, void 0, function* () {
+    const { data } = yield getAuthenticatedHttpClient().get(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/team/roles`);
+    return camelCaseObject(data);
+});
+//# sourceMappingURL=api.js.map