Wrap intl in span identifying translation

frontend/src/locale/IntlProvider.tsx

@@ -61,4 +61,10 @@ const changeLocale = (locale: string): void => {
 	document.documentElement.lang = locale;
 };
 
-export { localeOptions, getFlagCodeForLocale, getLocale, createIntl, changeLocale, intl };
+// This is a translation component that wraps the translation in a span with a data
+// attribute so devs can inspect the element to see the translation ID
+const T = ({ id, data }: { id: string; data?: any }) => {
+	return <span data-translation-id={id}>{intl.formatMessage({ id }, data)}</span>;
+};
+
+export { localeOptions, getFlagCodeForLocale, getLocale, createIntl, changeLocale, intl, T };

frontend/src/locale/lang/en.json

@@ -3,9 +3,13 @@
   "access.actions-title": "Access List #{id}",
   "access.add": "Add Access List",
   "access.auth-count": "{count} Users",
+  "access.edit": "Edit Access",
   "access.empty": "There are no Access Lists",
-  "access.satisfy-all": "All",
-  "access.satisfy-any": "Any",
+  "access.new": "New Access",
+  "access.pass-auth": "Pass Auth to Upstream",
+  "access.public": "Publicly Accessible",
+  "access.satisfy-any": "Satisfy Any",
+  "access.subtitle": "{users} User, {rules} Rules - Created: {date}",
   "access.title": "Access",
   "action.delete": "Delete",
   "action.disable": "Disable",
@@ -23,6 +27,7 @@
   "close": "Close",
   "column.access": "Access",
   "column.authorization": "Authorization",
+  "column.authorizations": "Authorizations",
   "column.custom-locations": "Custom Locations",
   "column.destination": "Destination",
   "column.details": "Details",
@@ -35,7 +40,10 @@
   "column.protocol": "Protocol",
   "column.provider": "Provider",
   "column.roles": "Roles",
+  "column.rules": "Rules",
   "column.satisfy": "Satisfy",
+  "column.satisfy-all": "All",
+  "column.satisfy-any": "Any",
   "column.scheme": "Scheme",
   "column.source": "Source",
   "column.ssl": "SSL",
@@ -88,11 +96,11 @@
   "event.updated-redirection-host": "Updated Redirection Host",
   "event.updated-user": "Updated User",
   "footer.github-fork": "Fork me on Github",
+  "generic.flags.title": "Options",
   "host.flags.block-exploits": "Block Common Exploits",
   "host.flags.cache-assets": "Cache Assets",
   "host.flags.preserve-path": "Preserve Path",
   "host.flags.protocols": "Protocols",
-  "host.flags.title": "Options",
   "host.flags.websockets-upgrade": "Websockets Support",
   "host.forward-port": "Forward Port",
   "host.forward-scheme": "Scheme",
@@ -107,6 +115,7 @@
   "notfound.action": "Take me home",
   "notfound.text": "We are sorry but the page you are looking for was not found",
   "notfound.title": "Oops… You just found an error page",
+  "notification.access-saved": "Access has been saved",
   "notification.dead-host-saved": "404 Host has been saved",
   "notification.error": "Error",
   "notification.host-deleted": "Host has been deleted",
@@ -140,6 +149,8 @@
   "proxy-hosts.count": "{count} Proxy Hosts",
   "proxy-hosts.empty": "There are no Proxy Hosts",
   "proxy-hosts.title": "Proxy Hosts",
+  "redirection-host.delete.content": "Are you sure you want to delete this Redirection host?",
+  "redirection-host.delete.title": "Delete Redirection Host",
   "redirection-host.forward-domain": "Forward Domain",
   "redirection-host.new": "New Redirection Host",
   "redirection-hosts.actions-title": "Redirection Host #{id}",
@@ -157,6 +168,7 @@
   "ssl-certificate": "SSL Certificate",
   "stream.delete.content": "Are you sure you want to delete this Stream?",
   "stream.delete.title": "Delete Stream",
+  "stream.edit": "Edit Stream",
   "stream.forward-host": "Forward Host",
   "stream.incoming-port": "Incoming Port",
   "stream.new": "New Stream",
