diff --git a/locales/de.json b/locales/de.json index f7d42c9ba7ae72ac611b97d29d2fbafead95b0f7..6f0e869bac89377c55871da75149703f15281bb7 100644 --- a/locales/de.json +++ b/locales/de.json @@ -133,5 +133,8 @@ "Issuance": { "title": "Ausgabe", "select": "Wählen" + }, + "Plugin": { + "not-found": "Plugin nicht gefunden" } } diff --git a/locales/en.json b/locales/en.json index f877637849d4d71452bebb048072fddf00f9fdb3..b2124994685faf3a1ad831c2615d29eae771a805 100644 --- a/locales/en.json +++ b/locales/en.json @@ -133,5 +133,8 @@ "Issuance": { "title": "Issuance", "select": "Select" + }, + "Plugin": { + "not-found": "Plugin not found" } } \ No newline at end of file diff --git a/src/app/[locale]/wallet/plugins/[plugin]/page.tsx b/src/app/[locale]/wallet/plugins/[plugin]/page.tsx index 673eeab441de217e6c77ce5c52512f37b106f62d..0d144a7e3abb4b46dca4d22e62f650d268edf3e8 100644 --- a/src/app/[locale]/wallet/plugins/[plugin]/page.tsx +++ b/src/app/[locale]/wallet/plugins/[plugin]/page.tsx @@ -3,6 +3,8 @@ import { RemoteComponent } from '@/RemoteComponent'; import { type Plugin as IPlugin } from '@/components/side-menu/WalletSideMenu'; import { useQueryClient } from '@tanstack/react-query'; +import { useTranslations } from 'next-intl'; +import { useAuth } from 'oidc-react'; import { useEffect, useState } from 'react'; interface PluginProps { @@ -14,6 +16,13 @@ interface PluginProps { const Plugin = ({ params }: PluginProps): JSX.Element => { const [PluginComponent, setPluginComponent] = useState<JSX.Element>(); const pluginDiscoveryData = useQueryClient().getQueryData<IPlugin[]>(['pluginDiscovery']); + const t = useTranslations('Plugin'); + const { userData } = useAuth(); + const pluginMetadata = { + example1: 'Example 1', + example2: 'Example 2', + example3: 'Example 3', + }; const fetchPluginData = (pluginDiscovery: IPlugin[], pluginRoute: string): void => { const foundPlugin = pluginDiscovery.find(plugin => plugin.route === pluginRoute); @@ -22,12 +31,18 @@ const Plugin = ({ params }: PluginProps): JSX.Element => { process.env.NODE_ENV !== 'development' ? process.env.ENV_URL : 'https://cloud-wallet.xfsc.dev' }/api/dynamic/plugins${foundPlugin?.url}/main.js`; - setPluginComponent(<RemoteComponent url={url} />); + setPluginComponent( + <RemoteComponent + url={url} + token={userData?.access_token} + metadata={pluginMetadata} + /> + ); }; useEffect(() => { if (!pluginDiscoveryData) { - setPluginComponent(<div>Plugin not found</div>); + setPluginComponent(<div>{t('not-found')}</div>); } else { fetchPluginData(pluginDiscoveryData, params.plugin); }