Fixed localization to work with backend

FaZeRs · Jun 4, 2019 · 61ead68 · 61ead68
1 parent 4d97f1a
commit 61ead68
Show file tree

Hide file tree

Showing 10 changed files with 78 additions and 47 deletions.
diff --git a/app/Http/Kernel.php b/app/Http/Kernel.php
@@ -39,6 +39,7 @@ class Kernel extends HttpKernel
 
         'api' => [
             'throttle:60,1',
+            'localization',
             'bindings',
         ],
     ];
@@ -61,6 +62,7 @@ class Kernel extends HttpKernel
         'throttle' => \Illuminate\Routing\Middleware\ThrottleRequests::class,
         'verified' => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
         'api_admin' => \App\Http\Middleware\ApiAdminMiddleware::class,
+        'localization' => \App\Http\Middleware\LocaleMiddleware::class,
     ];
 
     /**

diff --git a/app/Http/Middleware/LocaleMiddleware.php b/app/Http/Middleware/LocaleMiddleware.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Http\Middleware;
+
+use Closure;
+use Carbon\Carbon;
+
+/**
+ * Class LocaleMiddleware.
+ */
+class LocaleMiddleware
+{
+    /**
+     * Handle an incoming request.
+     *
+     * @param \Illuminate\Http\Request $request
+     * @param \Closure                 $next
+     *
+     * @return mixed
+     */
+    public function handle($request, Closure $next)
+    {
+        $locale = $request->header('Content-Language');
+        if(!$locale){
+            $locale = config('app.locale');
+        }
+        if (!array_key_exists($locale, config('app.locales'))) {
+            return abort(403, 'Language not supported.');
+        }
+        app()->setLocale($locale);
+        $response = $next($request);
+        $response->headers->set('Content-Language', $locale);
+
+        return $response;
+    }
+}
diff --git a/public/js/app.js b/public/js/app.js
@@ -2989,6 +2989,7 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var vuex__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vuex */ "./node_modules/vuex/dist/vuex.esm.js");
 /* harmony import */ var _plugins_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ~/plugins/i18n */ "./resources/js/plugins/i18n.js");
+/* harmony import */ var _store_actions_type__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ~/store/actions.type */ "./resources/js/store/actions.type.js");
 //
 //
 //
@@ -3005,6 +3006,7 @@ __webpack_require__.r(__webpack_exports__);
 //
 
 
