@openedx/frontend-app-instructor-dashboard 1.0.0-alpha.0

package/dist/dateExtensions/components/AddExtensionModal.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ActionRow, Button, Form, FormControl, FormGroup, FormLabel, ModalDialog } from '@openedx/paragon';
+import { useIntl } from '@openedx/frontend-base';
+import SpecifyLearnerField from '../../components/SpecifyLearnerField';
+import messages from '../messages';
+import SelectGradedSubsection from './SelectGradedSubsection';
+const AddExtensionModal = ({ isOpen, title, onClose, onSubmit }) => {
+    const intl = useIntl();
+    const [formData, setFormData] = useState({
+        emailOrUsername: '',
+        blockId: '',
+        dueDate: '',
+        dueTime: '',
+        reason: '',
+    });
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        const { emailOrUsername, blockId, dueDate, dueTime, reason } = formData;
+        onSubmit({
+            emailOrUsername,
+            blockId,
+            dueDatetime: new Date(`${dueDate}T${dueTime}`).toISOString(),
+            reason
+        });
+    };
+    const onChange = (event) => {
+        const { name, value } = event.target;
+        setFormData((prevData) => (Object.assign(Object.assign({}, prevData), { [name]: value })));
+    };
+    return (_jsxs(ModalDialog, { isOpen: isOpen, onClose: onClose, title: title, isOverflowVisible: false, size: "xl", children: [_jsx(ModalDialog.Header, { className: "p-3 pl-4 border-bottom", children: _jsx(ModalDialog.Title, { as: "h3", className: "m-0", children: title }) }), _jsxs(Form, { onSubmit: handleSubmit, className: "position-relative overflow-auto", children: [_jsx(ModalDialog.Body, { children: _jsxs("div", { className: "pt-3", children: [_jsx("p", { children: intl.formatMessage(messages.extensionInstructions) }), _jsx("div", { className: "container-fluid border-bottom mb-4.5 pb-3", children: _jsxs("div", { className: "row", children: [_jsx("div", { className: "col-sm-12 col-md-6", children: _jsx(SpecifyLearnerField, { onChange: onChange }) }), _jsx("div", { className: "col-sm-12 col-md-4", children: _jsx(SelectGradedSubsection, { label: intl.formatMessage(messages.selectGradedSubsection), placeholder: intl.formatMessage(messages.selectGradedSubsection), onChange: onChange }) })] }) }), _jsxs("div", { children: [_jsx("h4", { children: intl.formatMessage(messages.defineExtension) }), _jsxs(FormGroup, { size: "sm", children: [_jsxs(FormLabel, { children: [intl.formatMessage(messages.extensionDate), ":"] }), _jsxs("div", { className: "d-md-flex w-md-50 align-items-center", children: [_jsx(FormControl, { name: "dueDate", type: "date", size: "md", onChange: onChange }), _jsx(FormControl, { name: "dueTime", type: "time", size: "md", className: "mt-sm-3 mt-md-0", onChange: onChange })] })] }), _jsxs(FormGroup, { className: "mt-3", size: "sm", children: [_jsxs(FormLabel, { children: [intl.formatMessage(messages.reasonForExtension), ":"] }), _jsx(FormControl, { name: "reason", placeholder: intl.formatMessage(messages.reasonForExtension), size: "md", onChange: onChange })] })] })] }) }), _jsx(ModalDialog.Footer, { className: "p-4 border-top", children: _jsxs(ActionRow, { children: [_jsx(Button, { variant: "tertiary", onClick: onClose, children: intl.formatMessage(messages.cancel) }), _jsx(Button, { type: "submit", children: intl.formatMessage(messages.addExtension) })] }) })] })] }));
+};
+export default AddExtensionModal;
+//# sourceMappingURL=AddExtensionModal.js.map

