diff --git a/src/data/frontend.ts b/src/data/frontend.ts
index bc8d512614..71c60d670f 100644
--- a/src/data/frontend.ts
+++ b/src/data/frontend.ts
@@ -1,38 +1,36 @@
 import { HomeAssistant } from "../types";
 
-export interface FrontendUserData {
-  language: string;
+declare global {
+  // tslint:disable-next-line
+  interface FrontendUserData {}
 }
 
-export const fetchFrontendUserData = async (
+export type ValidUserDataKey = keyof FrontendUserData;
+
+export const fetchFrontendUserData = async <
+  UserDataKey extends ValidUserDataKey
+>(
   hass: HomeAssistant,
-  key: string
-): Promise<FrontendUserData> => {
-  const result = await hass.callWS<{ value: FrontendUserData }>({
+  key: UserDataKey
+): Promise<FrontendUserData[UserDataKey] | null> => {
+  const result = await hass.callWS<{
+    value: FrontendUserData[UserDataKey] | null;
+  }>({
     type: "frontend/get_user_data",
     key,
   });
   return result.value;
 };
 
-export const saveFrontendUserData = async (
+export const saveFrontendUserData = async <
+  UserDataKey extends ValidUserDataKey
+>(
   hass: HomeAssistant,
-  key: string,
-  value: FrontendUserData
+  key: UserDataKey,
+  value: FrontendUserData[UserDataKey]
 ): Promise<void> =>
   hass.callWS<void>({
     type: "frontend/set_user_data",
     key,
     value,
   });
-
-export const getHassTranslations = async (
-  hass: HomeAssistant,
-  language: string
-): Promise<{}> => {
-  const result = await hass.callWS<{ resources: {} }>({
-    type: "frontend/get_translations",
-    language,
-  });
-  return result.resources;
-};
diff --git a/src/data/translation.ts b/src/data/translation.ts
new file mode 100644
index 0000000000..122ce344bd
--- /dev/null
+++ b/src/data/translation.ts
@@ -0,0 +1,31 @@
+import { HomeAssistant } from "../types";
+import { fetchFrontendUserData, saveFrontendUserData } from "./frontend";
+
+export interface FrontendTranslationData {
+  language: string;
+}
+
+declare global {
+  interface FrontendUserData {
+    language: FrontendTranslationData;
+  }
+}
+
+export const fetchTranslationPreferences = (hass: HomeAssistant) =>
+  fetchFrontendUserData(hass, "language");
+
+export const saveTranslationPreferences = (
+  hass: HomeAssistant,
+  data: FrontendTranslationData
+) => saveFrontendUserData(hass, "language", data);
+
+export const getHassTranslations = async (
+  hass: HomeAssistant,
+  language: string
+): Promise<{}> => {
+  const result = await hass.callWS<{ resources: {} }>({
+    type: "frontend/get_translations",
+    language,
+  });
+  return result.resources;
+};
diff --git a/src/layouts/app/translations-mixin.ts b/src/layouts/app/translations-mixin.ts
index c3cb127593..5914f7c38f 100644
--- a/src/layouts/app/translations-mixin.ts
+++ b/src/layouts/app/translations-mixin.ts
@@ -9,8 +9,9 @@ import { HassBaseEl } from "./hass-base-mixin";
 import { computeLocalize } from "../../common/translations/localize";
 import { computeRTL } from "../../common/util/compute_rtl";
 import { HomeAssistant } from "../../types";
-import { saveFrontendUserData, getHassTranslations } from "../../data/frontend";
+import { saveFrontendUserData } from "../../data/frontend";
 import { storeState } from "../../util/ha-pref-storage";
+import { getHassTranslations } from "../../data/translation";
 
 /*
  * superClass needs to contain `this.hass` and `this._updateHass`.
diff --git a/src/util/hass-translation.ts b/src/util/hass-translation.ts
index f2680e50d5..067392bcc0 100644
--- a/src/util/hass-translation.ts
+++ b/src/util/hass-translation.ts
@@ -43,7 +43,8 @@ function findAvailableLanguage(language: string) {
  * Get user selected language from backend
  */
 export async function getUserLanguage(hass: HomeAssistant) {
-  const { language } = await fetchFrontendUserData(hass, "language");
+  const result = await fetchFrontendUserData(hass, "language");
+  const language = result ? result.language : null;
   if (language) {
     const availableLanguage = findAvailableLanguage(language);
     if (availableLanguage) {