@sensolus/create-snt-agent-app 0.1.0 → 0.2.0

package/template/package.json

@@ -2,6 +2,7 @@
   "name": "{{APP_NAME}}",
   "version": "0.1.0",
   "private": true,
+  "description": "Sensolus agent app (generated by @sensolus/create-snt-agent-app).",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -9,8 +10,12 @@
     "preview": "vite preview",
     "lint": "eslint src"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@bitbucket.org/sensolus/{{APP_NAME}}.git"
+  },
   "dependencies": {
-    "@sensolus/snt-agent-kit": "^0.1.0",
+    "@sensolus/snt-agent-kit": "^0.2.0",
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "react-router-dom": "^7.1.1"
@@ -20,6 +25,8 @@
     "@vitejs/plugin-react": "^5.1.2",
     "eslint": "^9.18.0",
     "eslint-plugin-react": "^7.37.0",
+    "eslint-plugin-react-hooks": "^5.1.0",
+    "globals": "^15.14.0",
     "vite": "^7.3.1"
   }
 }

package/template/scripts/create-ecr-repo.sh

@@ -0,0 +1,42 @@
+#!/bin/bash
+set -e
+
+if [ -z "$1" ]; then
+    echo "Usage: $0 <repository-name>"
+    echo "Example: $0 {{APP_NAME}}"
+    exit 1
+fi
+
+REPO_NAME="$1"
+REGION="${AWS_REGION:-eu-west-1}"
+
+echo "Creating ECR repository: $REPO_NAME in $REGION"
+
+aws ecr create-repository \
+    --repository-name "$REPO_NAME" \
+    --region "$REGION" \
+    --image-scanning-configuration scanOnPush=true
+
+echo "Setting lifecycle policy to retain only 3 images"
+
+aws ecr put-lifecycle-policy \
+    --repository-name "$REPO_NAME" \
+    --region "$REGION" \
+    --lifecycle-policy-text '{
+        "rules": [
+            {
+                "rulePriority": 1,
+                "description": "Keep only 3 images",
+                "selection": {
+                    "tagStatus": "any",
+                    "countType": "imageCountMoreThan",
+                    "countNumber": 3
+                },
+                "action": {
+                    "type": "expire"
+                }
+            }
+        ]
+    }'
+
+echo "Done. Repository URL: $(aws ecr describe-repositories --repository-names "$REPO_NAME" --region "$REGION" --query 'repositories[0].repositoryUri' --output text)"

package/template/src/App.jsx

@@ -1,38 +1,35 @@
-import { useEffect, useState } from 'react'
-import { SntPageHeader, SntTable, SntBadge, SntButton, SntToolbar, SntLoadingOverlay, useLocale } from '@sensolus/snt-agent-kit'
+import { BrowserRouter, Routes, Route, useNavigate } from 'react-router-dom'
+import { SntUiProvider } from '@sensolus/snt-agent-kit'
+import { LocaleProvider, messages } from './i18n'
+import { AppConfigProvider } from './AppConfigContext'
+import { Home } from './pages/Home'
+import { OrganisationDetail } from './pages/OrganisationDetail'
 