package/dist/dateExtensions/components/AddExtensionModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddExtensionModal.js","sourceRoot":"","sources":["../../../src/dateExtensions/components/AddExtensionModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport { ActionRow, Button, Form, FormControl, FormGroup, FormLabel, ModalDialog } from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport SpecifyLearnerField from '../../components/SpecifyLearnerField';\nimport messages from '../messages';\nimport SelectGradedSubsection from './SelectGradedSubsection';\n\ninterface AddExtensionModalProps {\n  isOpen: boolean,\n  title: string,\n  onClose: () => void,\n  onSubmit: ({ emailOrUsername, blockId, dueDatetime, reason }: {\n    emailOrUsername: string,\n    blockId: string,\n    dueDatetime: string,\n    reason: string,\n  }) => void,\n}\n\nconst AddExtensionModal = ({ isOpen, title, onClose, onSubmit }: AddExtensionModalProps) => {\n  const intl = useIntl();\n  const [formData, setFormData] = useState({\n    emailOrUsername: '',\n    blockId: '',\n    dueDate: '',\n    dueTime: '',\n    reason: '',\n  });\n\n  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    const { emailOrUsername, blockId, dueDate, dueTime, reason } = formData;\n    onSubmit({\n      emailOrUsername,\n      blockId,\n      dueDatetime: new Date(`${dueDate}T${dueTime}`).toISOString(),\n      reason\n    });\n  };\n\n  const onChange = (event: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {\n    const { name, value } = event.target;\n    setFormData((prevData) => ({\n      ...prevData,\n      [name]: value,\n    }));\n  };\n\n  return (\n    <ModalDialog isOpen={isOpen} onClose={onClose} title={title} isOverflowVisible={false} size=\"xl\">\n      <ModalDialog.Header className=\"p-3 pl-4 border-bottom\">\n        <ModalDialog.Title as=\"h3\" className=\"m-0\">\n          {title}\n        </ModalDialog.Title>\n      </ModalDialog.Header>\n      <Form onSubmit={handleSubmit} className=\"position-relative overflow-auto\">\n        <ModalDialog.Body>\n          <div className=\"pt-3\">\n            <p>{intl.formatMessage(messages.extensionInstructions)}</p>\n            <div className=\"container-fluid border-bottom mb-4.5 pb-3\">\n              <div className=\"row\">\n                <div className=\"col-sm-12 col-md-6\">\n                  <SpecifyLearnerField onChange={onChange} />\n                </div>\n                <div className=\"col-sm-12 col-md-4\">\n                  <SelectGradedSubsection\n                    label={intl.formatMessage(messages.selectGradedSubsection)}\n                    placeholder={intl.formatMessage(messages.selectGradedSubsection)}\n                    onChange={onChange}\n                  />\n                </div>\n              </div>\n            </div>\n            <div>\n              <h4>{intl.formatMessage(messages.defineExtension)}</h4>\n              <FormGroup size=\"sm\">\n                <FormLabel>\n                  {intl.formatMessage(messages.extensionDate)}:\n                </FormLabel>\n                <div className=\"d-md-flex w-md-50 align-items-center\">\n                  <FormControl name=\"dueDate\" type=\"date\" size=\"md\" onChange={onChange} />\n                  <FormControl name=\"dueTime\" type=\"time\" size=\"md\" className=\"mt-sm-3 mt-md-0\" onChange={onChange} />\n                </div>\n              </FormGroup>\n              <FormGroup className=\"mt-3\" size=\"sm\">\n                <FormLabel>\n                  {intl.formatMessage(messages.reasonForExtension)}:\n                </FormLabel>\n                <FormControl name=\"reason\" placeholder={intl.formatMessage(messages.reasonForExtension)} size=\"md\" onChange={onChange} />\n              </FormGroup>\n            </div>\n          </div>\n        </ModalDialog.Body>\n        <ModalDialog.Footer className=\"p-4 border-top\">\n          <ActionRow>\n            <Button variant=\"tertiary\" onClick={onClose}>{intl.formatMessage(messages.cancel)}</Button>\n            <Button type=\"submit\">{intl.formatMessage(messages.addExtension)}</Button>\n          </ActionRow>\n        </ModalDialog.Footer>\n      </Form>\n    </ModalDialog>\n  );\n};\n\nexport default AddExtensionModal;\n"]}

package/dist/dateExtensions/components/DateExtensionsList.d.ts

@@ -0,0 +1,7 @@
+import { LearnerDateExtension } from '../types';
+export interface DateExtensionListProps {
+    onResetExtensions?: (user: LearnerDateExtension) => void;
+    onClickAdd?: () => void;
+}
+declare const DateExtensionsList: ({ onResetExtensions, onClickAdd, }: DateExtensionListProps) => import("react/jsx-runtime").JSX.Element;
+export default DateExtensionsList;

package/dist/dateExtensions/components/DateExtensionsList.js