+
 /* harmony default export */ __webpack_exports__["default"] = ({
   computed: Object(vuex__WEBPACK_IMPORTED_MODULE_0__["mapGetters"])({
     locale: 'locale',
@@ -3013,9 +3015,7 @@ __webpack_require__.r(__webpack_exports__);
   methods: {
     setLocale: function setLocale(locale) {
       Object(_plugins_i18n__WEBPACK_IMPORTED_MODULE_1__["loadMessages"])(locale);
-      this.$store.dispatch('setLocale', {
-        locale: locale
-      });
+      this.$store.dispatch(_store_actions_type__WEBPACK_IMPORTED_MODULE_2__["CHANGE_LOCALE"], locale);
       this.$validator.localize(locale);
     }
   }
@@ -80516,6 +80516,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var vue_axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! vue-axios */ "./node_modules/vue-axios/dist/vue-axios.min.js");
 /* harmony import */ var vue_axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(vue_axios__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./config */ "./resources/js/common/config.js");
+/* harmony import */ var js_cookie__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! js-cookie */ "./node_modules/js-cookie/src/js.cookie.js");
+/* harmony import */ var js_cookie__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(js_cookie__WEBPACK_IMPORTED_MODULE_4__);
+
 
 
 
@@ -80524,6 +80527,7 @@ var ApiService = {
   init: function init() {
     vue__WEBPACK_IMPORTED_MODULE_0___default.a.use(vue_axios__WEBPACK_IMPORTED_MODULE_2___default.a, axios__WEBPACK_IMPORTED_MODULE_1___default.a);
     vue__WEBPACK_IMPORTED_MODULE_0___default.a.axios.defaults.baseURL = _config__WEBPACK_IMPORTED_MODULE_3__["API_URL"];
+    vue__WEBPACK_IMPORTED_MODULE_0___default.a.axios.defaults.headers.common['Content-Language'] = js_cookie__WEBPACK_IMPORTED_MODULE_4___default.a.get('locale') || 'en';
   },
   query: function query(resource, params) {
     return vue__WEBPACK_IMPORTED_MODULE_0___default.a.axios.get(resource, params)["catch"](function (error) {
@@ -80620,7 +80624,7 @@ var ContactService = {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "API_URL", function() { return API_URL; });
-var API_URL = 'http://localhost:8000/api';
+var API_URL = "http://localhost:8000/api";
 /* harmony default export */ __webpack_exports__["default"] = (API_URL);
 
 /***/ }),
@@ -82145,6 +82149,7 @@ function _loadMessages() {
           case 5:
             if (i18n.locale !== locale) {
               i18n.locale = locale;
+              vue__WEBPACK_IMPORTED_MODULE_1___default.a.axios.defaults.headers.common['Content-Language'] = locale;
             }
 
           case 6:
@@ -82536,7 +82541,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!********************************************!*\
   !*** ./resources/js/store/actions.type.js ***!
   \********************************************/
-/*! exports provided: FETCH_PROJECTS, FETCH_CATEGORIES, FETCH_EDUCATION, FETCH_EXPERIENCE, FETCH_SETTINGS, SEND_CONTACT */
+/*! exports provided: FETCH_PROJECTS, FETCH_CATEGORIES, FETCH_EDUCATION, FETCH_EXPERIENCE, FETCH_SETTINGS, SEND_CONTACT, CHANGE_LOCALE */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -82547,12 +82552,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FETCH_EXPERIENCE", function() { return FETCH_EXPERIENCE; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FETCH_SETTINGS", function() { return FETCH_SETTINGS; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SEND_CONTACT", function() { return SEND_CONTACT; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CHANGE_LOCALE", function() { return CHANGE_LOCALE; });
 var FETCH_PROJECTS = 'fetchProjects';
 var FETCH_CATEGORIES = 'fetchCategories';
 var FETCH_EDUCATION = 'fetchEducation';
 var FETCH_EXPERIENCE = 'fetchExperience';
 var FETCH_SETTINGS = 'fetchSettings';
 var SEND_CONTACT = 'sendContact';
+var CHANGE_LOCALE = 'changeLocale';
 
 /***/ }),
 
@@ -82772,10 +82779,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var js_cookie__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! js-cookie */ "./node_modules/js-cookie/src/js.cookie.js");
 /* harmony import */ var js_cookie__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(js_cookie__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _mutations_type__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./mutations.type */ "./resources/js/store/mutations.type.js");
+/* harmony import */ var _actions_type__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./actions.type */ "./resources/js/store/actions.type.js");
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 
 
+
 var _window$config = window.config,
     locale = _window$config.locale,
     locales = _window$config.locales; // state
@@ -82794,23 +82803,16 @@ var getters = {
   } // mutations
 
 };