-export default function App() {
-  const { t } = useLocale()
-  const [orgs, setOrgs] = useState(null)
-  const [loading, setLoading] = useState(false)
-
-  async function load() {
-    setLoading(true)
-    try {
-      const res = await fetch('/api/organisations')
-      setOrgs(res.ok ? await res.json() : [])
-    } finally {
-      setLoading(false)
-    }
-  }
-
-  useEffect(() => { load() }, [])
-
-  if (loading || orgs === null) return <SntLoadingOverlay message={t('common.loading')} />
+// SntUiProvider decouples kit widgets from the router and backend:
+// pass `navigate` (and optionally `api`) so widgets like SntPageHeader work.
+// LocaleProvider sits inside it so it fetches login info via the api adapter.
+function AppShell() {
+  const navigate = useNavigate()
+  return (
+    <SntUiProvider navigate={navigate}>
+      <LocaleProvider messages={messages}>
+        <AppConfigProvider>
+          <Routes>
+            <Route path="/" element={<Home />} />
+            <Route path="/organisation/:id" element={<OrganisationDetail />} />
+          </Routes>
+        </AppConfigProvider>
+      </LocaleProvider>
+    </SntUiProvider>
+  )
+}
 
+function App() {
   return (
-    <div className="app-container">
-      <SntPageHeader title={t('app.title')} />
-      <SntToolbar>
-        <SntButton variant="secondary" onClick={load}>{t('common.reload')}</SntButton>
-      </SntToolbar>
-      <SntTable
-        data={orgs}
-        columns={[
-          { key: 'name', header: t('app.org.name') },
-          { key: 'status', header: t('app.org.status'), render: (row, val) => <SntBadge variant={val === 'ACTIVE' ? 'success' : 'secondary'} text={String(val ?? '')} /> },
-        ]}
-      />
-    </div>
+    <BrowserRouter>
+      <AppShell />
+    </BrowserRouter>
   )
 }
+
+export default App

package/template/src/AppConfigContext.jsx

@@ -0,0 +1,45 @@
+import { createContext, useContext, useEffect, useState } from 'react'
+import { SntLoadingOverlay } from '@sensolus/snt-agent-kit'
+
+/**
+ * Fetches runtime config (map tile keys, etc.) from the Flask backend's
+ * /api/config endpoint and gates the app on it. Lets one Docker image
+ * deploy across environments — keys come from the container's env vars
+ * at runtime instead of being baked into the bundle at `vite build` time.
+ */
+const AppConfigContext = createContext(null)
+
+export function AppConfigProvider({ children }) {
+  const [config, setConfig] = useState(null)
+  const [error, setError] = useState(null)
+
+  useEffect(() => {
+    let cancelled = false
+    fetch('/api/config')
+      .then(r => r.ok ? r.json() : Promise.reject(new Error(`HTTP ${r.status}`)))
+      .then(data => { if (!cancelled) setConfig(data) })
+      .catch(err => { if (!cancelled) setError(err) })
+    return () => { cancelled = true }
+  }, [])
+
+  if (error) {
+    return (
+      <div style={{ padding: 40, color: 'var(--snt-red)' }}>
+        Failed to load app config from /api/config: {error.message}
+      </div>
+    )
+  }
+  if (!config) return <SntLoadingOverlay message="Loading config..." />
+
+  return (
+    <AppConfigContext.Provider value={config}>
+      {children}
+    </AppConfigContext.Provider>
+  )
+}
+
+export function useAppConfig() {
+  const ctx = useContext(AppConfigContext)
+  if (!ctx) throw new Error('useAppConfig must be used inside AppConfigProvider')
+  return ctx
+}

package/template/src/hooks/useFavourites.js

@@ -0,0 +1,44 @@
+import { useState, useEffect, useCallback } from 'react'
+
+export function useFavourites() {
+  const [favourites, setFavourites] = useState(new Set())
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    fetch('/api/favourites')
+      .then(res => res.json())
+      .then(ids => setFavourites(new Set(ids)))
+      .catch(() => setFavourites(new Set()))
+      .finally(() => setLoading(false))
+  }, [])
+
+  const toggleFavourite = useCallback(async (orgId) => {
+    const isFav = favourites.has(orgId)
+    // Optimistic update
+    setFavourites(prev => {
+      const next = new Set(prev)
+      if (isFav) next.delete(orgId)
+      else next.add(orgId)
+      return next
+    })
+
+    try {
+      const res = await fetch(`/api/favourites/${orgId}`, {
+        method: isFav ? 'DELETE' : 'PUT',
+      })
+      if (!res.ok) throw new Error()
+    } catch {
+      // Revert on error
+      setFavourites(prev => {
+        const next = new Set(prev)
+        if (isFav) next.add(orgId)
+        else next.delete(orgId)
+        return next
+      })
+    }
+  }, [favourites])
+
+  const isFavourite = useCallback((orgId) => favourites.has(orgId), [favourites])
+
+  return { favourites, toggleFavourite, isFavourite, loading }
+}

package/template/src/i18n/index.js