@@ -0,0 +1,103 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useParams } from 'react-router-dom';
+import { useIntl } from '@openedx/frontend-base';
+import { Button, DataTable, FormControl, Icon } from '@openedx/paragon';
+import messages from '../messages';
+import { useDateExtensions } from '../data/apiHook';
+import { Search } from '@openedx/paragon/icons';
+import SelectGradedSubsection from './SelectGradedSubsection';
+import { useDebouncedFilter } from '../../hooks/useDebouncedFilter';
+const DATE_EXTENSIONS_PAGE_SIZE = 25;
+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", onChange: handleInputChange, placeholder: intl.formatMessage(messages.searchLearnerPlaceholder), trailingElement: _jsx(Icon, { src: Search }), value: inputValue }));
+};
+const GradedSubsectionFilter = ({ column: { filterValue, setFilter } }) => {
+    const intl = useIntl();
+    const { inputValue, handleChange } = useDebouncedFilter({
+        filterValue,
+        setFilter,
+    });
+    const handleSelectChange = (e) => {
+        handleChange(e.target.value);
+    };
+    return (_jsx(SelectGradedSubsection, { placeholder: intl.formatMessage(messages.allGradedSubsections), onChange: handleSelectChange, value: inputValue }));
+};
+const DateExtensionsList = ({ onResetExtensions = () => { }, onClickAdd = () => { }, }) => {
+    const intl = useIntl();
+    const { courseId = '' } = useParams();
+    const [filters, setFilters] = useState({
+        page: 0,
+        emailOrUsername: '',
+        blockId: '',
+    });
+    const { data = { count: 0, results: [], numPages: 0 }, isLoading } = useDateExtensions(courseId !== null && courseId !== void 0 ? courseId : '', {
+        blockId: filters.blockId,
+        emailOrUsername: filters.emailOrUsername,
+        page: filters.page,
+        pageSize: DATE_EXTENSIONS_PAGE_SIZE,
+    });
+    const tableColumns = [
+        { accessor: 'username',
+            Header: intl.formatMessage(messages.username),
+            Filter: UsernameFilter,
+        },
+        { accessor: 'fullName', Header: intl.formatMessage(messages.fullname), disableFilters: true, },
+        { accessor: 'email', Header: intl.formatMessage(messages.email), disableFilters: true, },
+        { accessor: 'unitTitle',
+            Header: intl.formatMessage(messages.gradedSubsection),
+            Filter: GradedSubsectionFilter,
+        },
+        {
+            accessor: 'extendedDueDate',
+            Header: intl.formatMessage(messages.extendedDueDate),
+            Cell: ({ value }) => (intl.formatDate(value, { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', timeZone: 'UTC' })),
+            disableFilters: true,
+        },
+    ];
+    const additionalColumns = [{
+            id: 'reset',
+            Header: intl.formatMessage(messages.reset),
+            Cell: ({ row }) => (_jsx(Button, { variant: "link", size: "inline", onClick: () => onResetExtensions(row.original), children: intl.formatMessage(messages.resetExtensions) }))
+        }];
+    const handleFetchData = (data) => {
+        const emailOrUsernameFilter = data.filters.find((filter) => filter.id === 'username');
+        const newEmailOrUsername = emailOrUsernameFilter ? emailOrUsernameFilter.value : '';
+        const blockIdFilter = data.filters.find((filter) => filter.id === 'unitTitle');
+        const newBlockId = blockIdFilter ? blockIdFilter.value : '';
+        const filterChanged = newEmailOrUsername !== filters.emailOrUsername || newBlockId !== filters.blockId;
+        const pageChanged = data.pageIndex !== filters.page;
+        // If filters changed, reset to page 0
+        if (filterChanged) {
+            setFilters({ page: 0, emailOrUsername: newEmailOrUsername, blockId: newBlockId });
+        }
+        else if (pageChanged) {
+            // If only page changed (filters didn't change), update page
+            setFilters({ page: data.pageIndex, emailOrUsername: newEmailOrUsername, blockId: newBlockId });
+        }
+    };
+    return (_jsxs(DataTable, { columns: tableColumns, additionalColumns: additionalColumns, data: data.results, fetchData: handleFetchData, state: {
+            pageIndex: filters.page,
+            pageSize: DATE_EXTENSIONS_PAGE_SIZE,
+            filters: [
+                {
+                    id: 'username',
+                    value: filters.emailOrUsername,
+                },
+                {
+                    id: 'unitTitle',
+                    value: filters.blockId,
+                }
+            ]
+        }, isFilterable: true, numBreakoutFilters: 2, isLoading: isLoading, isPaginated: true, itemCount: data.count, manualFilters: true, manualPagination: true, pageSize: DATE_EXTENSIONS_PAGE_SIZE, pageCount: data.numPages, FilterStatusComponent: DataTable.RowStatus, children: [_jsxs("div", { className: "d-flex justify-content-between align-items-start pt-1 mx-3 mb-3", children: [_jsx(DataTable.TableControlBar, {}), _jsxs(Button, { className: "mt-2.5", onClick: onClickAdd, children: ["+ ", intl.formatMessage(messages.addIndividualExtension)] })] }), _jsx(DataTable.Table, {}), _jsx(DataTable.EmptyTable, { content: intl.formatMessage(messages.noDateExtensions) }), _jsx(DataTable.TableFooter, {})] }));
+};
+export default DateExtensionsList;
+//# sourceMappingURL=DateExtensionsList.js.map

package/dist/dateExtensions/components/DateExtensionsList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateExtensionsList.js","sourceRoot":"","sources":["../../../src/dateExtensions/components/DateExtensionsList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useIntl } from '@openedx/frontend-base';\nimport { Button, DataTable, FormControl, Icon } from '@openedx/paragon';\nimport messages from '../messages';\nimport { LearnerDateExtension } from '../types';\nimport { useDateExtensions } from '../data/apiHook';\nimport { Search } from '@openedx/paragon/icons';\nimport SelectGradedSubsection from './SelectGradedSubsection';\nimport { useDebouncedFilter } from '../../hooks/useDebouncedFilter';\nimport { DataTableFetchDataProps } from '@src/types';\n\nconst DATE_EXTENSIONS_PAGE_SIZE = 25;\n\nexport interface DateExtensionListProps {\n  onResetExtensions?: (user: LearnerDateExtension) => void,\n  onClickAdd?: () => void,\n}\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\"\n      onChange={handleInputChange}\n      placeholder={intl.formatMessage(messages.searchLearnerPlaceholder)}\n      trailingElement={<Icon src={Search} />}\n      value={inputValue}\n    />\n  );\n};\n\nconst GradedSubsectionFilter = ({ 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 handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    handleChange(e.target.value);\n  };\n\n  return (\n    <SelectGradedSubsection\n      placeholder={intl.formatMessage(messages.allGradedSubsections)}\n      onChange={handleSelectChange}\n      value={inputValue}\n    />\n  );\n};\n\nconst DateExtensionsList = ({\n  onResetExtensions = () => {},\n  onClickAdd = () => {},\n}: DateExtensionListProps) => {\n  const intl = useIntl();\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const [filters, setFilters] = useState<{ page: number, emailOrUsername: string, blockId: string }>({\n    page: 0,\n    emailOrUsername: '',\n    blockId: '',\n  });\n\n  const { data = { count: 0, results: [], numPages: 0 }, isLoading } = useDateExtensions(courseId ?? '', {\n    blockId: filters.blockId,\n    emailOrUsername: filters.emailOrUsername,\n    page: filters.page,\n    pageSize: DATE_EXTENSIONS_PAGE_SIZE,\n  });\n\n  const tableColumns = [\n    { accessor: 'username',\n      Header: intl.formatMessage(messages.username),\n      Filter: UsernameFilter,\n    },\n    { accessor: 'fullName', Header: intl.formatMessage(messages.fullname), disableFilters: true, },\n    { accessor: 'email', Header: intl.formatMessage(messages.email), disableFilters: true, },\n    { accessor: 'unitTitle',\n      Header: intl.formatMessage(messages.gradedSubsection),\n      Filter: GradedSubsectionFilter,\n    },\n    {\n      accessor: 'extendedDueDate',\n      Header: intl.formatMessage(messages.extendedDueDate),\n      Cell: ({ value }: { value: string }) => (\n        intl.formatDate(value, { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', timeZone: 'UTC' })\n      ),\n      disableFilters: true,\n    },\n  ];\n\n  const additionalColumns = [{\n    id: 'reset',\n    Header: intl.formatMessage(messages.reset),\n    Cell: ({ row }: { row: { original: LearnerDateExtension } }) => (\n      <Button\n        variant=\"link\"\n        size=\"inline\"\n        onClick={() => onResetExtensions(row.original)}\n      >\n        {intl.formatMessage(messages.resetExtensions)}\n      </Button>\n    )\n  }];\n\n  const handleFetchData = (data: DataTableFetchDataProps) => {\n    const emailOrUsernameFilter = data.filters.find((filter) => filter.id === 'username');\n    const newEmailOrUsername = emailOrUsernameFilter ? emailOrUsernameFilter.value : '';\n    const blockIdFilter = data.filters.find((filter) => filter.id === 'unitTitle');\n    const newBlockId = blockIdFilter ? blockIdFilter.value : '';\n\n    const filterChanged = newEmailOrUsername !== filters.emailOrUsername || newBlockId !== filters.blockId;\n    const pageChanged = data.pageIndex !== filters.page;\n\n    // If filters changed, reset to page 0\n    if (filterChanged) {\n      setFilters({ page: 0, emailOrUsername: newEmailOrUsername, blockId: newBlockId });\n    } else if (pageChanged) {\n      // If only page changed (filters didn't change), update page\n      setFilters({ page: data.pageIndex, emailOrUsername: newEmailOrUsername, blockId: newBlockId });\n    }\n  };\n\n  return (\n    <DataTable\n      columns={tableColumns}\n      additionalColumns={additionalColumns}\n      data={data.results}\n      fetchData={handleFetchData}\n      state={{\n        pageIndex: filters.page,\n        pageSize: DATE_EXTENSIONS_PAGE_SIZE,\n        filters: [\n          {\n            id: 'username',\n            value: filters.emailOrUsername,\n          },\n          {\n            id: 'unitTitle',\n            value: filters.blockId,\n          }\n        ]\n      }}\n      isFilterable\n      numBreakoutFilters={2}\n      isLoading={isLoading}\n      isPaginated\n      itemCount={data.count}\n      manualFilters\n      manualPagination\n      pageSize={DATE_EXTENSIONS_PAGE_SIZE}\n      pageCount={data.numPages}\n      FilterStatusComponent={DataTable.RowStatus}\n    >\n      <div className=\"d-flex justify-content-between align-items-start pt-1 mx-3 mb-3\">\n        <DataTable.TableControlBar />\n        <Button className=\"mt-2.5\" onClick={onClickAdd}>+ {intl.formatMessage(messages.addIndividualExtension)}</Button>\n      </div>\n      <DataTable.Table />\n      <DataTable.EmptyTable content={intl.formatMessage(messages.noDateExtensions)} />\n      <DataTable.TableFooter />\n    </DataTable>\n  );\n};\n\nexport default DateExtensionsList;\n"]}