-var mutations = _defineProperty({}, _mutations_type__WEBPACK_IMPORTED_MODULE_1__["SET_LOCALE"], function (state, _ref) {
-  var locale = _ref.locale;
+var mutations = _defineProperty({}, _mutations_type__WEBPACK_IMPORTED_MODULE_1__["SET_LOCALE"], function (state, locale) {
   state.locale = locale;
 }); // actions
 
-var actions = {
-  setLocale: function setLocale(_ref2, _ref3) {
-    var commit = _ref2.commit;
-    var locale = _ref3.locale;
-    commit(_mutations_type__WEBPACK_IMPORTED_MODULE_1__["SET_LOCALE"], {
-      locale: locale
-    });
-    js_cookie__WEBPACK_IMPORTED_MODULE_0___default.a.set('locale', locale, {
-      expires: 365
-    });
-  }
-};
+var actions = _defineProperty({}, _actions_type__WEBPACK_IMPORTED_MODULE_2__["CHANGE_LOCALE"], function (context, locale) {
+  context.commit(_mutations_type__WEBPACK_IMPORTED_MODULE_1__["SET_LOCALE"], locale);
+  js_cookie__WEBPACK_IMPORTED_MODULE_0___default.a.set('locale', locale, {
+    expires: 365
+  });
+});
 /* harmony default export */ __webpack_exports__["default"] = ({
   state: state,
   actions: actions,
@@ -82837,7 +82839,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SET_SETTINGS", function() { return SET_SETTINGS; });
 var SET_CATEGORIES = 'setCategories';
 var SET_PROJECTS = 'setProjects';
-var SET_LOCALE = 'SET_LOCALE';
+var SET_LOCALE = 'setLocale';
 var SET_EDUCATION = 'setEducation';
 var SET_EXPERIENCE = 'setExperience';
 var SET_SETTINGS = 'setSettings';
@@ -82962,14 +82964,15 @@ var actions = _defineProperty({}, _actions_type__WEBPACK_IMPORTED_MODULE_2__["FE
             context.commit(_mutations_type__WEBPACK_IMPORTED_MODULE_3__["SET_SETTINGS"], {
               settings: data
             });
-            _context.next = 10;
+            _context.next = 11;
             break;
 
           case 8:
             _context.prev = 8;
             _context.t0 = _context["catch"](0);
+            throw new Error(_context.t0);
 
-          case 10:
+          case 11:
           case "end":
             return _context.stop();
         }

diff --git a/resources/js/common/api.service.js b/resources/js/common/api.service.js
@@ -2,11 +2,13 @@ import Vue from 'vue'
 import axios from 'axios'
 import VueAxios from 'vue-axios'
 import { API_URL } from './config'
+import Cookies from "js-cookie";
 
 const ApiService = {
   init () {
     Vue.use(VueAxios, axios)
     Vue.axios.defaults.baseURL = API_URL
+    Vue.axios.defaults.headers.common['Content-Language'] = Cookies.get('locale') || 'en'
   },
 
   query (resource, params) {
@@ -102,9 +104,3 @@ export const ContactService = {
     return ApiService.post('contact/send', data);
   },
 }
-
-export const LanguageService = {
-  swap(locale) {
-    return ApiService.get('lang', locale);
-  },
-}
diff --git a/resources/js/components/LocaleMenu.vue b/resources/js/components/LocaleMenu.vue
@@ -15,6 +15,7 @@
 <script>
 import { mapGetters } from 'vuex'
 import { loadMessages } from '~/plugins/i18n'
+import { CHANGE_LOCALE } from "~/store/actions.type";
 
 export default {
   computed: mapGetters({
@@ -24,7 +25,7 @@ export default {
   methods: {
     setLocale (locale) {
       loadMessages(locale)
-      this.$store.dispatch('setLocale', { locale })
+      this.$store.dispatch(CHANGE_LOCALE, locale)
       this.$validator.localize(locale)
     }
   }

diff --git a/resources/js/plugins/i18n.js b/resources/js/plugins/i18n.js
@@ -23,6 +23,7 @@ export async function loadMessages (locale) {
 
   if (i18n.locale !== locale) {
     i18n.locale = locale
+    Vue.axios.defaults.headers.common['Content-Language'] = locale
   }
 }
 

diff --git a/resources/js/store/actions.type.js b/resources/js/store/actions.type.js
@@ -4,3 +4,4 @@ export const FETCH_EDUCATION = 'fetchEducation'
 export const FETCH_EXPERIENCE = 'fetchExperience'
 export const FETCH_SETTINGS = 'fetchSettings'
 export const SEND_CONTACT = 'sendContact'
+export const CHANGE_LOCALE = 'changeLocale'
diff --git a/resources/js/store/lang.module.js b/resources/js/store/lang.module.js
@@ -2,6 +2,9 @@ import Cookies from 'js-cookie'
 import {
   SET_LOCALE
 } from './mutations.type'
+import {
+  CHANGE_LOCALE
+} from "./actions.type";
 
 const { locale, locales } = window.config
 
@@ -19,16 +22,15 @@ export const getters = {
 
 // mutations
 export const mutations = {
-  [SET_LOCALE] (state, { locale }) {
+  [SET_LOCALE] (state, locale) {
     state.locale = locale
   }
 }
 
 // actions
 export const actions = {
-  setLocale ({ commit }, { locale }) {
-    commit(SET_LOCALE, { locale })
-
+  [CHANGE_LOCALE] (context, locale) {
+    context.commit(SET_LOCALE, locale)
     Cookies.set('locale', locale, { expires: 365 })
   }
 }

diff --git a/resources/js/store/mutations.type.js b/resources/js/store/mutations.type.js
@@ -1,6 +1,6 @@
 export const SET_CATEGORIES = 'setCategories'
 export const SET_PROJECTS = 'setProjects'
-export const SET_LOCALE = 'SET_LOCALE'
+export const SET_LOCALE = 'setLocale'
 export const SET_EDUCATION = 'setEducation'
 export const SET_EXPERIENCE = 'setExperience'
 export const SET_SETTINGS = 'setSettings'
diff --git a/resources/js/store/settings.module.js b/resources/js/store/settings.module.js
@@ -18,20 +18,9 @@ export const actions = {
       const { data } = await SettingsService.query(params)
 
       context.commit(SET_SETTINGS, { settings: data })
-    } catch (e) {
-
+    } catch (error) {
+      throw new Error(error)
     }
-
-    // return SettingsService.query(params)
-    //   .then(({ data }) => {
-    //     //data = JSON.parse(JSON.stringify(data));
-    //     //console.log(data);
-    //     context.commit(SET_SETTINGS, data)
-    //     return data
-    //   })
-    //   .catch(error => {
-    //     throw new Error(error)
-    //   })
   }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -23,6 +23,7 @@ export async function loadMessages (locale) { @@
       if (i18n.locale !== locale) {
         i18n.locale = locale
+        Vue.axios.defaults.headers.common['Content-Language'] = locale
       }
     }
@@ Expand Down @@