Begin transfering things to TS

Author: DaneEveritt

package.json

@@ -20,6 +20,8 @@
         "@babel/plugin-transform-async-to-generator": "^7.0.0-beta.49",
         "@babel/plugin-transform-runtime": "^7.0.0-beta.49",
         "@babel/preset-env": "^7.0.0-beta.49",
+        "@types/node": "^10.12.15",
+        "@types/webpack-env": "^1.13.6",
         "autoprefixer": "^8.2.0",
         "axios": "^0.18.0",
         "babel-cli": "6.18.0",
@@ -36,7 +38,6 @@
         "css-loader": "^0.28.11",
         "eslint": "^5.6.0",
         "eslint-config-vue": "^2.0.2",
-        "eslint-plugin-flowtype-errors": "^3.6.0",
         "eslint-plugin-html": "^4.0.6",
         "eslint-plugin-vue": "^4.7.1",
         "extract-text-webpack-plugin": "^4.0.0-beta.0",

resources/assets/scripts/app.js

@@ -11,7 +11,7 @@ require('./bootstrap');
 import { Ziggy } from './helpers/ziggy';
 import Locales from './../../../resources/lang/locales';
 import { flash } from './mixins/flash';
-import store from './store/index.js';
+import store from './store/index';
 import router from './router';
 
 window.events = new Vue();

resources/assets/scripts/components/server/components/PowerButtons.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-    import Status from './../../../helpers/statuses';
+    import Status from '../../../helpers/statuses';
     import { Socketio } from './../../../mixins/socketio';
     import { mapState } from 'vuex';
 

…urces/assets/scripts/helpers/statuses.js …urces/assets/scripts/helpers/statuses.tsresources/assets/scripts/helpers/statuses.js renamed to resources/assets/scripts/helpers/statuses.ts resources/assets/scripts/helpers/statuses.js renamed to resources/assets/scripts/helpers/statuses.ts

@@ -0,0 +1,88 @@
+
+type ServerAllocation = {
+    ip: string,
+    port: number,
+};
+
+type ServerLimits = {
+    memory: number,
+    swap: number,
+    disk: number,
+    io: number,
+    cpu: number,
+}
+
+type ServerFeatureLimits = {
+    databases: number,
+    allocations: number,
+};
+
+export type ServerData = {
+    identifier: string,
+    uuid: string,
+    name: string,
+    node: string,
+    description: string,
+    allocation: ServerAllocation,
+    limits: ServerLimits,
+    feature_limits: ServerFeatureLimits,
+};
+
+/**
+ * A model representing a server returned by the client API.
+ */
+export default class Server {
+    /**
+     * The server identifier, generally the 8-character representation of the server UUID.
+     */
+    identifier: string;
+
+    /**
+     * The long form identifier for this server.
+     */
+    uuid: string;
+
+    /**
+     * The human friendy name for this server.
+     */
+    name: string;
+
+    /**
+     * The name of the node that this server belongs to.
+     */
+    node: string;
+
+    /**
+     * A description of this server.
+     */
+    description: string;
+
+    /**
+     * The primary allocation details for this server.
+     */
+    allocation: ServerAllocation;
+
+    /**
+     * The base limits for this server when it comes to the actual docker container.
+     */
+    limits: ServerLimits;
+
+    /**
+     * The feature limits for this server, database & allocations currently.
+     */
+    featureLimits: ServerFeatureLimits;
+
+    /**
+     * Construct a new server model instance.
+     */
+    constructor (data: ServerData) {
+        this.identifier = data.identifier;
+        this.uuid = data.uuid;
+        this.name = data.name;
+        this.node = data.node;
+        this.description = data.description;
+        this.allocation = data.allocation;
+        this.limits = data.limits;
+        this.featureLimits = data.feature_limits;
+    }
+}

resources/assets/scripts/models/server.js