@@ -0,0 +1,3 @@
+// i18n framework comes from the kit; this app owns only its translation keys.
+export { LocaleProvider, useLocale, formatShortDate, formatDateTime, formatNumber } from '@sensolus/snt-agent-kit'
+export { messages } from './messages'

package/template/src/i18n/messages.js

@@ -1,17 +1,11 @@
 /**
  * App-owned translation keys, merged into the kit's common strings via
- * <LocaleProvider messages={messages}>. Add languages/keys as needed;
- * English is the fallback for missing keys.
+ * <LocaleProvider messages={messages}> (common.* / table.* ship with the kit).
  */
-export const messages = {
-  en: {
-    'app.title': '{{APP_NAME}}',
-    'app.org.name': 'Name',
-    'app.org.status': 'Status',
-  },
-  nl: {
-    'app.title': '{{APP_NAME}}',
-    'app.org.name': 'Naam',
-    'app.org.status': 'Status',
-  },
-}
+import en from './translations/en'
+import nl from './translations/nl'
+import fr from './translations/fr'
+import de from './translations/de'
+import es from './translations/es'
+
+export const messages = { en, nl, fr, de, es }

package/template/src/i18n/translations/de.js

@@ -0,0 +1,72 @@
+export default {
+  // Home / tabs
+  'home.tab.overview': 'Übersicht',
+  'home.tab.explore': 'Erkunden',
+  'home.tab.showcase': 'Widgets',
+
+  // Overview
+  'overview.title': 'Übersicht',
+  'overview.empty': 'Noch keine Snapshots erfasst. Der tägliche Snapshot füllt dieses Diagramm.',
+  'overview.chart.title': 'Tageswerte über alle Organisationen',
+  'overview.series.orgs': 'Organisationen',
+  'overview.series.trackers': 'Tracker',
+  'overview.series.users': 'Benutzer',
+
+  // Common
+
+  // Table widget
+
+  // CheckboxList widget
+
+  // Sidepanel
+
+  // DateRangePicker presets
+
+  // OrganisationList page
+  'orgList.title': 'Organisationen',
+  'orgList.apiKeyPlaceholder': 'API-Schlüssel...',
+  'orgList.searchPlaceholder': 'Nach Name suchen...',
+  'orgList.enterApiKey': 'Bitte geben Sie einen API-Schlüssel ein',
+  'orgList.fetchFailed': 'Organisationen konnten nicht geladen werden',
+  'orgList.loadingOrgs': 'Organisationen werden geladen...',
+  'orgList.showing': (shown, total) => `${shown} von ${total} Organisationen`,
+  'orgList.noOrgsFound': 'Keine Organisationen gefunden',
+  'orgList.noOrgsMatch': 'Keine Organisationen entsprechen den aktuellen Filtern.',
+  'orgList.activeSubscriptions': 'Aktive Abonnements',
+  'orgList.onlyActive': 'Nur mit aktiven Abonnements',
+  'orgList.minSubscriptions': (n) => `Min. Abonnements: ${n}`,
+  'orgList.organisationType': 'Organisationstyp',
+  'orgList.favourites': 'Favoriten',
+  'orgList.onlyFavourites': 'Nur Favoriten',
+  'orgList.addFavourite': 'Zu Favoriten hinzufügen',
+  'orgList.removeFavourite': 'Aus Favoriten entfernen',
+  'orgList.summary.favourites': 'Favoriten',
+  'orgList.summary.organisations': 'Organisationen',
+  'orgList.summary.totalTrackers': 'Tracker gesamt',
+  'orgList.summary.activeSubscriptions': 'Aktive Abonnements',
+  'orgList.summary.totalUsers': 'Benutzer gesamt',
+  'orgList.summary.avgOnlineRatio': 'Durchschn. Online-Rate',
+  'orgList.col.name': 'Name',
+  'orgList.col.id': 'ID',
+  'orgList.col.type': 'Typ',
+  'orgList.col.trackers': 'Tracker',
+  'orgList.col.activeSubs': 'Aktive Abon.',
+  'orgList.col.users': 'Benutzer',
+  'orgList.col.online': 'Online',
+  'orgList.stat.id': 'ID',
+  'orgList.stat.trackers': 'Tracker',
+  'orgList.stat.activeSubscriptions': 'Aktive Abonnements',
+  'orgList.stat.users': 'Benutzer',
+  'orgList.stat.online': 'Online',
+
+  // OrganisationDetail page
+  'orgDetail.notFound': 'Organisation nicht gefunden',
+  'orgDetail.notAvailable': 'Organisationsdaten nicht verfügbar',
+  'orgDetail.goBackPrompt': 'Bitte gehen Sie zurück zur Liste und wählen Sie eine Organisation.',
+  'orgDetail.basicInfo': 'Allgemeine Informationen',
+  'orgDetail.metrics': 'Metriken',
+  'orgDetail.statistics': 'Statistiken',
+  'orgDetail.otherDetails': 'Weitere Details',
+  'orgDetail.locked': 'Gesperrt',
+  'orgDetail.active': 'Aktiv',
+}

