diff --git a/web/apps/payments/src/pages/404.tsx b/web/apps/payments/src/pages/404.tsx
index 2f6f5d9d0..91d8d2800 100644
--- a/web/apps/payments/src/pages/404.tsx
+++ b/web/apps/payments/src/pages/404.tsx
@@ -1,7 +1,7 @@
import { Container } from "components/Container";
+import S from "utils/strings";
import React from "react";
-import constants from "utils/strings";
export default function Home() {
- return {constants.NOT_FOUND};
+ return {S.error_404};
}
diff --git a/web/apps/payments/src/pages/_app.tsx b/web/apps/payments/src/pages/_app.tsx
index 9d57985e9..7686c5f8f 100644
--- a/web/apps/payments/src/pages/_app.tsx
+++ b/web/apps/payments/src/pages/_app.tsx
@@ -1,14 +1,14 @@
import type { AppProps } from "next/app";
import Head from "next/head";
import React from "react";
-import constants from "utils/strings";
+import S from "utils/strings";
import "../styles/globals.css";
function MyApp({ Component, pageProps }: AppProps) {
return (
<>
- {constants.TITLE}
+ {S.title}
diff --git a/web/apps/payments/src/pages/index.tsx b/web/apps/payments/src/pages/index.tsx
index 19151dc0e..98d4a586d 100644
--- a/web/apps/payments/src/pages/index.tsx
+++ b/web/apps/payments/src/pages/index.tsx
@@ -2,7 +2,7 @@ import { Container } from "components/Container";
import { Spinner } from "components/Spinner";
import * as React from "react";
import { parseAndHandleRequest } from "services/billing-service";
-import constants from "utils/strings";
+import S from "utils/strings";
export default function Home() {
const [failed, setFailed] = React.useState(false);
@@ -20,9 +20,5 @@ export default function Home() {
main();
}, []);
- return (
-
- {failed ? constants.SOMETHING_WENT_WRONG : }
-
- );
+ return {failed ? S.error_generic : };
}
diff --git a/web/apps/payments/src/utils/strings.ts b/web/apps/payments/src/utils/strings.ts
index 44ba64b8f..5632289be 100644
--- a/web/apps/payments/src/utils/strings.ts
+++ b/web/apps/payments/src/utils/strings.ts
@@ -1,7 +1,14 @@
-const englishConstants = {
- TITLE: "Payments | ente.io",
- SOMETHING_WENT_WRONG: "Oops, something went wrong.",
- NOT_FOUND: "404 | This page could not be found.",
+/**
+ * User facing strings in the app
+ *
+ * By keeping them separate, we make our lives easier if/when we need to
+ * localize the corresponding pages. Right now, these are just the values in the
+ * default language, English.
+ */
+const S = {
+ title: "Payments | ente.io",
+ error_generic: "Oops, something went wrong.",
+ error_404: "404 | This page could not be found.",
};
-export default englishConstants;
+export default S;