@@ -0,0 +1,53 @@
+export type UserData = {
+    root_admin: boolean,
+    username: string,
+    email: string,
+    first_name: string,
+    last_name: string,
+    language: string,
+};
+
+/**
+ * A user model that represents an user in Pterodactyl.
+ */
+export default class User {
+    /**
+     * Determines wether or not the user is an admin.
+     */
+    admin: boolean;
+
+    /**
+     * The username for the currently authenticated user.
+     */
+    username: string;
+
+    /**
+     * The currently authenticated users email address.
+     */
+    email: string;
+
+    /**
+     * The full name of the logged in user.
+     */
+    name: string;
+    first_name: string;
+    last_name: string;
+
+    /**
+     * The language the user has selected to use.
+     */
+    language: string;
+
+    /**
+     * Create a new user model.
+     */
+    constructor(data: UserData) {
+        this.admin = data.root_admin;
+        this.username = data.username;
+        this.email = data.email;
+        this.name = `${data.first_name} ${data.last_name}`;
+        this.first_name = data.first_name;
+        this.last_name = data.last_name;
+        this.language = data.language;
+    }
+}

resources/assets/scripts/models/server.ts

@@ -1,4 +1,4 @@
-import VueRouter from 'vue-router';
+import VueRouter, {Route} from 'vue-router';
 import store from './store/index';
 
 const route = require('./../../../vendor/tightenco/ziggy/src/js/route').default;
@@ -17,7 +17,7 @@ import {
     DatabasesPage,
     ServerSchedules,
     ServerSettings,
-    ServerSubusers
+    ServerSubusers,
 } from './components/server';
 
 const routes = [
@@ -28,31 +28,32 @@ const routes = [
         name: 'reset-password',
         path: '/auth/password/reset/:token',
         component: ResetPassword,
-        props: function (route) {
+        props: function (route: Route) {
             return {token: route.params.token, email: route.query.email || ''};
-        }
+        },
     },
 
     {name: 'dashboard', path: '/', component: Dashboard},
     {name: 'account', path: '/account', component: Account},
     {name: 'account.api', path: '/account/api', component: Account},
     {name: 'account.security', path: '/account/security', component: Account},
 
-    { path: '/server/:id', component: Server,
+    {
+        path: '/server/:id', component: Server,
         children: [
-            { name: 'server', path: '', component: ConsolePage },
-            { name: 'server-files', path: 'files/:path(.*)?', component: FileManagerPage },
-            { name: 'server-subusers', path: 'subusers', component: ServerSubusers },
-            { name: 'server-schedules', path: 'schedules', component: ServerSchedules },
-            { name: 'server-databases', path: 'databases', component: DatabasesPage },
-            { name: 'server-allocations', path: 'allocations', component: ServerAllocations },
-            { name: 'server-settings', path: 'settings', component: ServerSettings },
-        ]
-    }
+            {name: 'server', path: '', component: ConsolePage},
+            {name: 'server-files', path: 'files/:path(.*)?', component: FileManagerPage},
+            {name: 'server-subusers', path: 'subusers', component: ServerSubusers},
+            {name: 'server-schedules', path: 'schedules', component: ServerSchedules},
+            {name: 'server-databases', path: 'databases', component: DatabasesPage},
+            {name: 'server-allocations', path: 'allocations', component: ServerAllocations},
+            {name: 'server-settings', path: 'settings', component: ServerSettings},
+        ],
+    },
 ];
 
 const router = new VueRouter({
-    mode: 'history', routes
+    mode: 'history', routes,
 });
 
 // Redirect the user to the login page if they try to access a protected route and

resources/assets/scripts/models/user.js

@@ -1,12 +1,19 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
-import auth from './modules/auth';
-import dashboard from './modules/dashboard';
-import server from './modules/server';
-import socket from './modules/socket';
+import auth, {AuthenticationState} from './modules/auth';
+import dashboard, {DashboardState} from './modules/dashboard';
+import server, {ServerState} from './modules/server';
+import socket, {SocketState} from './modules/socket';
 
 Vue.use(Vuex);
 
+export type ApplicationState = {
+    socket: SocketState,
+    server: ServerState,
+    auth: AuthenticationState,
+    dashboard: DashboardState,
+}
+
 const store = new Vuex.Store({
     strict: process.env.NODE_ENV !== 'production',
     modules: {auth, dashboard, server, socket},