package/dist/dateExtensions/components/ResetExtensionsModal.d.ts

@@ -0,0 +1,10 @@
+interface ResetExtensionsModalProps {
+    isOpen: boolean;
+    message: string;
+    title: string;
+    onCancelReset: () => void;
+    onClose: () => void;
+    onConfirmReset: () => void;
+}
+declare const ResetExtensionsModal: ({ isOpen, message, title, onCancelReset, onClose, onConfirmReset, }: ResetExtensionsModalProps) => import("react/jsx-runtime").JSX.Element;
+export default ResetExtensionsModal;

package/dist/dateExtensions/components/ResetExtensionsModal.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useIntl } from '@openedx/frontend-base';
+import { ModalDialog, ActionRow, Button } from '@openedx/paragon';
+import messages from '../messages';
+const ResetExtensionsModal = ({ isOpen, message, title, onCancelReset, onClose, onConfirmReset, }) => {
+    const intl = useIntl();
+    return (_jsxs(ModalDialog, { isOpen: isOpen, onClose: onClose, hasCloseButton: false, title: title, isOverflowVisible: false, className: "p-4", children: [_jsx("h4", { className: "mb-2.5", children: title }), _jsx("p", { className: "mb-2.5", children: message }), _jsxs(ActionRow, { children: [_jsx(Button, { variant: "tertiary", onClick: onCancelReset, children: intl.formatMessage(messages.cancel) }), _jsx(Button, { variant: "primary", onClick: onConfirmReset, children: intl.formatMessage(messages.confirm) })] })] }));
+};
+export default ResetExtensionsModal;
+//# sourceMappingURL=ResetExtensionsModal.js.map

