diff --git a/app/i18next-options.ts b/app/i18next-options.ts index 5e2dcfbd..c31dfd37 100644 --- a/app/i18next-options.ts +++ b/app/i18next-options.ts @@ -1,6 +1,8 @@ +export const supportedLanguages = ["en", "de"] as const; + export default { // This is the list of languages your application supports - supportedLngs: ["en", "de"], + supportedLngs: supportedLanguages, // This is the language you want to use in case // if the user language is not in the supportedLngs fallbackLng: "en", diff --git a/app/i18next.server.ts b/app/i18next.server.ts index 58c46fa6..1710ef75 100644 --- a/app/i18next.server.ts +++ b/app/i18next.server.ts @@ -8,7 +8,7 @@ let i18next: RemixI18Next = new RemixI18Next({ detection: { // persist language selection in cookie cookie: i18nCookie, - supportedLanguages: i18nextOptions.supportedLngs, + supportedLanguages: [...i18nextOptions.supportedLngs], fallbackLanguage: i18nextOptions.fallbackLng, }, // This is the configuration for i18next used diff --git a/app/lib/directus.ts b/app/lib/directus.ts index 8dbcc560..5f9822ec 100644 --- a/app/lib/directus.ts +++ b/app/lib/directus.ts @@ -1,40 +1,45 @@ -import { Directus, type ID } from '@directus/sdk'; +import { + createDirectus, + type DirectusClient, + rest, + type RestClient, +} from "@directus/sdk"; -const directusUrl = process.env.DIRECTUS_URL || 'http://localhost:8055' +const directusUrl = process.env.DIRECTUS_URL || "http://localhost:8055"; export type UseCase = { - id: ID, - status: string, - image: string, - title: string, - description: string, - content: string, - language: "de" | "en" -} + id: number | string; + status: string; + image: string; + title: string; + description: string; + content: string; + language: "de" | "en"; +}; export type Feature = { - id: ID, - title: string, - description: string, - icon: string, - language: "de" | "en" -} + id: number | string; + title: string; + description: string; + icon: string; + language: "de" | "en"; +}; export type Partner = { - id: ID, - name: string, - logo: string, - link: string -} + id: number | string; + name: string; + logo: string; + link: string; +}; type DirectusCollection = { - use_cases: UseCase, - features: Feature, - partners: Partner -} + use_cases: UseCase[]; + features: Feature[]; + partners: Partner[]; +}; -const directus = new Directus(directusUrl) +const directus = createDirectus(directusUrl).with(rest()); -export async function getDirectusClient () { - return directus -} \ No newline at end of file +export function getDirectusClient(): DirectusClient & RestClient { + return directus; +} diff --git a/app/routes/_index.tsx b/app/routes/_index.tsx index be48f197..3e1685d7 100644 --- a/app/routes/_index.tsx +++ b/app/routes/_index.tsx @@ -1,3 +1,4 @@ +import { readItems } from "@directus/sdk"; import { useMediaQuery } from "@mantine/hooks"; import { motion } from "framer-motion"; import { useTranslation } from "react-i18next"; @@ -11,6 +12,7 @@ import Integrations from "~/components/landing/sections/integrations"; import Partners from "~/components/landing/sections/partners"; import PricingPlans from "~/components/landing/sections/pricing-plans"; import Stats from "~/components/landing/stats"; +import { type supportedLanguages } from "~/i18next-options"; import i18next from "~/i18next.server"; import { type Partner, getDirectusClient } from "~/lib/directus"; import { getLatestDevices } from "~/models/device.server"; @@ -44,26 +46,26 @@ const sections = [ ]; export const loader = async ({ request }: LoaderFunctionArgs) => { - let locale = await i18next.getLocale(request); - const directus = await getDirectusClient(); + const locale = await i18next.getLocale(request) as typeof supportedLanguages[number]; + const directus = getDirectusClient(); - const useCasesResponse = await directus.items("use_cases").readByQuery({ + const useCasesResponse = await directus.request(readItems("use_cases", { fields: ["*"], filter: { - language: locale, + language: {_eq: locale }, }, - }); + })); - const featuresResponse = await directus.items("features").readByQuery({ + const featuresResponse = await directus.request(readItems("features", { fields: ["*"], filter: { - language: locale, + language: {_eq: locale }, }, - }); + })); - const partnersResponse = await directus.items("partners").readByQuery({ + const partnersResponse = await directus.request(readItems("partners", { fields: ["*"], - }); + })); //* Get user Id from session const userId = await getUserId(request); @@ -78,9 +80,9 @@ export const loader = async ({ request }: LoaderFunctionArgs) => { const latestDevices = await getLatestDevices(); return data({ - useCases: useCasesResponse.data, - features: featuresResponse.data, - partners: partnersResponse.data, + useCases: useCasesResponse, + features: featuresResponse, + partners: partnersResponse, stats: stats, header: { userId: userId, userName: userName }, locale: locale, diff --git a/package-lock.json b/package-lock.json index 78c39435..a0f8a950 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,7 @@ "dependencies": { "@conform-to/react": "^0.9.1", "@conform-to/zod": "^0.9.0", - "@directus/sdk": "^10.3.3", + "@directus/sdk": "^18.0.3", "@heroicons/react": "^2.0.18", "@hookform/resolvers": "^3.3.2", "@isaacs/express-prometheus-middleware": "^1.2.1", @@ -965,12 +965,15 @@ "license": "MIT" }, "node_modules/@directus/sdk": { - "version": "10.3.5", - "resolved": "https://registry.npmjs.org/@directus/sdk/-/sdk-10.3.5.tgz", - "integrity": "sha512-ZLn85mfy3MWyIhTSrw46Eka1XdjoRIugZXNQy9w+zSEFm3hAzgB74N1qH7zARj9dGCWx+bAAno3n29Y2NqQv/A==", + "version": "18.0.3", + "resolved": "https://registry.npmjs.org/@directus/sdk/-/sdk-18.0.3.tgz", + "integrity": "sha512-PnEDRDqr2x/DG3HZ3qxU7nFp2nW6zqJqswjii57NhriXgTz4TBUI8NmSdzQvnyHuTL9J0nedYfQGfW4v8odS1A==", "license": "MIT", - "dependencies": { - "axios": "^0.27.2" + "engines": { + "node": ">=18.0.0" + }, + "funding": { + "url": "https://github.com/directus/directus?sponsor=1" } }, "node_modules/@drizzle-team/brocli": { @@ -2484,31 +2487,6 @@ "react": "^16.8 || ^17.0 || ^18.0" } }, - "node_modules/@novu/notification-center/node_modules/axios": { - "version": "1.7.9", - "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.9.tgz", - "integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==", - "license": "MIT", - "dependencies": { - "follow-redirects": "^1.15.6", - "form-data": "^4.0.0", - "proxy-from-env": "^1.1.0" - } - }, - "node_modules/@novu/notification-center/node_modules/form-data": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.1.tgz", - "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==", - "license": "MIT", - "dependencies": { - "asynckit": "^0.4.0", - "combined-stream": "^1.0.8", - "mime-types": "^2.1.12" - }, - "engines": { - "node": ">= 6" - } - }, "node_modules/@novu/notification-center/node_modules/react-textarea-autosize": { "version": "8.3.4", "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.3.4.tgz", @@ -6429,23 +6407,25 @@ } }, "node_modules/axios": { - "version": "0.27.2", - "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", - "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "version": "1.8.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.8.4.tgz", + "integrity": "sha512-eBSYY4Y68NNlHbHBMdeDmKNtDgXWhQsJcGqzO3iLUM0GraQFSS9cVgPX5I9b3lbdFKyYoAEGAZF1DwhTaljNAw==", "license": "MIT", "dependencies": { - "follow-redirects": "^1.14.9", - "form-data": "^4.0.0" + "follow-redirects": "^1.15.6", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" } }, "node_modules/axios/node_modules/form-data": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.1.tgz", - "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==", + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.2.tgz", + "integrity": "sha512-hGfm/slu0ZabnNt4oaRZ6uREyfCj6P4fT/n6A1rGV+Z0VdGXjfOhVUpkn6qVQONHGIFwmveGXyDs75+nr6FM8w==", "license": "MIT", "dependencies": { "asynckit": "^0.4.0", "combined-stream": "^1.0.8", + "es-set-tostringtag": "^2.1.0", "mime-types": "^2.1.12" }, "engines": { @@ -9122,7 +9102,6 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz", "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==", - "dev": true, "license": "MIT", "dependencies": { "es-errors": "^1.3.0", @@ -11611,7 +11590,6 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz", "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==", - "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.3" @@ -24097,33 +24075,6 @@ "node": ">=12.0.0" } }, - "node_modules/wait-on/node_modules/axios": { - "version": "1.7.9", - "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.9.tgz", - "integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==", - "dev": true, - "license": "MIT", - "dependencies": { - "follow-redirects": "^1.15.6", - "form-data": "^4.0.0", - "proxy-from-env": "^1.1.0" - } - }, - "node_modules/wait-on/node_modules/form-data": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.1.tgz", - "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==", - "dev": true, - "license": "MIT", - "dependencies": { - "asynckit": "^0.4.0", - "combined-stream": "^1.0.8", - "mime-types": "^2.1.12" - }, - "engines": { - "node": ">= 6" - } - }, "node_modules/wcwidth": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/wcwidth/-/wcwidth-1.0.1.tgz", diff --git a/package.json b/package.json index c48cb02b..d1b62de4 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "dependencies": { "@conform-to/react": "^0.9.1", "@conform-to/zod": "^0.9.0", - "@directus/sdk": "^10.3.3", + "@directus/sdk": "^18.0.3", "@heroicons/react": "^2.0.18", "@hookform/resolvers": "^3.3.2", "@isaacs/express-prometheus-middleware": "^1.2.1",