@@ -184,6 +196,7 @@
   "user.set-permissions": "Set Permissions for {name}",
   "user.switch-dark": "Switch to Dark mode",
   "user.switch-light": "Switch to Light mode",
+  "username": "Username",
   "users.actions-title": "User #{id}",
   "users.add": "Add User",
   "users.empty": "There are no Users",

frontend/src/locale/src/en.json

@@ -11,14 +11,26 @@
 	"access.auth-count": {
 		"defaultMessage": "{count} Users"
 	},
+	"access.edit": {
+		"defaultMessage": "Edit Access"
+	},
 	"access.empty": {
 		"defaultMessage": "There are no Access Lists"
 	},
-	"access.satisfy-all": {
-		"defaultMessage": "All"
+	"access.new": {
+		"defaultMessage": "New Access"
+	},
+	"access.pass-auth": {
+		"defaultMessage": "Pass Auth to Upstream"
+	},
+	"access.public": {
+		"defaultMessage": "Publicly Accessible"
 	},
 	"access.satisfy-any": {
-		"defaultMessage": "Any"
+		"defaultMessage": "Satisfy Any"
+	},
+	"access.subtitle": {
+		"defaultMessage": "{users} User, {rules} Rules - Created: {date}"
 	},
 	"access.title": {
 		"defaultMessage": "Access"
@@ -71,6 +83,9 @@
 	"column.authorization": {
 		"defaultMessage": "Authorization"
 	},
+	"column.authorizations": {
+		"defaultMessage": "Authorizations"
+	},
 	"column.custom-locations": {
 		"defaultMessage": "Custom Locations"
 	},
@@ -107,9 +122,18 @@
 	"column.roles": {
 		"defaultMessage": "Roles"
 	},
+	"column.rules": {
+		"defaultMessage": "Rules"
+	},
 	"column.satisfy": {
 		"defaultMessage": "Satisfy"
 	},
+	"column.satisfy-all": {
+		"defaultMessage": "All"
+	},
+	"column.satisfy-any": {
+		"defaultMessage": "Any"
+	},
 	"column.scheme": {
 		"defaultMessage": "Scheme"
 	},
@@ -266,6 +290,9 @@
 	"footer.github-fork": {
 		"defaultMessage": "Fork me on Github"
 	},
+	"generic.flags.title": {
+		"defaultMessage": "Options"
+	},
 	"host.flags.block-exploits": {
 		"defaultMessage": "Block Common Exploits"
 	},
@@ -278,9 +305,6 @@
 	"host.flags.protocols": {
 		"defaultMessage": "Protocols"
 	},
-	"host.flags.title": {
-		"defaultMessage": "Options"
-	},
 	"host.flags.websockets-upgrade": {
 		"defaultMessage": "Websockets Support"
 	},
@@ -323,6 +347,9 @@
 	"notfound.title": {
 		"defaultMessage": "Oops… You just found an error page"
 	},
+	"notification.access-saved": {
+		"defaultMessage": "Access has been saved"
+	},
 	"notification.dead-host-saved": {
 		"defaultMessage": "404 Host has been saved"
 	},
@@ -422,6 +449,12 @@
 	"proxy-hosts.title": {
 		"defaultMessage": "Proxy Hosts"
 	},
+	"redirection-host.delete.content": {
+		"defaultMessage": "Are you sure you want to delete this Redirection host?"
+	},
+	"redirection-host.delete.title": {
+		"defaultMessage": "Delete Redirection Host"
+	},
 	"redirection-host.forward-domain": {
 		"defaultMessage": "Forward Domain"
 	},
@@ -473,6 +506,9 @@
 	"stream.delete.title": {
 		"defaultMessage": "Delete Stream"
 	},
+	"stream.edit": {
+		"defaultMessage": "Edit Stream"
+	},
 	"stream.forward-host": {
 		"defaultMessage": "Forward Host"
 	},
@@ -554,6 +590,9 @@
 	"user.switch-light": {
 		"defaultMessage": "Switch to Light mode"
 	},
+	"username": {
+		"defaultMessage": "Username"
+	},
 	"users.actions-title": {
 		"defaultMessage": "User #{id}"
 	},