package/dist/dateExtensions/components/ResetExtensionsModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResetExtensionsModal.js","sourceRoot":"","sources":["../../../src/dateExtensions/components/ResetExtensionsModal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAClE,OAAO,QAAQ,MAAM,aAAa,CAAC;AAWnC,MAAM,oBAAoB,GAAG,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,KAAK,EACL,aAAa,EACb,OAAO,EACP,cAAc,GACY,EAAE,EAAE;IAC9B,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,OAAO,CACL,MAAC,WAAW,IAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,SAAS,EAAC,KAAK,aAC3H,aAAI,SAAS,EAAC,QAAQ,YAAE,KAAK,GAAM,EACnC,YAAG,SAAS,EAAC,QAAQ,YAAE,OAAO,GAAK,EACnC,MAAC,SAAS,eACR,KAAC,MAAM,IAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,aAAa,YAAG,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAU,EACjG,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,cAAc,YAAG,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,GAAU,IACxF,IACA,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["import { useIntl } from '@openedx/frontend-base';\nimport { ModalDialog, ActionRow, Button } from '@openedx/paragon';\nimport messages from '../messages';\n\ninterface ResetExtensionsModalProps {\n  isOpen: boolean,\n  message: string,\n  title: string,\n  onCancelReset: () => void,\n  onClose: () => void,\n  onConfirmReset: () => void,\n}\n\nconst ResetExtensionsModal = ({\n  isOpen,\n  message,\n  title,\n  onCancelReset,\n  onClose,\n  onConfirmReset,\n}: ResetExtensionsModalProps) => {\n  const intl = useIntl();\n  return (\n    <ModalDialog isOpen={isOpen} onClose={onClose} hasCloseButton={false} title={title} isOverflowVisible={false} className=\"p-4\">\n      <h4 className=\"mb-2.5\">{title}</h4>\n      <p className=\"mb-2.5\">{message}</p>\n      <ActionRow>\n        <Button variant=\"tertiary\" onClick={onCancelReset}>{intl.formatMessage(messages.cancel)}</Button>\n        <Button variant=\"primary\" onClick={onConfirmReset}>{intl.formatMessage(messages.confirm)}</Button>\n      </ActionRow>\n    </ModalDialog>\n  );\n};\n\nexport default ResetExtensionsModal;\n"]}

package/dist/dateExtensions/components/SelectGradedSubsection.d.ts

@@ -0,0 +1,8 @@
+interface SelectGradedSubsectionProps {
+    label?: string;
+    placeholder: string;
+    value?: string;
+    onChange: (event: React.ChangeEvent<HTMLSelectElement>) => void;
+}
+declare const SelectGradedSubsection: ({ label, placeholder, value, onChange }: SelectGradedSubsectionProps) => import("react/jsx-runtime").JSX.Element;
+export default SelectGradedSubsection;

package/dist/dateExtensions/components/SelectGradedSubsection.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useParams } from 'react-router-dom';
+import { FormLabel, FormControl, FormGroup } from '@openedx/paragon';
+import { useGradedSubsections } from '../data/apiHook';
+const SelectGradedSubsection = ({ label, placeholder, value, onChange }) => {
+    const { courseId = '' } = useParams();
+    const { data = { items: [] } } = useGradedSubsections(courseId);
+    const selectOptions = [{ displayName: placeholder, subsectionId: '' }, ...data.items];
+    const handleChange = (event) => {
+        onChange(event);
+    };
+    return (_jsxs(FormGroup, { className: "mb-0", size: "sm", children: [label && _jsx(FormLabel, { children: label }), _jsx(FormControl, { as: "select", name: "blockId", placeholder: placeholder, size: "md", value: value, onChange: handleChange, children: selectOptions.map((option) => (_jsx("option", { value: option.subsectionId, children: option.displayName }, option.subsectionId))) })] }));
+};
+export default SelectGradedSubsection;
+//# sourceMappingURL=SelectGradedSubsection.js.map

package/dist/dateExtensions/components/SelectGradedSubsection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectGradedSubsection.js","sourceRoot":"","sources":["../../../src/dateExtensions/components/SelectGradedSubsection.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AASvD,MAAM,sBAAsB,GAAG,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAA+B,EAAE,EAAE;IACtG,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,SAAS,EAAwB,CAAC;IAC5D,MAAM,EAAE,IAAI,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IAChE,MAAM,aAAa,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,EAAE,EAAE,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;IAEtF,MAAM,YAAY,GAAG,CAAC,KAA2C,EAAE,EAAE;QACnE,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,SAAS,IAAC,SAAS,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,aAClC,KAAK,IAAI,KAAC,SAAS,cAAE,KAAK,GAAa,EACxC,KAAC,WAAW,IACV,EAAE,EAAC,QAAQ,EACX,IAAI,EAAC,SAAS,EACd,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,YAAY,YAGpB,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC5B,iBAAkC,KAAK,EAAE,MAAM,CAAC,YAAY,YACzD,MAAM,CAAC,WAAW,IADR,MAAM,CAAC,YAAY,CAEvB,CACV,CAAC,GAEQ,IACJ,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import { useParams } from 'react-router-dom';\nimport { FormLabel, FormControl, FormGroup } from '@openedx/paragon';\nimport { useGradedSubsections } from '../data/apiHook';\n\ninterface SelectGradedSubsectionProps {\n  label?: string,\n  placeholder: string,\n  value?: string,\n  onChange: (event: React.ChangeEvent<HTMLSelectElement>) => void,\n}\n\nconst SelectGradedSubsection = ({ label, placeholder, value, onChange }: SelectGradedSubsectionProps) => {\n  const { courseId = '' } = useParams<{ courseId: string }>();\n  const { data = { items: [] } } = useGradedSubsections(courseId);\n  const selectOptions = [{ displayName: placeholder, subsectionId: '' }, ...data.items];\n\n  const handleChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    onChange(event);\n  };\n\n  return (\n    <FormGroup className=\"mb-0\" size=\"sm\">\n      {label && <FormLabel>{label}</FormLabel>}\n      <FormControl\n        as=\"select\"\n        name=\"blockId\"\n        placeholder={placeholder}\n        size=\"md\"\n        value={value}\n        onChange={handleChange}\n      >\n        {\n          selectOptions.map((option) => (\n            <option key={option.subsectionId} value={option.subsectionId}>\n              {option.displayName}\n            </option>\n          ))\n        }\n      </FormControl>\n    </FormGroup>\n  );\n};\n\nexport default SelectGradedSubsection;\n"]}

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