package/template/src/i18n/translations/en.js

@@ -0,0 +1,79 @@
+export default {
+  // Home / tabs
+  'home.tab.overview': 'Overview',
+  'home.tab.explore': 'Explore',
+  'home.tab.showcase': 'Widgets',
+
+  // Overview
+  'overview.title': 'Overview',
+  'overview.empty': 'No snapshots collected yet. The daily snapshot will populate this chart.',
+  'overview.chart.title': 'Daily totals across organisations',
+  'overview.series.orgs': 'Organisations',
+  'overview.series.trackers': 'Trackers',
+  'overview.series.users': 'Users',
+
+  // Common
+
+  // Table widget
+
+  // CheckboxList widget
+
+  // Sidepanel
+
+  // DateRangePicker presets
+
+  // Auth dialog
+  'auth.dialog.title': 'Sensolus API key required',
+  'auth.dialog.description':
+    'No active session was found. Enter a Sensolus API key to load data. The key is stored for this browser session and shared across all tabs.',
+  'auth.dialog.failed': 'Failed to save API key',
+
+  // OrganisationList page
+  'orgList.title': 'Organisations',
+  'orgList.apiKeyPlaceholder': 'API key...',
+  'orgList.changeApiKey': 'Change API key',
+  'orgList.searchPlaceholder': 'Search by name...',
+  'orgList.enterApiKey': 'Please enter an API key',
+  'orgList.fetchFailed': 'Failed to fetch organisations',
+  'orgList.loadingOrgs': 'Loading organisations...',
+  'orgList.showing': (shown, total) => `Showing ${shown} of ${total} organisations`,
+  'orgList.noOrgsFound': 'No organisations found',
+  'orgList.noOrgsMatch': 'No organisations match your current filters.',
+  'orgList.activeSubscriptions': 'Active Subscriptions',
+  'orgList.onlyActive': 'Only with active subscriptions',
+  'orgList.minSubscriptions': (n) => `Min. Subscriptions: ${n}`,
+  'orgList.organisationType': 'Organisation Type',
+  'orgList.favourites': 'Favourites',
+  'orgList.onlyFavourites': 'Only favourites',
+  'orgList.addFavourite': 'Add to favourites',
+  'orgList.removeFavourite': 'Remove from favourites',
+  'orgList.summary.favourites': 'Favourites',
+  'orgList.summary.organisations': 'Organisations',
+  'orgList.summary.totalTrackers': 'Total Trackers',
+  'orgList.summary.activeSubscriptions': 'Active Subscriptions',
+  'orgList.summary.totalUsers': 'Total Users',
+  'orgList.summary.avgOnlineRatio': 'Avg Online Ratio',
+  'orgList.col.name': 'Name',
+  'orgList.col.id': 'ID',
+  'orgList.col.type': 'Type',
+  'orgList.col.trackers': 'Trackers',
+  'orgList.col.activeSubs': 'Active Subs',
+  'orgList.col.users': 'Users',
+  'orgList.col.online': 'Online',
+  'orgList.stat.id': 'ID',
+  'orgList.stat.trackers': 'Trackers',
+  'orgList.stat.activeSubscriptions': 'Active Subscriptions',
+  'orgList.stat.users': 'Users',
+  'orgList.stat.online': 'Online',
+
+  // OrganisationDetail page
+  'orgDetail.notFound': 'Organisation Not Found',
+  'orgDetail.notAvailable': 'Organisation data not available',
+  'orgDetail.goBackPrompt': 'Please go back to the list and select an organisation.',
+  'orgDetail.basicInfo': 'Basic Information',
+  'orgDetail.metrics': 'Metrics',
+  'orgDetail.statistics': 'Statistics',
+  'orgDetail.otherDetails': 'Other Details',
+  'orgDetail.locked': 'Locked',
+  'orgDetail.active': 'Active',
+}

