Typescriptify actions

ui/src/actions/AppAction.ts

@@ -1,11 +1,11 @@
-import dispatcher from '../stores/dispatcher';
+import axios, {AxiosResponse} from 'axios';
 import * as config from '../config';
-import axios from 'axios';
+import dispatcher from '../stores/dispatcher';
 import {snack} from './GlobalAction';
 
 /** Fetches all applications. */
 export function fetchApps() {
-    axios.get(config.get('url') + 'application').then((resp) => {
+    axios.get(config.get('url') + 'application').then((resp: AxiosResponse<IMessage[]>) => {
         dispatcher.dispatch({type: 'UPDATE_APPS', payload: resp.data});
     });
 }
@@ -14,7 +14,7 @@ export function fetchApps() {
  * Delete an application by id.
  * @param {int} id the application id
  */
-export function deleteApp(id) {
+export function deleteApp(id: number) {
     axios.delete(config.get('url') + 'application/' + id).then(() => {
         fetchApps();
         dispatcher.dispatch({type: 'DELETE_MESSAGES', payload: id});
@@ -26,7 +26,7 @@ export function deleteApp(id) {
  * @param {string} name the application name
  * @param {string} description the description of the application.
  */
-export function createApp(name, description) {
+export function createApp(name: string, description: string) {
     axios.post(config.get('url') + 'application', {name, description})
         .then(fetchApps)
         .then(() => snack('Application created'));
@@ -37,7 +37,7 @@ export function createApp(name, description) {
  * @param {int} id the application id
  * @param {Blob} file the description of the application.
  */
-export function uploadImage(id, file) {
+export function uploadImage(id: number, file: Blob) {
     const formData = new FormData();
     formData.append('file', file);
     axios.post(config.get('url') + 'application/' + id + '/image', formData,

ui/src/actions/ClientAction.ts

@@ -1,11 +1,11 @@
-import dispatcher from '../stores/dispatcher';
+import axios, {AxiosResponse} from 'axios';
 import * as config from '../config';
-import axios from 'axios';
+import dispatcher from '../stores/dispatcher';
 import {snack} from './GlobalAction';
 
 /** Fetches all clients. */
 export function fetchClients() {
-    axios.get(config.get('url') + 'client').then((resp) => {
+    axios.get(config.get('url') + 'client').then((resp: AxiosResponse<IClient[]>) => {
         dispatcher.dispatch({
             type: 'UPDATE_CLIENTS',
             payload: resp.data,
@@ -17,7 +17,7 @@ export function fetchClients() {
  * Delete a client by id.
  * @param {int} id the client id
  */
-export function deleteClient(id) {
+export function deleteClient(id: number) {
     axios.delete(config.get('url') + 'client/' + id).then(fetchClients).then(() => snack('Client deleted'));
 }
 
@@ -25,6 +25,6 @@ export function deleteClient(id) {
  * Create a client.
  * @param {string} name the client name
  */
-export function createClient(name) {
+export function createClient(name: string) {
     axios.post(config.get('url') + 'client', {name}).then(fetchClients).then(() => snack('Client created'));
 }

ui/src/actions/GlobalAction.ts

@@ -1,10 +1,11 @@
-import * as AppAction from './AppAction';
+import {AxiosResponse} from "axios";
-import * as UserAction from './UserAction';
-import * as MessageAction from './MessageAction';
-import * as ClientAction from './ClientAction';
 import dispatcher from '../stores/dispatcher';
+import * as AppAction from './AppAction';
+import * as ClientAction from './ClientAction';
+import * as MessageAction from './MessageAction';
+import * as UserAction from './UserAction';
 
-export function initialLoad(resp) {
+export function initialLoad(resp: AxiosResponse<IUser>) {
     AppAction.fetchApps();
     MessageAction.listenToWebSocket();
     ClientAction.fetchClients();
@@ -13,6 +14,6 @@ export function initialLoad(resp) {
     }
 }
 
-export function snack(message) {
+export function snack(message: string) {
     dispatcher.dispatch({type: 'SNACK', payload: message});
 }

ui/src/actions/MessageAction.ts

@@ -1,23 +1,24 @@
-import dispatcher from '../stores/dispatcher';
+import axios, {AxiosResponse} from 'axios';
 import * as config from '../config';
-import axios from 'axios';
+import dispatcher from '../stores/dispatcher';
 import {getToken} from './defaultAxios';
 import {snack} from './GlobalAction';
 import * as UserAction from './UserAction';
 
-export function fetchMessagesApp(id, since) {
+export function fetchMessagesApp(id: number, since: number) {
     if (id === -1) {
-        return axios.get(config.get('url') + 'message?since=' + since).then((resp) => {
+        return axios.get(config.get('url') + 'message?since=' + since).then((resp: AxiosResponse<IPagedMessages>) => {
             newMessages(-1, resp.data);
         });
     } else {
-        return axios.get(config.get('url') + 'application/' + id + '/message?since=' + since).then((resp) => {
+        return axios.get(config.get('url') + 'application/' + id + '/message?since=' + since)
+            .then((resp: AxiosResponse<IPagedMessages>) => {
                 newMessages(id, resp.data);
             });
     }
 }
 
-function newMessages(id, data) {
+function newMessages(id: number, data: IPagedMessages) {
     dispatcher.dispatch({
         type: 'UPDATE_MESSAGES', payload: {
             messages: data.messages,
@@ -32,7 +33,7 @@ function newMessages(id, data) {
  * Deletes all messages from the current user and an application.
  * @param {int} id the application id
  */
-export function deleteMessagesByApp(id) {
+export function deleteMessagesByApp(id: number) {
     if (id === -1) {
         axios.delete(config.get('url') + 'message').then(() => {
             dispatcher.dispatch({type: 'DELETE_MESSAGES', payload: -1});
@@ -47,7 +48,7 @@ export function deleteMessagesByApp(id) {
     }
 }
 
-export function deleteMessage(msg) {
+export function deleteMessage(msg: IMessage) {
     axios.delete(config.get('url') + 'message/' + msg.id).then(() => {
         dispatcher.dispatch({type: 'DELETE_MESSAGE', payload: msg});
         snack('Message deleted');
@@ -73,7 +74,7 @@ export function listenToWebSocket() {
         console.log('WebSocket connection errored', e);
     };
 
-    ws.onmessage = (data) => dispatcher.dispatch({type: 'ONE_MESSAGE', payload: JSON.parse(data.data)});
+    ws.onmessage = (data) => dispatcher.dispatch({type: 'ONE_MESSAGE', payload: JSON.parse(data.data) as IMessage});
 
     ws.onclose = () => {
         wsActive = false;

ui/src/actions/UserAction.ts

@@ -1,10 +1,10 @@
-import dispatcher from '../stores/dispatcher';
+import axios, {AxiosResponse} from 'axios';
+import {detect} from 'detect-browser';
 import * as config from '../config';
+import ClientStore from '../stores/ClientStore';
+import dispatcher from '../stores/dispatcher';
 import {getToken, setAuthorizationToken} from './defaultAxios';
 import * as GlobalAction from './GlobalAction';
-import axios from 'axios';
-import {detect} from 'detect-browser';
-import ClientStore from '../stores/ClientStore';
 import {snack} from './GlobalAction';
 
 /**
@@ -12,15 +12,16 @@ import {snack} from './GlobalAction';
  * @param {string} username
  * @param {string} password
  */
-export function login(username, password) {
+export function login(username: string, password: string) {
     const browser = detect();
     const name = (browser && browser.name + ' ' + browser.version) || 'unknown browser';
     authenticating();
-    axios.create().request(config.get('url') + 'client', {
+    axios.create().request({
+        url: config.get('url') + 'client',
         method: 'POST',
-        data: {name: name},
+        data: {name},
-        auth: {username: username, password: password},
+        auth: {username, password},
-    }).then(function(resp) {
+    }).then((resp) => {
         snack(`A client named '${name}' was created for your session.`);
         setAuthorizationToken(resp.data.token);
         tryAuthenticate().then(GlobalAction.initialLoad)
@@ -33,8 +34,9 @@ export function login(username, password) {
 
 /** Log the user out. */
 export function logout() {
-    if (getToken() !== null) {
+    const token = getToken();
-        axios.delete(config.get('url') + 'client/' + ClientStore.getIdByToken(getToken())).then(() => {
+    if (token !== null) {
+        axios.delete(config.get('url') + 'client/' + ClientStore.getIdByToken(token)).then(() => {
             setAuthorizationToken(null);
             noAuthentication();
         });
@@ -77,13 +79,13 @@ function authenticating() {
  * Changes the current user.
  * @param {string} pass
  */
-export function changeCurrentUser(pass) {
+export function changeCurrentUser(pass: string) {
     axios.post(config.get('url') + 'current/user/password', {pass}).then(() => snack('Password changed'));
 }
 
 /** Fetches all users. */
 export function fetchUsers() {
-    axios.get(config.get('url') + 'user').then(function(resp) {
+    axios.get(config.get('url') + 'user').then((resp: AxiosResponse<IUser[]>) => {
         dispatcher.dispatch({type: 'UPDATE_USERS', payload: resp.data});
     });
 }
@@ -92,7 +94,7 @@ export function fetchUsers() {
  * Delete a user.
  * @param {int} id the user id
  */
-export function deleteUser(id) {
+export function deleteUser(id: number) {
     axios.delete(config.get('url') + 'user/' + id).then(fetchUsers).then(() => snack('User deleted'));
 }
 
@@ -102,7 +104,7 @@ export function deleteUser(id) {
  * @param {string} pass
  * @param {bool} admin if true, the user is an administrator
  */
-export function createUser(name, pass, admin) {
+export function createUser(name: string, pass: string, admin: boolean) {
     axios.post(config.get('url') + 'user', {name, pass, admin}).then(fetchUsers).then(() => snack('User created'));
 }
 
@@ -113,8 +115,8 @@ export function createUser(name, pass, admin) {
  * @param {string} pass empty if no change
  * @param {bool} admin if true, the user is an administrator
  */
-export function updateUser(id, name, pass, admin) {
+export function updateUser(id: number, name: string, pass: string | null, admin: boolean) {
-    axios.post(config.get('url') + 'user/' + id, {name, pass, admin}).then(function() {
+    axios.post(config.get('url') + 'user/' + id, {name, pass, admin}).then(() => {
         fetchUsers();
         tryAuthenticate(); // try authenticate updates the current user
         snack('User updated');

ui/src/actions/defaultAxios.ts

@@ -8,7 +8,7 @@ const tokenKey = 'gotify-login-key';
  * Set the authorization token for the next requests.
  * @param {string|null} token the gotify application token
  */
-export function setAuthorizationToken(token) {
+export function setAuthorizationToken(token: string | null) {
     if (token) {
         localStorage.setItem(tokenKey, token);
         axios.defaults.headers.common['X-Gotify-Key'] = token;
@@ -40,6 +40,6 @@ axios.interceptors.response.use(undefined, (error) => {
 /**
  * @return {string} the application token
  */
-export function getToken() {
+export function getToken(): string | null {
     return localStorage.getItem(tokenKey);
 }