chore: initialise new datastore app

.gitignore

@@ -1 +1,5 @@
+# DHIS2 Platform
 node_modules
+.d2
+src/locales
+build

README.md

@@ -0,0 +1,45 @@
+This project was bootstrapped with [DHIS2 Application Platform](https://github.com/dhis2/app-platform).
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `yarn start`
+
+Runs the app in the development mode.<br />
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.<br />
+You will also see any lint errors in the console.
+
+### `yarn test`
+
+Launches the test runner and runs all available tests found in `/src`.<br />
+
+See the section about [running tests](https://platform.dhis2.nu/#/scripts/test) for more information.
+
+### `yarn build`
+
+Builds the app for production to the `build` folder.<br />
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.<br />
+A deployable `.zip` file can be found in `build/bundle`!
+
+See the section about [building](https://platform.dhis2.nu/#/scripts/build) for more information.
+
+### `yarn deploy`
+
+Deploys the built app in the `build` folder to a running DHIS2 instance.<br />
+This command will prompt you to enter a server URL as well as the username and password of a DHIS2 user with the App Management authority.<br/>
+You must run `yarn build` before running `yarn deploy`.<br />
+
+See the section about [deploying](https://platform.dhis2.nu/#/scripts/deploy) for more information.
+
+## Learn More
+
+You can learn more about the platform in the [DHIS2 Application Platform Documentation](https://platform.dhis2.nu/).
+
+You can learn more about the runtime in the [DHIS2 Application Runtime Documentation](https://runtime.dhis2.nu/).
+
+To learn React, check out the [React documentation](https://reactjs.org/).

d2.config.js

@@ -0,0 +1,9 @@
+const config = {
+    type: 'app',
+
+    entryPoints: {
+        app: './src/App.tsx',
+    },
+}
+
+module.exports = config

i18n/en.pot

@@ -0,0 +1,21 @@
+msgid ""
+msgstr ""
+"Project-Id-Version: i18next-conv\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=utf-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1)\n"
+"POT-Creation-Date: 2024-11-21T12:50:12.197Z\n"
+"PO-Revision-Date: 2024-11-21T12:50:12.198Z\n"
+
+msgid "ERROR"
+msgstr "ERROR"
+
+msgid "Loading..."
+msgstr "Loading..."
+
+msgid "Hello {{name}}"
+msgstr "Hello {{name}}"
+
+msgid "Welcome to DHIS2 with TypeScript!"
+msgstr "Welcome to DHIS2 with TypeScript!"

package.json

@@ -0,0 +1,23 @@
+{
+  "name": "datastore-app",
+  "version": "1.0.0",
+  "description": "",
+  "license": "BSD-3-Clause",
+  "private": true,
+  "scripts": {
+    "build": "d2-app-scripts build",
+    "start": "d2-app-scripts start",
+    "test": "d2-app-scripts test",
+    "deploy": "d2-app-scripts deploy"
+  },
+  "devDependencies": {
+    "@dhis2/cli-app-scripts": "^12.0.0-alpha.24",
+    "@types/jest": "^29.5.14",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "typescript": "^5"
+  },
+  "dependencies": {
+    "@dhis2/app-runtime": "^3.11.3"
+  }
+}

src/App.module.css

@@ -0,0 +1,9 @@
+.container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: 1rem;
+}

src/App.test.tsx

@@ -0,0 +1,21 @@
+import { CustomDataProvider } from '@dhis2/app-runtime'
+import React from 'react'
+import { createRoot } from 'react-dom/client'
+import App from './App'
+
+it('renders without crashing', () => {
+    const container = document.createElement('div')
+
+    const data = {
+        resource: 'test',
+    }
+
+    const root = createRoot(container)
+    root.render(
+        <CustomDataProvider data={data}>
+            <App />
+        </CustomDataProvider>
+    )
+
+    root.unmount()
+})

src/App.tsx

@@ -0,0 +1,37 @@
+import { useDataQuery } from '@dhis2/app-runtime'
+import i18n from '@dhis2/d2-i18n'
+import React, { FC } from 'react'
+import classes from './App.module.css'
+
+interface QueryResults {
+    me: {
+        name: string
+    }
+}
+
+const query = {
+    me: {
+        resource: 'me',
+    },
+}
+
+const MyApp: FC = () => {
+    const { error, loading, data } = useDataQuery<QueryResults>(query)
+
+    if (error) {
+        return <span>{i18n.t('ERROR')}</span>
+    }
+
+    if (loading) {
+        return <span>{i18n.t('Loading...')}</span>
+    }
+
+    return (
+        <div className={classes.container}>
+            <h1>{i18n.t('Hello {{name}}', { name: data?.me?.name })}</h1>
+            <h3>{i18n.t('Welcome to DHIS2 with TypeScript!')}</h3>
+        </div>
+    )
+}
+
+export default MyApp

tsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "noEmit": true,
+        "skipLibCheck": true,
+        "allowJs": true,
+        "jsx": "react",
+        "esModuleInterop": true,
+        "target": "ESNext",
+        "module": "esnext",
+        "moduleResolution": "node"
+    },
+    "include": ["src", "types"]
+}

types/global.d.ts

@@ -0,0 +1,8 @@
+import 'react'
+
+declare module 'react' {
+    interface StyleHTMLAttributes<T> extends React.HTMLAttributes<T> {
+        jsx?: boolean
+        global?: boolean
+    }
+}

types/modules.d.ts

@@ -0,0 +1,4 @@
+declare module '*.module.css' {
+    const classes: { [key: string]: string }
+    export default classes
+}