package/template/src/i18n/translations/es.js

@@ -0,0 +1,72 @@
+export default {
+  // Home / tabs
+  'home.tab.overview': 'Resumen',
+  'home.tab.explore': 'Explorar',
+  'home.tab.showcase': 'Widgets',
+
+  // Overview
+  'overview.title': 'Resumen',
+  'overview.empty': 'Aún no se han recopilado capturas. La captura diaria llenará este gráfico.',
+  'overview.chart.title': 'Totales diarios por organización',
+  'overview.series.orgs': 'Organizaciones',
+  'overview.series.trackers': 'Rastreadores',
+  'overview.series.users': 'Usuarios',
+
+  // Common
+
+  // Table widget
+
+  // CheckboxList widget
+
+  // Sidepanel
+
+  // DateRangePicker presets
+
+  // OrganisationList page
+  'orgList.title': 'Organizaciones',
+  'orgList.apiKeyPlaceholder': 'Clave API...',
+  'orgList.searchPlaceholder': 'Buscar por nombre...',
+  'orgList.enterApiKey': 'Por favor, introduzca una clave API',
+  'orgList.fetchFailed': 'Error al cargar las organizaciones',
+  'orgList.loadingOrgs': 'Cargando organizaciones...',
+  'orgList.showing': (shown, total) => `Mostrando ${shown} de ${total} organizaciones`,
+  'orgList.noOrgsFound': 'No se encontraron organizaciones',
+  'orgList.noOrgsMatch': 'Ninguna organización coincide con los filtros actuales.',
+  'orgList.activeSubscriptions': 'Suscripciones activas',
+  'orgList.onlyActive': 'Solo con suscripciones activas',
+  'orgList.minSubscriptions': (n) => `Min. suscripciones: ${n}`,
+  'orgList.organisationType': 'Tipo de organización',
+  'orgList.favourites': 'Favoritos',
+  'orgList.onlyFavourites': 'Solo favoritos',
+  'orgList.addFavourite': 'Agregar a favoritos',
+  'orgList.removeFavourite': 'Eliminar de favoritos',
+  'orgList.summary.favourites': 'Favoritos',
+  'orgList.summary.organisations': 'Organizaciones',
+  'orgList.summary.totalTrackers': 'Total trackers',
+  'orgList.summary.activeSubscriptions': 'Suscripciones activas',
+  'orgList.summary.totalUsers': 'Total usuarios',
+  'orgList.summary.avgOnlineRatio': 'Ratio en línea prom.',
+  'orgList.col.name': 'Nombre',
+  'orgList.col.id': 'ID',
+  'orgList.col.type': 'Tipo',
+  'orgList.col.trackers': 'Trackers',
+  'orgList.col.activeSubs': 'Susc. activas',
+  'orgList.col.users': 'Usuarios',
+  'orgList.col.online': 'En línea',
+  'orgList.stat.id': 'ID',
+  'orgList.stat.trackers': 'Trackers',
+  'orgList.stat.activeSubscriptions': 'Suscripciones activas',
+  'orgList.stat.users': 'Usuarios',
+  'orgList.stat.online': 'En línea',
+
+  // OrganisationDetail page
+  'orgDetail.notFound': 'Organización no encontrada',
+  'orgDetail.notAvailable': 'Datos de la organización no disponibles',
+  'orgDetail.goBackPrompt': 'Vuelva a la lista y seleccione una organización.',
+  'orgDetail.basicInfo': 'Información general',
+  'orgDetail.metrics': 'Métricas',
+  'orgDetail.statistics': 'Estadísticas',
+  'orgDetail.otherDetails': 'Otros detalles',
+  'orgDetail.locked': 'Bloqueado',
+  'orgDetail.active': 'Activo',
+}

