0.0.12

- Add client TZ support + Selectable on user page
- Move token auth to GET ?key=XYZ for wider webhook support
- Add Multiscrobbler support
- Add /api/v1/serverinfo for version information

web/src/Api/index.js

@@ -3,18 +3,24 @@ import jwt from 'jwt-decode'
 import { toast } from 'react-toastify';
 
 function getHeaders() {
-  // Todo: move this to use Context values instead.
+  // TODO: move this to use Context values instead.
   const user = JSON.parse(localStorage.getItem('user'));
 
   if (user && user.jwt) {
-    return { Authorization: 'Bearer ' + user.jwt, changeOrigin: true };
+    var unixtime = Math.round((new Date()).getTime() / 1000);
+    if (user.exp < unixtime) {
+      // TODO: Handle expiry nicer
+      toast.warning("Session expired. Please log in again")
+    }
+
+    return { Authorization: 'Bearer ' + user.jwt };
   } else {
     return {};
   }
 }
 
 function getUserUuid() {
-  // Todo: move this to use Context values instead.
+  // TODO: move this to use Context values instead.
   const user = JSON.parse(localStorage.getItem('user'));
 
   if (user && user.uuid) {
@@ -179,6 +185,15 @@ export const getUser = () => {
     });
 };
 
+export const patchUser = (values) => {
+  return axios.patch(process.env.REACT_APP_API_URL + "user", values, { headers: getHeaders() })
+    .then((data) => {
+      return data.data;
+    }).catch((error) => {
+      return handleErrorResp(error)
+    });
+};
+
 export const validateResetPassword = (tokenStr) => {
   return axios.get(process.env.REACT_APP_API_URL + "user/", { headers: getHeaders() })
     .then((data) => {

web/src/Pages/User.css

@@ -1,4 +1,9 @@
 .userBody {
   padding: 20px 5px 5px 5px;
   font-size: 16pt;
+}
+
+.userDropdown {
+  color: #282C34;
+  font-size: 12pt;
 }

web/src/Pages/User.js

@@ -4,9 +4,11 @@ import './User.css';
 import { useHistory } from "react-router";
 import AuthContext from '../Contexts/AuthContext';
 import ScaleLoader from 'react-spinners/ScaleLoader';
-import { getUser } from '../Api/index'
+import { getUser, patchUser } from '../Api/index'
 import { Button } from 'reactstrap';
+
 import { spotifyConnectionRequest, spotifyDisonnectionRequest } from '../Api/index'
+import TimezoneSelect from 'react-timezone-select'
 
 const User = () => {
   const history = useHistory();
@@ -14,6 +16,11 @@ const User = () => {
   const [loading, setLoading] = useState(true);
   const [userdata, setUserdata] = useState({});
 
+  const updateTimezone = (vals) => {
+    console.log(vals)
+    setUserdata({...userdata, timezone: vals});
+    patchUser({timezone: vals.value})
+  }
 
   useEffect(() => {
     if (!user) {
@@ -45,6 +52,12 @@ const User = () => {
         Welcome {userdata.username}
       </h1>
       <p className="userBody">
+      Timezone<br/>
+      <TimezoneSelect
+          className="userDropdown"
+          value={userdata.timezone}
+          onChange={updateTimezone}
+      /><br/>
         Created At: {userdata.created_at}<br/>
         Email: {userdata.email}<br/>
         Verified: {userdata.verified ? '✓' : '✖'}<br/>