@@ -0,0 +1,6 @@
+import { AddDateExtensionParams, DateExtensionQueryParams, LearnerDateExtension, ResetDueDateParams } from '../types';
+import { DataList } from '../../types';
+export declare const getDateExtensions: (courseId: string, params: DateExtensionQueryParams) => Promise<DataList<LearnerDateExtension>>;
+export declare const resetDateExtension: (courseId: string, params: ResetDueDateParams) => Promise<any>;
+export declare const addDateExtension: (courseId: string, extensionData: AddDateExtensionParams) => Promise<any>;
+export declare const getGradedSubsections: (courseId: string) => Promise<any>;

package/dist/dateExtensions/data/api.js

@@ -0,0 +1,40 @@
+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, snakeCaseObject } from '@openedx/frontend-base';
+import { getApiBaseUrl } from '../../data/api';
+export const getDateExtensions = (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.blockId) {
+        const blockId = encodeURI(params.blockId);
+        queryParams.append('block_id', blockId);
+    }
+    const { data } = yield getAuthenticatedHttpClient().get(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/unit_extensions?${queryParams.toString()}`);
+    return camelCaseObject(data);
+});
+export const resetDateExtension = (courseId, params) => __awaiter(void 0, void 0, void 0, function* () {
+    const { data } = yield getAuthenticatedHttpClient().post(`${getApiBaseUrl()}/courses/${courseId}/instructor/api/reset_due_date`, params);
+    return camelCaseObject(data);
+});
+export const addDateExtension = (courseId, extensionData) => __awaiter(void 0, void 0, void 0, function* () {
+    const snakeCaseData = snakeCaseObject(extensionData);
+    const { data } = yield getAuthenticatedHttpClient().post(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/change_due_date`, snakeCaseData);
+    return camelCaseObject(data);
+});
+export const getGradedSubsections = (courseId) => __awaiter(void 0, void 0, void 0, function* () {
+    const { data } = yield getAuthenticatedHttpClient().get(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/graded_subsections`);
+    return camelCaseObject(data);
+});
+//# sourceMappingURL=api.js.map

package/dist/dateExtensions/data/api.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.js","sourceRoot":"","sources":["../../../src/dateExtensions/data/api.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,eAAe,EAAE,0BAA0B,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACtG,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAI/C,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,QAAgB,EAChB,MAAgC,EACS,EAAE;IAC3C,MAAM,WAAW,GAAG,IAAI,eAAe,CAAC;QACtC,IAAI,EAAE,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE;QAClC,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,QAAQ,EAAE;KACtC,CAAC,CAAC;IAEH,IAAI,MAAM,CAAC,eAAe,EAAE,CAAC;QAC3B,WAAW,CAAC,MAAM,CAAC,mBAAmB,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC;IAClE,CAAC;IAED,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC;QACnB,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QAC1C,WAAW,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IAC1C,CAAC;IAED,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,0BAA0B,EAAE,CAAC,GAAG,CACrD,GAAG,aAAa,EAAE,8BAA8B,QAAQ,oBAAoB,WAAW,CAAC,QAAQ,EAAE,EAAE,CACrG,CAAC;IACF,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC;AAC/B,CAAC,CAAA,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAO,QAAgB,EAAE,MAA0B,EAAE,EAAE;IACvF,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,0BAA0B,EAAE,CAAC,IAAI,CAAC,GAAG,aAAa,EAAE,YAAY,QAAQ,gCAAgC,EAAE,MAAM,CAAC,CAAC;IACzI,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC;AAC/B,CAAC,CAAA,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAO,QAAgB,EAAE,aAAqC,EAAE,EAAE;IAChG,MAAM,aAAa,GAAG,eAAe,CAAC,aAAa,CAAC,CAAC;IACrD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,0BAA0B,EAAE,CAAC,IAAI,CAAC,GAAG,aAAa,EAAE,8BAA8B,QAAQ,kBAAkB,EAAE,aAAa,CAAC,CAAC;IACpJ,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC;AAC/B,CAAC,CAAA,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAO,QAAgB,EAAE,EAAE;IAC7D,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,0BAA0B,EAAE,CAAC,GAAG,CACrD,GAAG,aAAa,EAAE,8BAA8B,QAAQ,qBAAqB,CAC9E,CAAC;IACF,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC;AAC/B,CAAC,CAAA,CAAC","sourcesContent":["import { camelCaseObject, getAuthenticatedHttpClient, snakeCaseObject } from '@openedx/frontend-base';\nimport { getApiBaseUrl } from '../../data/api';\nimport { AddDateExtensionParams, DateExtensionQueryParams, LearnerDateExtension, ResetDueDateParams } from '../types';\nimport { DataList } from '@src/types';\n\nexport const getDateExtensions = async (\n  courseId: string,\n  params: DateExtensionQueryParams\n): Promise<DataList<LearnerDateExtension>> => {\n  const queryParams = new URLSearchParams({\n    page: (params.page + 1).toString(),\n    page_size: params.pageSize.toString(),\n  });\n\n  if (params.emailOrUsername) {\n    queryParams.append('email_or_username', params.emailOrUsername);\n  }\n\n  if (params.blockId) {\n    const blockId = encodeURI(params.blockId);\n    queryParams.append('block_id', blockId);\n  }\n\n  const { data } = await getAuthenticatedHttpClient().get(\n    `${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/unit_extensions?${queryParams.toString()}`\n  );\n  return camelCaseObject(data);\n};\n\nexport const resetDateExtension = async (courseId: string, params: ResetDueDateParams) => {\n  const { data } = await getAuthenticatedHttpClient().post(`${getApiBaseUrl()}/courses/${courseId}/instructor/api/reset_due_date`, params);\n  return camelCaseObject(data);\n};\n\nexport const addDateExtension = async (courseId: string, extensionData: AddDateExtensionParams) => {\n  const snakeCaseData = snakeCaseObject(extensionData);\n  const { data } = await getAuthenticatedHttpClient().post(`${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/change_due_date`, snakeCaseData);\n  return camelCaseObject(data);\n};\n\nexport const getGradedSubsections = async (courseId: string) => {\n  const { data } = await getAuthenticatedHttpClient().get(\n    `${getApiBaseUrl()}/api/instructor/v2/courses/${courseId}/graded_subsections`\n  );\n  return camelCaseObject(data);\n};\n"]}

package/dist/dateExtensions/data/apiHook.d.ts

@@ -0,0 +1,11 @@
+import { DateExtensionQueryParams, ResetDueDateParams } from '../types';
+export declare const useDateExtensions: (courseId: string, params: DateExtensionQueryParams) => import("@tanstack/react-query").UseQueryResult<import("../../types").DataList<import("../types").LearnerDateExtension>, Error>;
+export declare const useResetDateExtensionMutation: () => import("@tanstack/react-query").UseMutationResult<any, Error, {
+    courseId: string;
+    params: ResetDueDateParams;
+}, unknown>;
+export declare const useAddDateExtensionMutation: () => import("@tanstack/react-query").UseMutationResult<any, Error, {
+    courseId: string;
+    extensionData: any;
+}, unknown>;
+export declare const useGradedSubsections: (courseId: string) => import("@tanstack/react-query").UseQueryResult<any, Error>;

package/dist/dateExtensions/data/apiHook.js

@@ -0,0 +1,31 @@
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { getDateExtensions, resetDateExtension, addDateExtension, getGradedSubsections } from './api';
+import { dateExtensionsQueryKeys, gradedSubsectionsQueryKeys } from './queryKeys';
+export const useDateExtensions = (courseId, params) => (useQuery({
+    queryKey: dateExtensionsQueryKeys.byCoursePaginated(courseId, params),
+    queryFn: () => getDateExtensions(courseId, params),
+    enabled: !!courseId,
+}));
+export const useResetDateExtensionMutation = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ courseId, params }) => resetDateExtension(courseId, params),
+        onSuccess: (_, { courseId }) => {
+            queryClient.invalidateQueries({ queryKey: dateExtensionsQueryKeys.byCourse(courseId), exact: false });
+        },
+    });
+};
+export const useAddDateExtensionMutation = () => {
+    const queryClient = useQueryClient();
+    return useMutation({
+        mutationFn: ({ courseId, extensionData }) => addDateExtension(courseId, extensionData),
+        onSuccess: ({ courseId }) => {
+            queryClient.invalidateQueries({ queryKey: dateExtensionsQueryKeys.byCourse(courseId) });
+        },
+    });
+};
+export const useGradedSubsections = (courseId) => (useQuery({
+    queryKey: gradedSubsectionsQueryKeys.byCourse(courseId),
+    queryFn: () => getGradedSubsections(courseId),
+}));
+//# sourceMappingURL=apiHook.js.map

package/dist/dateExtensions/data/apiHook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"apiHook.js","sourceRoot":"","sources":["../../../src/dateExtensions/data/apiHook.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAC9E,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AACtG,OAAO,EAAE,uBAAuB,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAGlF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,MAAgC,EAAE,EAAE,CAAC,CACvF,QAAQ,CAAC;IACP,QAAQ,EAAE,uBAAuB,CAAC,iBAAiB,CAAC,QAAQ,EAAE,MAAM,CAAC;IACrE,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,QAAQ,EAAE,MAAM,CAAC;IAClD,OAAO,EAAE,CAAC,CAAC,QAAQ;CACpB,CAAC,CACH,CAAC;AAEF,MAAM,CAAC,MAAM,6BAA6B,GAAG,GAAG,EAAE;IAChD,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,OAAO,WAAW,CAAC;QACjB,UAAU,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAoD,EAAE,EAAE,CACrF,kBAAkB,CAAC,QAAQ,EAAE,MAAM,CAAC;QACtC,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;YAC7B,WAAW,CAAC,iBAAiB,CAAC,EAAE,QAAQ,EAAE,uBAAuB,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;QACxG,CAAC;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG,GAAG,EAAE;IAC9C,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,OAAO,WAAW,CAAC;QACjB,UAAU,EAAE,CAAC,EAAE,QAAQ,EAAE,aAAa,EAA4C,EAAE,EAAE,CACpF,gBAAgB,CAAC,QAAQ,EAAE,aAAa,CAAC;QAC3C,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;YAC1B,WAAW,CAAC,iBAAiB,CAAC,EAAE,QAAQ,EAAE,uBAAuB,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC1F,CAAC;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,QAAgB,EAAE,EAAE,CAAC,CACxD,QAAQ,CAAC;IACP,QAAQ,EAAE,0BAA0B,CAAC,QAAQ,CAAC,QAAQ,CAAC;IACvD,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,QAAQ,CAAC;CAC9C,CAAC,CACH,CAAC","sourcesContent":["import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { getDateExtensions, resetDateExtension, addDateExtension, getGradedSubsections } from './api';\nimport { dateExtensionsQueryKeys, gradedSubsectionsQueryKeys } from './queryKeys';\nimport { DateExtensionQueryParams, ResetDueDateParams } from '../types';\n\nexport const useDateExtensions = (courseId: string, params: DateExtensionQueryParams) => (\n  useQuery({\n    queryKey: dateExtensionsQueryKeys.byCoursePaginated(courseId, params),\n    queryFn: () => getDateExtensions(courseId, params),\n    enabled: !!courseId,\n  })\n);\n\nexport const useResetDateExtensionMutation = () => {\n  const queryClient = useQueryClient();\n  return useMutation({\n    mutationFn: ({ courseId, params }: { courseId: string, params: ResetDueDateParams }) =>\n      resetDateExtension(courseId, params),\n    onSuccess: (_, { courseId }) => {\n      queryClient.invalidateQueries({ queryKey: dateExtensionsQueryKeys.byCourse(courseId), exact: false });\n    },\n  });\n};\n\nexport const useAddDateExtensionMutation = () => {\n  const queryClient = useQueryClient();\n  return useMutation({\n    mutationFn: ({ courseId, extensionData }: { courseId: string, extensionData: any }) =>\n      addDateExtension(courseId, extensionData),\n    onSuccess: ({ courseId }) => {\n      queryClient.invalidateQueries({ queryKey: dateExtensionsQueryKeys.byCourse(courseId) });\n    },\n  });\n};\n\nexport const useGradedSubsections = (courseId: string) => (\n  useQuery({\n    queryKey: gradedSubsectionsQueryKeys.byCourse(courseId),\n    queryFn: () => getGradedSubsections(courseId),\n  })\n);\n"]}

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

@@ -0,0 +1,10 @@
+import { DateExtensionQueryParams } from '../types';
+export declare const dateExtensionsQueryKeys: {
+    all: readonly ["org.openedx.frontend.app.instructor", "dateExtensions"];
+    byCourse: (courseId: string) => readonly ["org.openedx.frontend.app.instructor", "dateExtensions", string];
+    byCoursePaginated: (courseId: string, params: DateExtensionQueryParams) => readonly ["org.openedx.frontend.app.instructor", "dateExtensions", string, number, number, string, string];
+};
+export declare const gradedSubsectionsQueryKeys: {
+    all: readonly ["org.openedx.frontend.app.instructor", "gradedSubsections"];
+    byCourse: (courseId: string) => readonly ["org.openedx.frontend.app.instructor", "gradedSubsections", string];
+};

package/dist/dateExtensions/data/queryKeys.js

@@ -0,0 +1,17 @@
+import { appId } from '../../constants';
+export const dateExtensionsQueryKeys = {
+    all: [appId, 'dateExtensions'],
+    byCourse: (courseId) => [...dateExtensionsQueryKeys.all, courseId],
+    byCoursePaginated: (courseId, params) => [
+        ...dateExtensionsQueryKeys.byCourse(courseId),
+        params.page,
+        params.pageSize,
+        params.emailOrUsername || '',
+        params.blockId || ''
+    ],
+};
+export const gradedSubsectionsQueryKeys = {
+    all: [appId, 'gradedSubsections'],
+    byCourse: (courseId) => [...gradedSubsectionsQueryKeys.all, courseId],
+};
+//# sourceMappingURL=queryKeys.js.map

package/dist/dateExtensions/data/queryKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"queryKeys.js","sourceRoot":"","sources":["../../../src/dateExtensions/data/queryKeys.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAGxC,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,GAAG,EAAE,CAAC,KAAK,EAAE,gBAAgB,CAAU;IACvC,QAAQ,EAAE,CAAC,QAAgB,EAAE,EAAE,CAAC,CAAC,GAAG,uBAAuB,CAAC,GAAG,EAAE,QAAQ,CAAU;IACnF,iBAAiB,EAAE,CACjB,QAAgB,EAChB,MAAgC,EAChC,EAAE,CAAC;QACH,GAAG,uBAAuB,CAAC,QAAQ,CAAC,QAAQ,CAAC;QAC7C,MAAM,CAAC,IAAI;QACX,MAAM,CAAC,QAAQ;QACf,MAAM,CAAC,eAAe,IAAI,EAAE;QAC5B,MAAM,CAAC,OAAO,IAAI,EAAE;KACZ;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG;IACxC,GAAG,EAAE,CAAC,KAAK,EAAE,mBAAmB,CAAU;IAC1C,QAAQ,EAAE,CAAC,QAAgB,EAAE,EAAE,CAAC,CAAC,GAAG,0BAA0B,CAAC,GAAG,EAAE,QAAQ,CAAU;CACvF,CAAC","sourcesContent":["import { appId } from '../../constants';\nimport { DateExtensionQueryParams } from '../types';\n\nexport const dateExtensionsQueryKeys = {\n  all: [appId, 'dateExtensions'] as const,\n  byCourse: (courseId: string) => [...dateExtensionsQueryKeys.all, courseId] as const,\n  byCoursePaginated: (\n    courseId: string,\n    params: DateExtensionQueryParams\n  ) => [\n    ...dateExtensionsQueryKeys.byCourse(courseId),\n    params.page,\n    params.pageSize,\n    params.emailOrUsername || '',\n    params.blockId || ''\n  ] as const,\n};\n\nexport const gradedSubsectionsQueryKeys = {\n  all: [appId, 'gradedSubsections'] as const,\n  byCourse: (courseId: string) => [...gradedSubsectionsQueryKeys.all, courseId] as const,\n};\n"]}

package/dist/dateExtensions/messages.d.ts

@@ -0,0 +1,128 @@
+declare const messages: {
+    dateExtensionsTitle: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    addIndividualExtension: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    username: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    fullname: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    email: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    gradedSubsection: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    extendedDueDate: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    reset: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    resetExtensions: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    resetConfirmationHeader: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    resetConfirmationMessage: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    cancel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    confirm: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    close: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    missingUserOrCourseIdError: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    addIndividualDueDateExtension: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    addExtension: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    extensionInstructions: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    defineExtension: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    extensionDate: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    reasonForExtension: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    selectGradedSubsection: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    allGradedSubsections: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    searchLearnerPlaceholder: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    noDateExtensions: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export default messages;