package/template/src/i18n/translations/fr.js

@@ -0,0 +1,72 @@
+export default {
+  // Home / tabs
+  'home.tab.overview': 'Vue d\'ensemble',
+  'home.tab.explore': 'Explorer',
+  'home.tab.showcase': 'Widgets',
+
+  // Overview
+  'overview.title': 'Vue d\'ensemble',
+  'overview.empty': 'Aucun instantané collecté pour l\'instant. L\'instantané quotidien remplira ce graphique.',
+  'overview.chart.title': 'Totaux journaliers par organisation',
+  'overview.series.orgs': 'Organisations',
+  'overview.series.trackers': 'Traceurs',
+  'overview.series.users': 'Utilisateurs',
+
+  // Common
+
+  // Table widget
+
+  // CheckboxList widget
+
+  // Sidepanel
+
+  // DateRangePicker presets
+
+  // OrganisationList page
+  'orgList.title': 'Organisations',
+  'orgList.apiKeyPlaceholder': 'Clé API...',
+  'orgList.searchPlaceholder': 'Rechercher par nom...',
+  'orgList.enterApiKey': 'Veuillez entrer une clé API',
+  'orgList.fetchFailed': 'Échec du chargement des organisations',
+  'orgList.loadingOrgs': 'Chargement des organisations...',
+  'orgList.showing': (shown, total) => `${shown} sur ${total} organisations`,
+  'orgList.noOrgsFound': 'Aucune organisation trouvée',
+  'orgList.noOrgsMatch': 'Aucune organisation ne correspond aux filtres actuels.',
+  'orgList.activeSubscriptions': 'Abonnements actifs',
+  'orgList.onlyActive': 'Uniquement avec abonnements actifs',
+  'orgList.minSubscriptions': (n) => `Min. abonnements : ${n}`,
+  'orgList.organisationType': 'Type d\'organisation',
+  'orgList.favourites': 'Favoris',
+  'orgList.onlyFavourites': 'Uniquement les favoris',
+  'orgList.addFavourite': 'Ajouter aux favoris',
+  'orgList.removeFavourite': 'Retirer des favoris',
+  'orgList.summary.favourites': 'Favoris',
+  'orgList.summary.organisations': 'Organisations',
+  'orgList.summary.totalTrackers': 'Total trackers',
+  'orgList.summary.activeSubscriptions': 'Abonnements actifs',
+  'orgList.summary.totalUsers': 'Total utilisateurs',
+  'orgList.summary.avgOnlineRatio': 'Ratio en ligne moy.',
+  'orgList.col.name': 'Nom',
+  'orgList.col.id': 'ID',
+  'orgList.col.type': 'Type',
+  'orgList.col.trackers': 'Trackers',
+  'orgList.col.activeSubs': 'Abon. actifs',
+  'orgList.col.users': 'Utilisateurs',
+  'orgList.col.online': 'En ligne',
+  'orgList.stat.id': 'ID',
+  'orgList.stat.trackers': 'Trackers',
+  'orgList.stat.activeSubscriptions': 'Abonnements actifs',
+  'orgList.stat.users': 'Utilisateurs',
+  'orgList.stat.online': 'En ligne',
+
+  // OrganisationDetail page
+  'orgDetail.notFound': 'Organisation non trouvée',
+  'orgDetail.notAvailable': 'Données de l\'organisation non disponibles',
+  'orgDetail.goBackPrompt': 'Veuillez retourner à la liste et sélectionner une organisation.',
+  'orgDetail.basicInfo': 'Informations générales',
+  'orgDetail.metrics': 'Métriques',
+  'orgDetail.statistics': 'Statistiques',
+  'orgDetail.otherDetails': 'Autres détails',
+  'orgDetail.locked': 'Verrouillé',
+  'orgDetail.active': 'Actif',
+}

package/template/src/i18n/translations/nl.js

