chore: run d2 migrate script

d2.config.js

@@ -28,7 +28,7 @@ const config = {
     },
 
     entryPoints: {
-        app: './src/AppWrapper.js',
+        app: './src/AppWrapper.jsx',
     },
 }
 

src/AppWrapper.js → src/AppWrapper.jsx

@@ -3,10 +3,10 @@ import { useDataEngine } from '@dhis2/app-runtime'
 import { D2Shim } from '@dhis2/app-runtime-adapter-d2'
 import React from 'react'
 import { Provider as ReduxProvider } from 'react-redux'
-import App from './components/App.js'
-import SystemSettingsProvider from './components/SystemSettingsProvider.js'
-import UserSettingsProvider from './components/UserSettingsProvider.js'
-import WindowDimensionsProvider from './components/WindowDimensionsProvider.js'
+import App from './components/App.jsx'
+import SystemSettingsProvider from './components/SystemSettingsProvider.jsx'
+import UserSettingsProvider from './components/UserSettingsProvider.jsx'
+import WindowDimensionsProvider from './components/WindowDimensionsProvider.jsx'
 import configureStore from './configureStore.js'
 
 import './locales/index.js'

src/__tests__/AppWrapper.spec.js → src/__tests__/AppWrapper.spec.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
-import AppWrapper from '../AppWrapper.js'
+import AppWrapper from '../AppWrapper.jsx'
 
 jest.mock('@dhis2/analytics', () => ({
     ...jest.requireActual('@dhis2/analytics'),

src/components/App.js → src/components/App.jsx

@@ -19,7 +19,7 @@ import { NewDashboard, EditDashboard } from '../pages/edit/index.js'
 import { PrintDashboard, PrintLayoutDashboard } from '../pages/print/index.js'
 import { LandingPage, ROUTE_START_PATH } from '../pages/start/index.js'
 import { ViewDashboard } from '../pages/view/index.js'
-import { useSystemSettings } from './SystemSettingsProvider.js'
+import { useSystemSettings } from './SystemSettingsProvider.jsx'
 import './styles/App.css'
 import 'react-grid-layout/css/styles.css'
 import 'react-resizable/css/styles.css'

src/components/DashboardsBar/Chip.js → src/components/DashboardsBar/Chip.jsx

@@ -7,7 +7,7 @@ import React from 'react'
 import { Link } from 'react-router-dom'
 import { apiPostDataStatistics } from '../../api/dataStatistics.js'
 import { useCacheableSection } from '../../modules/useCacheableSection.js'
-import { OfflineSaved } from './assets/icons.js'
+import { OfflineSaved } from './assets/icons.jsx'
 import classes from './styles/Chip.module.css'
 
 const Chip = ({ starred, selected, label, dashboardId, onClick }) => {

src/components/DashboardsBar/ClearButton.js → src/components/DashboardsBar/ClearButton.jsx

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types'
 import React from 'react'
-import ClearIcon from './assets/Clear.js'
+import ClearIcon from './assets/Clear.jsx'
 import classes from './styles/ClearButton.module.css'
 
 const ClearButton = ({ onClear }) => (

src/components/DashboardsBar/Content.js → src/components/DashboardsBar/Content.jsx

@@ -9,8 +9,8 @@ import { Redirect, withRouter } from 'react-router-dom'
 import { sGetAllDashboards } from '../../reducers/dashboards.js'
 import { sGetDashboardsFilter } from '../../reducers/dashboardsFilter.js'
 import { sGetSelectedId } from '../../reducers/selected.js'
-import Chip from './Chip.js'
-import Filter from './Filter.js'
+import Chip from './Chip.jsx'
+import Filter from './Filter.jsx'
 import { getFilteredDashboards } from './getFilteredDashboards.js'
 import classes from './styles/Content.module.css'
 

src/components/DashboardsBar/DashboardsBar.js → src/components/DashboardsBar/DashboardsBar.jsx

@@ -10,12 +10,12 @@ import React, {
 import { connect } from 'react-redux'
 import { acSetControlBarUserRows } from '../../actions/controlBar.js'
 import { apiPostControlBarRows } from '../../api/controlBar.js'
-import { useWindowDimensions } from '../../components/WindowDimensionsProvider.js'
+import { useWindowDimensions } from '../../components/WindowDimensionsProvider.jsx'
 import { sGetControlBarUserRows } from '../../reducers/controlBar.js'
-import Content from './Content.js'
-import DragHandle from './DragHandle.js'
+import Content from './Content.jsx'
+import DragHandle from './DragHandle.jsx'
 import { getRowsFromHeight } from './getRowsFromHeight.js'
-import ShowMoreButton from './ShowMoreButton.js'
+import ShowMoreButton from './ShowMoreButton.jsx'
 import classes from './styles/DashboardsBar.module.css'
 
 export const MIN_ROW_COUNT = 1

src/components/DashboardsBar/Filter.js → src/components/DashboardsBar/Filter.jsx

@@ -10,8 +10,8 @@ import {
 } from '../../actions/dashboardsFilter.js'
 import { isSmallScreen } from '../../modules/smallScreen.js'
 import { sGetDashboardsFilter } from '../../reducers/dashboardsFilter.js'
-import { useWindowDimensions } from '../WindowDimensionsProvider.js'
-import ClearButton from './ClearButton.js'
+import { useWindowDimensions } from '../WindowDimensionsProvider.jsx'
+import ClearButton from './ClearButton.jsx'
 import classes from './styles/Filter.module.css'
 
 export const KEYCODE_ENTER = 13

src/components/DashboardsBar/ShowMoreButton.js → src/components/DashboardsBar/ShowMoreButton.jsx

@@ -2,7 +2,7 @@ import i18n from '@dhis2/d2-i18n'
 import { Tooltip } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React, { useRef } from 'react'
-import { ChevronDown, ChevronUp } from './assets/icons.js'
+import { ChevronDown, ChevronUp } from './assets/icons.jsx'
 import classes from './styles/ShowMoreButton.module.css'
 
 const ShowMoreButton = ({ onClick, dashboardBarIsExpanded, disabled }) => {

src/components/DashboardsBar/__tests__/Chip.spec.js → src/components/DashboardsBar/__tests__/Chip.spec.jsx

@@ -3,7 +3,7 @@ import { render } from '@testing-library/react'
 import { createMemoryHistory } from 'history'
 import React from 'react'
 import { Router } from 'react-router-dom'
-import Chip from '../Chip.js'
+import Chip from '../Chip.jsx'
 
 /* eslint-disable react/prop-types */
 jest.mock('@dhis2/ui', () => {

src/components/DashboardsBar/__tests__/ClearButton.spec.js → src/components/DashboardsBar/__tests__/ClearButton.spec.jsx

@@ -1,6 +1,6 @@
 import { render } from '@testing-library/react'
 import React from 'react'
-import ClearButton from '../ClearButton.js'
+import ClearButton from '../ClearButton.jsx'
 
 test('ClearButton renders a button', () => {
     const { container } = render(<ClearButton onClear={jest.fn()} />)

src/components/DashboardsBar/__tests__/DashboardsBar.spec.js → src/components/DashboardsBar/__tests__/DashboardsBar.spec.jsx

@@ -5,11 +5,11 @@ import React from 'react'
 import { Provider } from 'react-redux'
 import { Router } from 'react-router-dom'
 import configureMockStore from 'redux-mock-store'
-import WindowDimensionsProvider from '../../../components/WindowDimensionsProvider.js'
+import WindowDimensionsProvider from '../../../components/WindowDimensionsProvider.jsx'
 import DashboardsBar, {
     MIN_ROW_COUNT,
     MAX_ROW_COUNT,
-} from '../DashboardsBar.js'
+} from '../DashboardsBar.jsx'
 
 jest.mock('@dhis2/analytics', () => ({
     useCachedDataQuery: () => ({

src/components/DashboardsBar/__tests__/Filter.spec.js → src/components/DashboardsBar/__tests__/Filter.spec.jsx

@@ -2,8 +2,8 @@ import { render } from '@testing-library/react'
 import React from 'react'
 import { Provider } from 'react-redux'
 import configureMockStore from 'redux-mock-store'
-import WindowDimensionsProvider from '../../../components/WindowDimensionsProvider.js'
-import Filter from '../Filter.js'
+import WindowDimensionsProvider from '../../../components/WindowDimensionsProvider.jsx'
+import Filter from '../Filter.jsx'
 
 const mockStore = configureMockStore()
 

src/components/DashboardsBar/__tests__/ShowMoreButton.spec.js → src/components/DashboardsBar/__tests__/ShowMoreButton.spec.jsx

@@ -1,7 +1,7 @@
 import { fireEvent } from '@testing-library/dom'
 import { render } from '@testing-library/react'
 import React from 'react'
-import ShowMoreButton from '../ShowMoreButton.js'
+import ShowMoreButton from '../ShowMoreButton.jsx'
 
 describe('ShowMoreButton', () => {
     it('renders correctly when at maxHeight', () => {

src/components/DropdownButton/DropdownButton.js → src/components/DropdownButton/DropdownButton.jsx

@@ -2,7 +2,7 @@ import { OfflineTooltip } from '@dhis2/analytics'
 import { Button, Layer, Popper } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React, { useRef } from 'react'
-import { ArrowDown, ArrowUp } from './assets/Arrow.js'
+import { ArrowDown, ArrowUp } from './assets/Arrow.jsx'
 import styles from './DropdownButton.module.css'
 
 const DropdownButton = ({

src/components/Item/AppItem/Item.js → src/components/Item/AppItem/Item.jsx

@@ -7,7 +7,7 @@ import {
     sGetItemFiltersRoot,
     DEFAULT_STATE_ITEM_FILTERS,
 } from '../../../reducers/itemFilters.js'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
 import { getIframeSrc } from './getIframeSrc.js'
 
 const AppItem = ({ dashboardMode, item, itemFilters, apps }) => {

src/components/Item/AppItem/__tests__/Item.spec.js → src/components/Item/AppItem/__tests__/Item.spec.jsx

@@ -2,7 +2,7 @@ import { render } from '@testing-library/react'
 import React from 'react'
 import { Provider } from 'react-redux'
 import configureMockStore from 'redux-mock-store'
-import Item from '../Item.js'
+import Item from '../Item.jsx'
 
 jest.mock('@dhis2/analytics', () => ({
     useCachedDataQuery: () => ({

src/components/Item/Item.js → src/components/Item/Item.jsx

@@ -20,15 +20,15 @@ import {
     PAGEBREAK,
     PRINT_TITLE_PAGE,
 } from '../../modules/itemTypes.js'
-import AppItem from './AppItem/Item.js'
-import ListItem from './ListItem/Item.js'
-import MessagesItem from './MessagesItem/Item.js'
-import NotSupportedItem from './NotSupportedItem/Item.js'
-import PageBreakItem from './PageBreakItem/Item.js'
-import PrintTitlePageItem from './PrintTitlePageItem/Item.js'
-import SpacerItem from './SpacerItem/Item.js'
-import TextItem from './TextItem/Item.js'
-import VisualizationItem from './VisualizationItem/Item.js'
+import AppItem from './AppItem/Item.jsx'
+import ListItem from './ListItem/Item.jsx'
+import MessagesItem from './MessagesItem/Item.jsx'
+import NotSupportedItem from './NotSupportedItem/Item.jsx'
+import PageBreakItem from './PageBreakItem/Item.jsx'
+import PrintTitlePageItem from './PrintTitlePageItem/Item.jsx'
+import SpacerItem from './SpacerItem/Item.jsx'
+import TextItem from './TextItem/Item.jsx'
+import VisualizationItem from './VisualizationItem/Item.jsx'
 
 const getGridItem = (type) => {
     switch (type) {

src/components/Item/ItemHeader/EditItemActions.js → src/components/Item/ItemHeader/EditItemActions.jsx

@@ -9,7 +9,7 @@ import {
     sGetEditDashboardItems,
     sGetLayoutColumns,
 } from '../../../reducers/editDashboard.js'
-import DeleteItemButton from './DeleteItemButton.js'
+import DeleteItemButton from './DeleteItemButton.jsx'
 import classes from './styles/ItemHeader.module.css'
 
 const EditItemActions = ({ itemId, onDeleteItem }) => {

src/components/Item/ItemHeader/ItemHeader.js → src/components/Item/ItemHeader/ItemHeader.jsx

@@ -2,11 +2,11 @@ import PropTypes from 'prop-types'
 import React from 'react'
 import { connect } from 'react-redux'
 import { VIEW, EDIT, PRINT_LAYOUT } from '../../../modules/dashboardModes.js'
-import EditItemActions from './EditItemActions.js'
-import PrintItemInfo from './PrintItemInfo.js'
+import EditItemActions from './EditItemActions.jsx'
+import PrintItemInfo from './PrintItemInfo.jsx'
 import classes from './styles/ItemHeader.module.css'
-import ViewItemActions from './ViewItemActions.js'
-import ViewItemTags from './ViewItemTags.js'
+import ViewItemActions from './ViewItemActions.jsx'
+import ViewItemTags from './ViewItemTags.jsx'
 
 const getItemActionsMap = (isShortened) => {
     return {

src/components/Item/ListItem/Item.js → src/components/Item/ListItem/Item.jsx

@@ -11,7 +11,7 @@ import {
 import { isEditMode } from '../../../modules/dashboardModes.js'
 import { itemTypeMap, getItemUrl } from '../../../modules/itemTypes.js'
 import { orArray } from '../../../modules/util.js'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
 import classes from './Item.module.css'
 
 const getItemTitle = (item) => itemTypeMap[item.type].pluralTitle

src/components/Item/MessagesItem/Item.js → src/components/Item/MessagesItem/Item.jsx

@@ -6,8 +6,8 @@ import React from 'react'
 import { connect } from 'react-redux'
 import { isViewMode } from '../../../modules/dashboardModes.js'
 import { sGetMessagesRoot } from '../../../reducers/messages.js'
-import { useUserSettings } from '../../UserSettingsProvider.js'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
+import { useUserSettings } from '../../UserSettingsProvider.jsx'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
 import { getFormattedDate } from './getFormattedDate.js'
 import classes from './styles/Item.module.css'
 import './MessagesItem.css'

src/components/Item/NotSupportedItem/Item.js → src/components/Item/NotSupportedItem/Item.jsx

@@ -2,7 +2,7 @@ import i18n from '@dhis2/d2-i18n'
 import { colors, IconQuestion24 } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React from 'react'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
 
 const NotSupportedItem = ({ item, dashboardMode }) => {
     const message = item.type

src/components/Item/SpacerItem/Item.js → src/components/Item/SpacerItem/Item.jsx

@@ -2,7 +2,7 @@ import i18n from '@dhis2/d2-i18n'
 import { colors } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React from 'react'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
 
 const style = {
     margin: '21px 28px',

src/components/Item/TextItem/Item.js → src/components/Item/TextItem/Item.jsx

@@ -12,8 +12,8 @@ import {
     sGetPrintDashboardItems,
 } from '../../../reducers/printDashboard.js'
 import { sGetSelectedDashboardItems } from '../../../reducers/selected.js'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
-import PrintItemInfo from '../ItemHeader/PrintItemInfo.js'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
+import PrintItemInfo from '../ItemHeader/PrintItemInfo.jsx'
 
 const style = {
     textDiv: {

src/components/Item/VisualizationItem/FatalErrorBoundary.js → src/components/Item/VisualizationItem/FatalErrorBoundary.jsx

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types'
 import React from 'react'
-import { Warning } from './assets/icons.js'
+import { Warning } from './assets/icons.jsx'
 import classes from './styles/FatalErrorBoundary.module.css'
 
 class FatalErrorBoundary extends React.Component {

src/components/Item/VisualizationItem/Item.js → src/components/Item/VisualizationItem/Item.jsx

@@ -36,17 +36,17 @@ import {
     DEFAULT_STATE_ITEM_FILTERS,
 } from '../../../reducers/itemFilters.js'
 import { sGetVisualization } from '../../../reducers/visualizations.js'
-import { SystemSettingsCtx } from '../../SystemSettingsProvider.js'
-import { WindowDimensionsCtx } from '../../WindowDimensionsProvider.js'
-import ItemHeader from '../ItemHeader/ItemHeader.js'
-import FatalErrorBoundary from './FatalErrorBoundary.js'
+import { SystemSettingsCtx } from '../../SystemSettingsProvider.jsx'
+import { WindowDimensionsCtx } from '../../WindowDimensionsProvider.jsx'
+import ItemHeader from '../ItemHeader/ItemHeader.jsx'
+import FatalErrorBoundary from './FatalErrorBoundary.jsx'
 import { getGridItemElement } from './getGridItemElement.js'
 import { isElementFullscreen } from './isElementFullscreen.js'
-import ItemContextMenu from './ItemContextMenu/ItemContextMenu.js'
-import ItemFooter from './ItemFooter.js'
+import ItemContextMenu from './ItemContextMenu/ItemContextMenu.jsx'
+import ItemFooter from './ItemFooter.jsx'
 import memoizeOne from './memoizeOne.js'
 import { pluginIsAvailable } from './Visualization/plugin.js'
-import Visualization from './Visualization/Visualization.js'
+import Visualization from './Visualization/Visualization.jsx'
 
 class Item extends Component {
     state = {

src/components/Item/VisualizationItem/ItemContextMenu/ItemContextMenu.js → src/components/Item/VisualizationItem/ItemContextMenu/ItemContextMenu.jsx

@@ -28,11 +28,11 @@ import {
     EVENT_VISUALIZATION,
 } from '../../../../modules/itemTypes.js'
 import { isSmallScreen } from '../../../../modules/smallScreen.js'
-import MenuItem from '../../../MenuItemWithTooltip.js'
-import { useSystemSettings } from '../../../SystemSettingsProvider.js'
-import { useWindowDimensions } from '../../../WindowDimensionsProvider.js'
+import MenuItem from '../../../MenuItemWithTooltip.jsx'
+import { useSystemSettings } from '../../../SystemSettingsProvider.jsx'
+import { useWindowDimensions } from '../../../WindowDimensionsProvider.jsx'
 import { isElementFullscreen } from '../isElementFullscreen.js'
-import ViewAsMenuItems from './ViewAsMenuItems.js'
+import ViewAsMenuItems from './ViewAsMenuItems.jsx'
 
 const ItemContextMenu = (props) => {
     const [menuIsOpen, setMenuIsOpen] = useState(false)

src/components/Item/VisualizationItem/ItemContextMenu/ViewAsMenuItems.js → src/components/Item/VisualizationItem/ItemContextMenu/ViewAsMenuItems.jsx

@@ -13,7 +13,7 @@ import {
     isTrackerDomainType,
     hasMapView,
 } from '../../../../modules/itemTypes.js'
-import MenuItem from '../../../MenuItemWithTooltip.js'
+import MenuItem from '../../../MenuItemWithTooltip.jsx'
 import getThematicMapViews from '../getThematicMapViews.js'
 
 const ViewAsMenuItems = ({

src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ItemContextMenu.offline.spec.js → src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ItemContextMenu.offline.spec.jsx

@@ -2,9 +2,9 @@ import { fireEvent } from '@testing-library/dom'
 import { render, waitFor, screen } from '@testing-library/react'
 import React from 'react'
 import { getGridItemDomElementClassName } from '../../../../../modules/getGridItemDomElementClassName.js'
-import { useSystemSettings } from '../../../../SystemSettingsProvider.js'
-import WindowDimensionsProvider from '../../../../WindowDimensionsProvider.js'
-import ItemContextMenu from '../ItemContextMenu.js'
+import { useSystemSettings } from '../../../../SystemSettingsProvider.jsx'
+import WindowDimensionsProvider from '../../../../WindowDimensionsProvider.jsx'
+import ItemContextMenu from '../ItemContextMenu.jsx'
 
 jest.mock('../../../../SystemSettingsProvider', () => {
     return {

src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ItemContextMenu.spec.js → src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ItemContextMenu.spec.jsx

@@ -2,9 +2,9 @@ import { fireEvent } from '@testing-library/dom'
 import { render, waitFor, screen } from '@testing-library/react'
 import React from 'react'
 import { getGridItemDomElementClassName } from '../../../../../modules/getGridItemDomElementClassName.js'
-import { useSystemSettings } from '../../../../SystemSettingsProvider.js'
-import WindowDimensionsProvider from '../../../../WindowDimensionsProvider.js'
-import ItemContextMenu from '../ItemContextMenu.js'
+import { useSystemSettings } from '../../../../SystemSettingsProvider.jsx'
+import WindowDimensionsProvider from '../../../../WindowDimensionsProvider.jsx'
+import ItemContextMenu from '../ItemContextMenu.jsx'
 
 jest.mock('../../../../SystemSettingsProvider', () => {
     return {

src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ViewAsMenuItems.spec.js → src/components/Item/VisualizationItem/ItemContextMenu/__tests__/ViewAsMenuItems.spec.jsx

@@ -8,7 +8,7 @@ import {
     EVENT_REPORT,
     EVENT_CHART,
 } from '../../../../../modules/itemTypes.js'
-import ViewAsMenuItems from '../ViewAsMenuItems.js'
+import ViewAsMenuItems from '../ViewAsMenuItems.jsx'
 
 jest.mock('@dhis2/app-runtime', () => ({
     useDhis2ConnectionStatus: jest.fn(() => ({

src/components/Item/VisualizationItem/ItemFooter.js → src/components/Item/VisualizationItem/ItemFooter.jsx

@@ -9,8 +9,8 @@ import PropTypes from 'prop-types'
 import React, { useState } from 'react'
 import { getVisualizationId } from '../../../modules/item.js'
 import { getItemUrl, itemTypeMap } from '../../../modules/itemTypes.js'
-import FatalErrorBoundary from './FatalErrorBoundary.js'
-import { InterpretationReplyForm } from './InterpretationReplyForm.js'
+import FatalErrorBoundary from './FatalErrorBoundary.jsx'
+import { InterpretationReplyForm } from './InterpretationReplyForm.jsx'
 import classes from './styles/ItemFooter.module.css'
 
 const ItemFooter = ({ item }) => {