@@ -0,0 +1,72 @@
+export default {
+  // Home / tabs
+  'home.tab.overview': 'Overzicht',
+  'home.tab.explore': 'Verkennen',
+  'home.tab.showcase': 'Widgets',
+
+  // Overview
+  'overview.title': 'Overzicht',
+  'overview.empty': 'Nog geen snapshots verzameld. De dagelijkse snapshot vult deze grafiek.',
+  'overview.chart.title': 'Dagtotalen over organisaties',
+  'overview.series.orgs': 'Organisaties',
+  'overview.series.trackers': 'Trackers',
+  'overview.series.users': 'Gebruikers',
+
+  // Common
+
+  // Table widget
+
+  // CheckboxList widget
+
+  // Sidepanel
+
+  // DateRangePicker presets
+
+  // OrganisationList page
+  'orgList.title': 'Organisaties',
+  'orgList.apiKeyPlaceholder': 'API sleutel...',
+  'orgList.searchPlaceholder': 'Zoek op naam...',
+  'orgList.enterApiKey': 'Voer een API sleutel in',
+  'orgList.fetchFailed': 'Ophalen van organisaties mislukt',
+  'orgList.loadingOrgs': 'Organisaties laden...',
+  'orgList.showing': (shown, total) => `${shown} van ${total} organisaties`,
+  'orgList.noOrgsFound': 'Geen organisaties gevonden',
+  'orgList.noOrgsMatch': 'Geen organisaties komen overeen met de huidige filters.',
+  'orgList.activeSubscriptions': 'Actieve abonnementen',
+  'orgList.onlyActive': 'Alleen met actieve abonnementen',
+  'orgList.minSubscriptions': (n) => `Min. abonnementen: ${n}`,
+  'orgList.organisationType': 'Organisatietype',
+  'orgList.favourites': 'Favorieten',
+  'orgList.onlyFavourites': 'Alleen favorieten',
+  'orgList.addFavourite': 'Toevoegen aan favorieten',
+  'orgList.removeFavourite': 'Verwijderen uit favorieten',
+  'orgList.summary.favourites': 'Favorieten',
+  'orgList.summary.organisations': 'Organisaties',
+  'orgList.summary.totalTrackers': 'Totaal trackers',
+  'orgList.summary.activeSubscriptions': 'Actieve abonnementen',
+  'orgList.summary.totalUsers': 'Totaal gebruikers',
+  'orgList.summary.avgOnlineRatio': 'Gem. online ratio',
+  'orgList.col.name': 'Naam',
+  'orgList.col.id': 'ID',
+  'orgList.col.type': 'Type',
+  'orgList.col.trackers': 'Trackers',
+  'orgList.col.activeSubs': 'Actieve abon.',
+  'orgList.col.users': 'Gebruikers',
+  'orgList.col.online': 'Online',
+  'orgList.stat.id': 'ID',
+  'orgList.stat.trackers': 'Trackers',
+  'orgList.stat.activeSubscriptions': 'Actieve abonnementen',
+  'orgList.stat.users': 'Gebruikers',
+  'orgList.stat.online': 'Online',
+
+  // OrganisationDetail page
+  'orgDetail.notFound': 'Organisatie niet gevonden',
+  'orgDetail.notAvailable': 'Organisatiegegevens niet beschikbaar',
+  'orgDetail.goBackPrompt': 'Ga terug naar de lijst en selecteer een organisatie.',
+  'orgDetail.basicInfo': 'Basisinformatie',
+  'orgDetail.metrics': 'Metrieken',
+  'orgDetail.statistics': 'Statistieken',
+  'orgDetail.otherDetails': 'Overige details',
+  'orgDetail.locked': 'Vergrendeld',
+  'orgDetail.active': 'Actief',
+}

package/template/src/main.jsx

@@ -1,15 +1,11 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
-import { LocaleProvider } from '@sensolus/snt-agent-kit'
-import '@sensolus/snt-agent-kit/theme.css'
 import App from './App'
-import { messages } from './i18n/messages'
+import '@sensolus/snt-agent-kit/theme.css'
 import './styles/app.css'
 
 ReactDOM.createRoot(document.getElementById('root')).render(
   <React.StrictMode>
-    <LocaleProvider messages={messages}>
-      <App />
-    </LocaleProvider>
+    <App />
   </React.StrictMode>
 )