From 430af8306b1ab17e59a6dabf8f65ab816d28695d Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Wed, 19 Sep 2018 04:45:50 -0300
Subject: Switch to Nuxt.js

---
 src/site/pages/dashboard/albums.vue   | 371 ++++++++++++++++++++++++++++++++++
 src/site/pages/dashboard/index.vue    |  76 +++++++
 src/site/pages/dashboard/settings.vue |  75 +++++++
 3 files changed, 522 insertions(+)
 create mode 100644 src/site/pages/dashboard/albums.vue
 create mode 100644 src/site/pages/dashboard/index.vue
 create mode 100644 src/site/pages/dashboard/settings.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
new file mode 100644
index 0000000..f8c0e36
--- /dev/null
+++ b/src/site/pages/dashboard/albums.vue
@@ -0,0 +1,371 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar/>
+					</div>
+					<div class="column">
+
+						<h2 class="subtitle">Manage your albums</h2>
+						<hr>
+
+						<div class="search-container">
+							<b-field>
+								<b-input v-model="newAlbumName"
+									placeholder="Album name..."
+									type="text"
+									@keyup.enter.native="createAlbum" />
+								<p class="control">
+									<button class="button is-primary"
+										@click="createAlbum">Create album</button>
+								</p>
+							</b-field>
+						</div>
+
+						<div class="view-container">
+							<div v-for="album in albums"
+								:key="album.id"
+								class="album">
+								<div class="arrow-container"
+									@click="album.isDetailsOpen = !album.isDetailsOpen">
+									<i :class="{ active: album.isDetailsOpen }"
+										class="icon-arrow" />
+								</div>
+								<div class="thumb">
+									<figure class="image is-64x64 thumb">
+										<img src="../../assets/images/blank.png">
+									</figure>
+								</div>
+								<div class="info">
+									<h4>
+										<router-link :to="`/dashboard/albums/${album.id}`">{{ album.name }}</router-link>
+									</h4>
+									<span>Updated <timeago :since="album.editedAt" /></span>
+									<span>{{ album.fileCount || 0 }} files</span>
+								</div>
+								<div class="latest is-hidden-mobile">
+									<template v-if="album.fileCount > 0">
+										<div v-for="file of album.files"
+											:key="file.id"
+											class="thumb">
+											<figure class="image is-64x64">
+												<a :href="file.url"
+													target="_blank">
+													<img :src="file.thumbSquare">
+												</a>
+											</figure>
+										</div>
+										<div v-if="album.fileCount > 5"
+											class="thumb more no-background">
+											<router-link :to="`/dashboard/albums/${album.id}`">{{ album.fileCount - 5 }}+ more</router-link>
+										</div>
+									</template>
+									<template v-else>
+										<span class="no-files">Nothing to show here</span>
+									</template>
+								</div>
+
+								<div v-if="album.isDetailsOpen"
+									class="details">
+
+
+									<h2>Public links for this album:</h2>
+
+									<b-table
+										:data="album.links.length ? album.links : []"
+										:mobile-cards="true">
+										<template slot-scope="props">
+											<b-table-column field="identifier"
+												label="Link"
+												centered>
+												<a :href="`${config.URL}/a/${props.row.identifier}`"
+													target="_blank">
+													{{ props.row.identifier }}
+												</a>
+											</b-table-column>
+
+											<b-table-column field="views"
+												label="Views"
+												centered>
+												{{ props.row.views }}
+											</b-table-column>
+
+											<b-table-column field="enableDownload"
+												label="Allow download"
+												centered>
+												<b-switch v-model="props.row.enableDownload"
+													@input="linkOptionsChanged(props.row)" />
+											</b-table-column>
+
+											<b-table-column field="enabled"
+												label="Enabled"
+												centered>
+												<b-switch v-model="props.row.enabled"
+													@input="linkOptionsChanged(props.row)" />
+											</b-table-column>
+
+											<!--
+												Until it's decided if we want to delete links or just hide them from the list
+												this setting will be hidden. Discussion about it is encouraged on Discord.
+											-->
+											<!--
+											<b-table-column field="actions"
+												label="Actions"
+												centered>
+												<button class="button is-danger"
+													@click="deleteLink(props.row.identifier)">Delete link</button>
+											</b-table-column>
+											-->
+										</template>
+										<template slot="empty">
+											<div class="has-text-centered">
+												<i class="icon-misc-mood-sad" />
+											</div>
+											<div class="has-text-centered">
+												Nothing here
+											</div>
+										</template>
+										<template slot="footer">
+											<div class="has-text-right">
+												<button :class="{ 'is-loading': album.isCreatingLink }"
+													class="button is-primary"
+													style="float: left"
+													@click="createLink(album)">Create new link</button>
+												{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
+											</div>
+										</template>
+									</b-table>
+
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '../../components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			albums: [],
+			newAlbumName: null
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getAlbums();
+		this.$ga.page({
+			page: '/dashboard/albums',
+			title: 'Albums',
+			location: window.location.href
+		});
+	},
+	methods: {
+		async linkOptionsChanged(link) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/link/edit`,
+					{
+						identifier: link.identifier,
+						enableDownload: link.enableDownload,
+						enabled: link.enabled
+					});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async createLink(album) {
+			album.isCreatingLink = true;
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/link/new`,
+					{ albumId: album.id });
+				this.$toast.open(response.data.message);
+				album.links.push({
+					identifier: response.data.identifier,
+					views: 0,
+					enabled: true,
+					enableDownload: true,
+					expiresAt: null
+				});
+				album.isCreatingLink = false;
+			} catch (error) {
+				this.$onPromiseError(error);
+				album.isCreatingLink = false;
+			}
+		},
+		async createAlbum() {
+			if (!this.newAlbumName || this.newAlbumName === '') return;
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/new`,
+					{ name: this.newAlbumName });
+				this.newAlbumName = null;
+				this.$toast.open(response.data.message);
+				this.getAlbums();
+				return;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async getAlbums() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/albums/mini`);
+				for (const album of response.data.albums) {
+					album.isDetailsOpen = false;
+				}
+				this.albums = response.data.albums;
+				console.log(this.albums);
+			} catch (error) {
+				console.error(error);
+			}
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
new file mode 100644
index 0000000..0d89aaf
--- /dev/null
+++ b/src/site/pages/dashboard/index.vue
@@ -0,0 +1,76 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar/>
+					</div>
+					<div class="column">
+						<!--
+						<h1 class="title">Uploads</h1>
+						<h2 class="subtitle">Keep track of all your uploads in here</h2>
+						<hr>
+						-->
+						<Grid v-if="files.length"
+							:files="files" />
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+import Grid from '~/components/grid/Grid.vue';
+
+export default {
+	components: {
+		Sidebar,
+		Grid
+	},
+	data() {
+		return { files: [] };
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getFiles();
+		this.$ga.page({
+			page: '/dashboard',
+			title: 'Dashboard',
+			location: window.location.href
+		});
+	},
+	methods: {
+		async getFiles() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/files`);
+				this.files = response.data.files;
+				console.log(this.files);
+			} catch (error) {
+				console.error(error);
+			}
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
new file mode 100644
index 0000000..d6c6189
--- /dev/null
+++ b/src/site/pages/dashboard/settings.vue
@@ -0,0 +1,75 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<!--
+						<h1 class="title">Uploads</h1>
+						<h2 class="subtitle">Keep track of all your uploads in here</h2>
+						<hr>
+						-->
+
+						<div class="field">
+							<b-switch v-model="options.removeExif"
+								true-value="Remove exif data when uploading files"
+								false-value="Don't remove exif data when uploading files"
+								type="is-success">
+								{{ options.removeExif }}
+							</b-switch>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			options: {
+				removeExif: false
+			}
+		};
+	},
+	metaInfo() {
+		return { title: 'Settings' };
+	},
+	mounted() {
+		this.$ga.page({
+			page: '/dashboard/settings',
+			title: 'Settings',
+			location: window.location.href
+		});
+	},
+	methods: {
+
+	}
+};
+</script>
-- 
cgit v1.2.3


From 8be134c8d8b4cd588fdeef50a1e5d07f0564696c Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 26 Feb 2019 22:26:03 +0900
Subject: Settings page and other things

---
 src/site/pages/dashboard/albums.vue   |   5 +-
 src/site/pages/dashboard/index.vue    |   2 +
 src/site/pages/dashboard/settings.vue | 101 ++++++++++++++++++++++++++++++----
 3 files changed, 93 insertions(+), 15 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
index f8c0e36..d900f70 100644
--- a/src/site/pages/dashboard/albums.vue
+++ b/src/site/pages/dashboard/albums.vue
@@ -135,10 +135,9 @@
 			<div class="container">
 				<div class="columns">
 					<div class="column is-narrow">
-						<Sidebar/>
+						<Sidebar />
 					</div>
 					<div class="column">
-
 						<h2 class="subtitle">Manage your albums</h2>
 						<hr>
 
@@ -200,8 +199,6 @@
 
 								<div v-if="album.isDetailsOpen"
 									class="details">
-
-
 									<h2>Public links for this album:</h2>
 
 									<b-table
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 0d89aaf..3834522 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -19,6 +19,8 @@
 						<Sidebar/>
 					</div>
 					<div class="column">
+						<h2 class="subtitle">Your uploaded files</h2>
+						<hr>
 						<!--
 						<h1 class="title">Uploads</h1>
 						<h2 class="subtitle">Keep track of all your uploads in here</h2>
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index d6c6189..19b0c5b 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -23,20 +23,99 @@
 						<Sidebar />
 					</div>
 					<div class="column">
+						<h2 class="subtitle">Service settings</h2>
+						<hr>
 						<!--
 						<h1 class="title">Uploads</h1>
 						<h2 class="subtitle">Keep track of all your uploads in here</h2>
 						<hr>
 						-->
 
-						<div class="field">
+						<b-field label="Service name"
+							message="Please enter the name which this service is gonna be identified as"
+							horizontal>
+							<b-input v-model="options.serviceName"
+								expanded />
+						</b-field>
+
+						<b-field label="Upload folder"
+							message="Where to store the files relative to the working directory"
+							horizontal>
+							<b-input v-model="options.uploadFolder"
+								expanded />
+						</b-field>
+
+						<b-field label="Links per album"
+							message="Maximum links allowed per album"
+							horizontal>
+							<b-input v-model="options.linksPerAlbum"
+								type="number"
+								expanded />
+						</b-field>
+
+						<b-field label="Max upload size"
+							message="Maximum allowed file size in MB"
+							horizontal>
+							<b-input v-model="options.maxUploadSize"
+								expanded />
+						</b-field>
+
+						<b-field label="Filename length"
+							message="How many characters long should the generated filenames be"
+							horizontal>
+							<b-input v-model="options.filenameLength"
+								expanded />
+						</b-field>
+
+						<b-field label="Album link length"
+							message="How many characters a link for an album should have"
+							horizontal>
+							<b-input v-model="options.albumLength"
+								expanded />
+						</b-field>
+
+						<b-field label="Generate thumbnails"
+							message="Generate thumbnails when uploading a file if possible"
+							horizontal>
+							<b-switch v-model="options.generateThumbnails"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Generate zips"
+							message="Allow generating zips to download entire albums"
+							horizontal>
+							<b-switch v-model="options.generateZips"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Strip EXIF"
+							message="Remove EXIF metadata from uploaded files"
+							horizontal>
 							<b-switch v-model="options.removeExif"
-								true-value="Remove exif data when uploading files"
-								false-value="Don't remove exif data when uploading files"
-								type="is-success">
-								{{ options.removeExif }}
-							</b-switch>
-						</div>
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Public mode"
+							message="Enable anonymous uploades"
+							horizontal>
+							<b-switch v-model="options.publicMode"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Enable creating account"
+							message="Enable creating new accounts in the platform"
+							horizontal>
+							<b-switch v-model="options.userAccounts"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<button class="button is-primary"
+							@click="restartService">Restart service</button>
 					</div>
 				</div>
 			</div>
@@ -53,9 +132,7 @@ export default {
 	},
 	data() {
 		return {
-			options: {
-				removeExif: false
-			}
+			options: {}
 		};
 	},
 	metaInfo() {
@@ -69,7 +146,9 @@ export default {
 		});
 	},
 	methods: {
-
+		async restartService() {
+			//
+		}
 	}
 };
 </script>
-- 
cgit v1.2.3


From 7a74647d3e5b5681b9d5d3fa9b6e12d062232683 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 26 Feb 2019 23:13:24 +0900
Subject: User management

---
 src/site/pages/dashboard/users.vue | 257 +++++++++++++++++++++++++++++++++++++
 1 file changed, 257 insertions(+)
 create mode 100644 src/site/pages/dashboard/users.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
new file mode 100644
index 0000000..df16918
--- /dev/null
+++ b/src/site/pages/dashboard/users.vue
@@ -0,0 +1,257 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Manage your users</h2>
+						<hr>
+
+						<div class="view-container">
+							<b-table
+								:data="users || []"
+								:mobile-cards="true">
+								<template slot-scope="props">
+									<b-table-column field="id"
+										label="Id"
+										centered>
+										{{ props.row.id }}
+									</b-table-column>
+
+									<b-table-column field="username"
+										label="Username"
+										centered>
+										{{ props.row.username }}
+									</b-table-column>
+
+									<b-table-column field="enabled"
+										label="Enabled"
+										centered>
+										<b-switch v-model="props.row.enabled"
+											@input="changeEnabledStatus(props.row)" />
+									</b-table-column>
+
+									<b-table-column field="isAdmin"
+										label="Admin"
+										centered>
+										<b-switch v-model="props.row.isAdmin"
+											@input="changeIsAdmin(props.row)" />
+									</b-table-column>
+								</template>
+								<template slot="empty">
+									<div class="has-text-centered">
+										<i class="icon-misc-mood-sad" />
+									</div>
+									<div class="has-text-centered">
+										Nothing here
+									</div>
+								</template>
+								<template slot="footer">
+									<div class="has-text-right">
+										{{ users.length }} users
+									</div>
+								</template>
+							</b-table>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '../../components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			users: []
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getUsers();
+		this.$ga.page({
+			page: '/dashboard/users',
+			title: 'Users',
+			location: window.location.href
+		});
+	},
+	methods: {
+		async getUsers() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/admin/users`);
+				this.users = response.data.users;
+				console.log(this.users);
+			} catch (error) {
+				console.error(error);
+			}
+		},
+		async changeEnabledStatus(row) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/admin/users/${row.enabled ? 'enable' : 'disable'}`, {
+					id: row.id
+				});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				console.error(error);
+			}
+		},
+		async changeIsAdmin(row) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
+					id: row.id
+				});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				console.error(error);
+			}
+		}
+	}
+};
+</script>
-- 
cgit v1.2.3


From f37d20694386e59622fdfab586a9b580011efce6 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 28 Feb 2019 23:26:28 +0900
Subject: Change password and api keys

---
 src/site/pages/dashboard/account.vue | 153 +++++++++++++++++++++++++++++++++++
 1 file changed, 153 insertions(+)
 create mode 100644 src/site/pages/dashboard/account.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
new file mode 100644
index 0000000..e3570c7
--- /dev/null
+++ b/src/site/pages/dashboard/account.vue
@@ -0,0 +1,153 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Account settings</h2>
+						<hr>
+
+						<b-field label="Username"
+							message="Nothing to do here"
+							horizontal>
+							<b-input v-model="user.username"
+								expanded
+								disabled />
+						</b-field>
+
+						<b-field label="Current password"
+							message="If you want to change your password input the current one here"
+							horizontal>
+							<b-input v-model="user.password"
+								type="password"
+								expanded />
+						</b-field>
+
+						<b-field label="New password"
+							message="Your new password"
+							horizontal>
+							<b-input v-model="user.newPassword"
+								type="password"
+								expanded />
+						</b-field>
+
+						<b-field label="New password again"
+							message="Your new password once again"
+							horizontal>
+							<b-input v-model="user.reNewPassword"
+								type="password"
+								expanded />
+						</b-field>
+
+						<div class="mb2 mt2 text-center">
+							<button class="button is-primary"
+								@click="changePassword">Change password</button>
+						</div>
+
+						<b-field label="Api key"
+							message="This API key lets you use the service from other apps?"
+							horizontal>
+							<b-input v-model="user.apiKey"
+								expanded />
+						</b-field>
+
+						<div class="mb2 mt2 text-center">
+							<button class="button is-primary"
+								@click="promptNewAPIKey">Request new API key</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			user: {}
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Account' };
+	},
+	mounted() {
+		this.$ga.page({
+			page: '/dashboard/account',
+			title: 'Settings',
+			location: window.location.href
+		});
+		this.getUserSetttings();
+	},
+	methods: {
+		async getUserSetttings() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/users/me`);
+				this.user = response.data.user;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async changePassword() {
+			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) return;
+			if (this.user.newPassword !== this.user.reNewPassword) return;
+
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/user/password/change`,
+					{
+						password: this.user.password,
+						newPassword: this.user.newPassword
+					});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		promptNewAPIKey() {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to regenerate your API key?',
+				onConfirm: () => this.requestNewAPIKey()
+			});
+		},
+		async requestNewAPIKey() {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/user/apikey/change`);
+				this.user.apiKey = response.data.apiKey;
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		}
+	}
+};
+</script>
-- 
cgit v1.2.3


From c169ab6dc1727c7ca5dd45fcaeb419b44cbf1908 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 28 Feb 2019 23:26:44 +0900
Subject: Some stuff

---
 src/site/pages/dashboard/settings.vue | 42 ++++++++++++++++++++++++++++++-----
 src/site/pages/dashboard/users.vue    |  6 ++---
 2 files changed, 39 insertions(+), 9 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 19b0c5b..a71358e 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -70,7 +70,7 @@
 						<b-field label="Album link length"
 							message="How many characters a link for an album should have"
 							horizontal>
-							<b-input v-model="options.albumLength"
+							<b-input v-model="options.albumLinkLength"
 								expanded />
 						</b-field>
 
@@ -93,7 +93,7 @@
 						<b-field label="Strip EXIF"
 							message="Remove EXIF metadata from uploaded files"
 							horizontal>
-							<b-switch v-model="options.removeExif"
+							<b-switch v-model="options.stripExif"
 								:true-value="true"
 								:false-value="false" />
 						</b-field>
@@ -109,13 +109,15 @@
 						<b-field label="Enable creating account"
 							message="Enable creating new accounts in the platform"
 							horizontal>
-							<b-switch v-model="options.userAccounts"
+							<b-switch v-model="options.enableAccounts"
 								:true-value="true"
 								:false-value="false" />
 						</b-field>
 
-						<button class="button is-primary"
-							@click="restartService">Restart service</button>
+						<div class="mb2 mt2 text-center">
+							<button class="button is-primary"
+								@click="promptRestartService">Save and restart service</button>
+						</div>
 					</div>
 				</div>
 			</div>
@@ -135,6 +137,11 @@ export default {
 			options: {}
 		};
 	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
 	metaInfo() {
 		return { title: 'Settings' };
 	},
@@ -144,10 +151,33 @@ export default {
 			title: 'Settings',
 			location: window.location.href
 		});
+
+		this.getSettings();
 	},
 	methods: {
+		async getSettings() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/service/config`);
+				this.options = response.data.config;
+				console.log(this.options);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		promptRestartService() {
+			this.$dialog.confirm({
+				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
+				onConfirm: () => this.restartService()
+			});
+		},
 		async restartService() {
-			//
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/service/restart`);
+				this.$toast.open(response.data.message);
+				return;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index df16918..c930876 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -229,7 +229,7 @@ export default {
 				this.users = response.data.users;
 				console.log(this.users);
 			} catch (error) {
-				console.error(error);
+				this.$onPromiseError(error);
 			}
 		},
 		async changeEnabledStatus(row) {
@@ -239,7 +239,7 @@ export default {
 				});
 				this.$toast.open(response.data.message);
 			} catch (error) {
-				console.error(error);
+				this.$onPromiseError(error);
 			}
 		},
 		async changeIsAdmin(row) {
@@ -249,7 +249,7 @@ export default {
 				});
 				this.$toast.open(response.data.message);
 			} catch (error) {
-				console.error(error);
+				this.$onPromiseError(error);
 			}
 		}
 	}
-- 
cgit v1.2.3


From 9f5a3d15f55fea03052627f3bd4d97a4284cdf7c Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 28 Feb 2019 23:51:59 +0900
Subject: Purge user's files

---
 src/site/pages/dashboard/users.vue | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index c930876..59a75d3 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -171,6 +171,12 @@
 										<b-switch v-model="props.row.isAdmin"
 											@input="changeIsAdmin(props.row)" />
 									</b-table-column>
+
+									<b-table-column field="purge"
+										centered>
+										<button class="button is-primary"
+											@click="promptPurgeFiles(props.row)">Purge files</button>
+									</b-table-column>
 								</template>
 								<template slot="empty">
 									<div class="has-text-centered">
@@ -251,6 +257,22 @@ export default {
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
+		},
+		promptPurgeFiles(row) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this user\'s files?',
+				onConfirm: () => this.purgeFiles(row)
+			});
+		},
+		async purgeFiles(row) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/admin/users/purge`, {
+					id: row.id
+				});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
 		}
 	}
 };
-- 
cgit v1.2.3


From ce76a8ec7ba2084ab75fb901933b3d4d84505032 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 2 Mar 2019 22:07:24 +0900
Subject: Be able to add a file to multiple albums

---
 src/site/pages/dashboard/index.vue | 72 +++++++++++++++++++++++++++++++++-----
 1 file changed, 64 insertions(+), 8 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 3834522..76c465b 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -4,6 +4,8 @@
 	section.hero div.hero-body {
 		align-items: baseline;
 	}
+
+	.albumsModal .columns .column { padding: .25rem; }
 </style>
 <style lang="scss">
 	@import '~/assets/styles/_colors.scss';
@@ -16,22 +18,40 @@
 			<div class="container">
 				<div class="columns">
 					<div class="column is-narrow">
-						<Sidebar/>
+						<Sidebar />
 					</div>
 					<div class="column">
 						<h2 class="subtitle">Your uploaded files</h2>
 						<hr>
-						<!--
-						<h1 class="title">Uploads</h1>
-						<h2 class="subtitle">Keep track of all your uploads in here</h2>
-						<hr>
-						-->
 						<Grid v-if="files.length"
 							:files="files" />
 					</div>
 				</div>
 			</div>
 		</div>
+
+		<b-modal :active.sync="isAlbumsModalActive"
+			:width="640"
+			scroll="keep">
+			<div class="card albumsModal">
+				<div class="card-content">
+					<div class="content">
+						<h3 class="subtitle">Select the albums this file should be a part of</h3>
+						<hr>
+						<div class="columns is-multiline">
+							<div v-for="(album, index) in albums"
+								:key="index"
+								class="column is-3">
+								<div class="field">
+									<b-checkbox :value="isAlbumSelected(album.id)"
+										@input="albumCheckboxClicked($event, album.id)">{{ album.name }}</b-checkbox>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</b-modal>
 	</section>
 </template>
 
@@ -45,7 +65,12 @@ export default {
 		Grid
 	},
 	data() {
-		return { files: [] };
+		return {
+			files: [],
+			albums: [],
+			isAlbumsModalActive: false,
+			showingModalForFile: null
+		};
 	},
 	computed: {
 		config() {
@@ -57,6 +82,7 @@ export default {
 	},
 	mounted() {
 		this.getFiles();
+		this.getAlbums();
 		this.$ga.page({
 			page: '/dashboard',
 			title: 'Dashboard',
@@ -64,14 +90,44 @@ export default {
 		});
 	},
 	methods: {
+		isAlbumSelected(id) {
+			if (!this.showingModalForFile) return;
+			const found = this.showingModalForFile.albums.find(el => el.id === id);
+			return found ? found.id ? true : false : false;
+		},
+		openAlbumModal(file) {
+			this.showingModalForFile = file;
+			this.isAlbumsModalActive = true;
+		},
+		async albumCheckboxClicked(value, id) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/file/album/${value ? 'add' : 'del'}`, {
+					albumId: id,
+					fileId: this.showingModalForFile.id
+				});
+				this.$toast.open(response.data.message);
+
+				// Not the prettiest solution to refetch on each click but it'll do for now
+				this.getFiles();
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
 		async getFiles() {
 			try {
 				const response = await this.axios.get(`${this.config.baseURL}/files`);
 				this.files = response.data.files;
-				console.log(this.files);
 			} catch (error) {
 				console.error(error);
 			}
+		},
+		async getAlbums() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/albums/dropdown`);
+				this.albums = response.data.albums;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
 		}
 	}
 };
-- 
cgit v1.2.3


From 789f5fc259b90dd6a3b21fd2aef1a9e54a19506e Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 2 Mar 2019 22:16:35 +0900
Subject: Removed google analytics

---
 src/site/pages/dashboard/account.vue  | 7 +------
 src/site/pages/dashboard/albums.vue   | 5 -----
 src/site/pages/dashboard/index.vue    | 5 -----
 src/site/pages/dashboard/settings.vue | 6 ------
 src/site/pages/dashboard/users.vue    | 5 -----
 5 files changed, 1 insertion(+), 27 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index e3570c7..8e3bc65 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -64,7 +64,7 @@
 						</div>
 
 						<b-field label="Api key"
-							message="This API key lets you use the service from other apps?"
+							message="This API key lets you use the service from other apps"
 							horizontal>
 							<b-input v-model="user.apiKey"
 								expanded />
@@ -102,11 +102,6 @@ export default {
 		return { title: 'Account' };
 	},
 	mounted() {
-		this.$ga.page({
-			page: '/dashboard/account',
-			title: 'Settings',
-			location: window.location.href
-		});
 		this.getUserSetttings();
 	},
 	methods: {
diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
index d900f70..abf3334 100644
--- a/src/site/pages/dashboard/albums.vue
+++ b/src/site/pages/dashboard/albums.vue
@@ -299,11 +299,6 @@ export default {
 	},
 	mounted() {
 		this.getAlbums();
-		this.$ga.page({
-			page: '/dashboard/albums',
-			title: 'Albums',
-			location: window.location.href
-		});
 	},
 	methods: {
 		async linkOptionsChanged(link) {
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 76c465b..565d64b 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -83,11 +83,6 @@ export default {
 	mounted() {
 		this.getFiles();
 		this.getAlbums();
-		this.$ga.page({
-			page: '/dashboard',
-			title: 'Dashboard',
-			location: window.location.href
-		});
 	},
 	methods: {
 		isAlbumSelected(id) {
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index a71358e..02bf5d2 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -146,12 +146,6 @@ export default {
 		return { title: 'Settings' };
 	},
 	mounted() {
-		this.$ga.page({
-			page: '/dashboard/settings',
-			title: 'Settings',
-			location: window.location.href
-		});
-
 		this.getSettings();
 	},
 	methods: {
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index 59a75d3..820969a 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -222,11 +222,6 @@ export default {
 	},
 	mounted() {
 		this.getUsers();
-		this.$ga.page({
-			page: '/dashboard/users',
-			title: 'Users',
-			location: window.location.href
-		});
 	},
 	methods: {
 		async getUsers() {
-- 
cgit v1.2.3


From 99bc74875edb44b4e679b17158511474cd575e10 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 2 Mar 2019 22:36:16 +0900
Subject: Various password fixes

---
 src/site/pages/dashboard/account.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 8e3bc65..3ff6c70 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -114,8 +114,8 @@ export default {
 			}
 		},
 		async changePassword() {
-			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) return;
-			if (this.user.newPassword !== this.user.reNewPassword) return;
+			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) return this.$showToast('One or more fields are missing', true);
+			if (this.user.newPassword !== this.user.reNewPassword) return this.$showToast('Passwords don\'t match', true);
 
 			try {
 				const response = await this.axios.post(`${this.config.baseURL}/user/password/change`,
-- 
cgit v1.2.3


From 71f24504317a8391209789275549a94be5c99e4e Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Fri, 8 Mar 2019 00:47:30 +0900
Subject: WIP

---
 src/site/pages/dashboard/albums.vue | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
index abf3334..a2e151e 100644
--- a/src/site/pages/dashboard/albums.vue
+++ b/src/site/pages/dashboard/albums.vue
@@ -228,10 +228,10 @@
 											</b-table-column>
 
 											<b-table-column field="enabled"
-												label="Enabled"
+												label="Actions"
 												centered>
-												<b-switch v-model="props.row.enabled"
-													@input="linkOptionsChanged(props.row)" />
+												<button class="button is-danger"
+													@click="promptDeleteAlbumLink(props.row.identifier)">Delete link</button>
 											</b-table-column>
 
 											<!--
@@ -265,7 +265,6 @@
 											</div>
 										</template>
 									</b-table>
-
 								</div>
 							</div>
 						</div>
@@ -301,6 +300,21 @@ export default {
 		this.getAlbums();
 	},
 	methods: {
+		promptDeleteAlbumLink(identifier) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this album link?',
+				onConfirm: () => this.deleteAlbumLink(identifier)
+			});
+		},
+		async deleteAlbumLink(identifier) {
+			console.log('> deleteAlbumLink', identifier);
+			try {
+				const response = await this.axios.delete(`${this.config.baseURL}/album/link/delete/${identifier}`);
+				return this.$toast.open(response.data.message);
+			} catch (error) {
+				return this.$onPromiseError(error);
+			}
+		},
 		async linkOptionsChanged(link) {
 			try {
 				const response = await this.axios.post(`${this.config.baseURL}/album/link/edit`,
-- 
cgit v1.2.3


From 771a5c2bf7480b6e023d8eeeded1c6f698b779e8 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 12 Mar 2019 06:32:10 +0000
Subject: Not tested, but should delete an album

---
 src/site/pages/dashboard/albums.vue | 38 ++++++++++++++++++++++++++++++++-----
 1 file changed, 33 insertions(+), 5 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
index a2e151e..2da4beb 100644
--- a/src/site/pages/dashboard/albums.vue
+++ b/src/site/pages/dashboard/albums.vue
@@ -189,7 +189,7 @@
 										</div>
 										<div v-if="album.fileCount > 5"
 											class="thumb more no-background">
-											<router-link :to="`/dashboard/albums/${album.id}`">{{ album.fileCount - 5 }}+ more</router-link>
+											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
 										</div>
 									</template>
 									<template v-else>
@@ -263,6 +263,12 @@
 													@click="createLink(album)">Create new link</button>
 												{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
 											</div>
+
+											<div class="has-text-left">
+												<button class="button is-danger"
+													style="float: right"
+													@click="promptDeleteAlbum(album.id)">Delete album</button>
+											</div>
 										</template>
 									</b-table>
 								</div>
@@ -300,6 +306,30 @@ export default {
 		this.getAlbums();
 	},
 	methods: {
+		promptDeleteAlbum(id) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this album?',
+				onConfirm: () => this.deleteAlbum(id)
+			});
+		},
+		promptPurgeAlbum(id) {
+			this.$dialog.confirm({
+				message: 'Would you like to delete every file associated with this album?',
+				cancelText: 'No',
+				confirmText: 'Yes',
+				onConfirm: () => this.deleteAlbum(id, true),
+				onCancel: () => this.deleteAlbum(id, false)
+			});
+		},
+		async deleteAlbum(id, purge) {
+			try {
+				const response = await this.axios.delete(`${this.config.baseURL}/album/${id}/${purge ? true : ''}`);
+				this.getAlbums();
+				return this.$toast.open(response.data.message);
+			} catch (error) {
+				return this.$onPromiseError(error);
+			}
+		},
 		promptDeleteAlbumLink(identifier) {
 			this.$dialog.confirm({
 				message: 'Are you sure you want to delete this album link?',
@@ -341,9 +371,9 @@ export default {
 					enableDownload: true,
 					expiresAt: null
 				});
-				album.isCreatingLink = false;
 			} catch (error) {
 				this.$onPromiseError(error);
+			} finally {
 				album.isCreatingLink = false;
 			}
 		},
@@ -355,7 +385,6 @@ export default {
 				this.newAlbumName = null;
 				this.$toast.open(response.data.message);
 				this.getAlbums();
-				return;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
@@ -367,9 +396,8 @@ export default {
 					album.isDetailsOpen = false;
 				}
 				this.albums = response.data.albums;
-				console.log(this.albums);
 			} catch (error) {
-				console.error(error);
+				this.$onPromiseError(error);
 			}
 		}
 	}
-- 
cgit v1.2.3


From f11cb56db87c297d72c18bf967ebdacd9959ef64 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 12 Mar 2019 07:02:26 +0000
Subject: Clicking on album title takes you to the album now

---
 src/site/pages/dashboard/albums.vue       | 405 ------------------------------
 src/site/pages/dashboard/albums/_id.vue   | 126 ++++++++++
 src/site/pages/dashboard/albums/index.vue | 392 +++++++++++++++++++++++++++++
 src/site/pages/dashboard/index.vue        |   5 +-
 4 files changed, 519 insertions(+), 409 deletions(-)
 delete mode 100644 src/site/pages/dashboard/albums.vue
 create mode 100644 src/site/pages/dashboard/albums/_id.vue
 create mode 100644 src/site/pages/dashboard/albums/index.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums.vue b/src/site/pages/dashboard/albums.vue
deleted file mode 100644
index 2da4beb..0000000
--- a/src/site/pages/dashboard/albums.vue
+++ /dev/null
@@ -1,405 +0,0 @@
-<style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-
-	div.view-container {
-		padding: 2rem;
-	}
-	div.album {
-		display: flex;
-		flex-wrap: wrap;
-		margin-bottom: 10px;
-
-		div.arrow-container {
-			width: 2em;
-			height: 64px;
-			position: relative;
-			cursor: pointer;
-
-			i {
-				border: 2px solid $defaultTextColor;
-				border-right: 0;
-				border-top: 0;
-				display: block;
-				height: 1em;
-				position: absolute;
-				transform: rotate(-135deg);
-				transform-origin: center;
-				width: 1em;
-				z-index: 4;
-				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
-				transition: transform 0.1s linear;
-
-				&.active {
-					transform: rotate(-45deg);
-				}
-			}
-		}
-		div.thumb {
-			width: 64px;
-			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-
-		div.info {
-			margin-left: 15px;
-			h4 {
-				font-size: 1.5rem;
-				a {
-					color: $defaultTextColor;
-					font-weight: 400;
-					&:hover { text-decoration: underline; }
-				}
-			}
-			span { display: block; }
-			span:nth-child(3) {
-				font-size: 0.9rem;
-			}
-		}
-
-		div.latest {
-			flex-grow: 1;
-			justify-content: flex-end;
-			display: flex;
-			margin-left: 15px;
-
-			span.no-files {
-				font-size: 1.5em;
-				color: #b1b1b1;
-				padding-top: 17px;
-			}
-
-			div.more {
-				width: 64px;
-				height: 64px;
-				background: white;
-				display: flex;
-				align-items: center;
-				padding: 10px;
-				text-align: center;
-				a {
-					line-height: 1rem;
-					color: $defaultTextColor;
-					&:hover { text-decoration: underline; }
-				}
-			}
-		}
-
-		div.details {
-			flex: 0 1 100%;
-			padding-left: 2em;
-			padding-top: 1em;
-			min-height: 50px;
-
-			.b-table {
-				padding: 2em 0em;
-
-				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
-				}
-			}
-		}
-	}
-
-	div.column > h2.subtitle { padding-top: 1px; }
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-
-	.b-table {
-		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-	}
-</style>
-
-
-<template>
-	<section class="hero is-fullheight">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Manage your albums</h2>
-						<hr>
-
-						<div class="search-container">
-							<b-field>
-								<b-input v-model="newAlbumName"
-									placeholder="Album name..."
-									type="text"
-									@keyup.enter.native="createAlbum" />
-								<p class="control">
-									<button class="button is-primary"
-										@click="createAlbum">Create album</button>
-								</p>
-							</b-field>
-						</div>
-
-						<div class="view-container">
-							<div v-for="album in albums"
-								:key="album.id"
-								class="album">
-								<div class="arrow-container"
-									@click="album.isDetailsOpen = !album.isDetailsOpen">
-									<i :class="{ active: album.isDetailsOpen }"
-										class="icon-arrow" />
-								</div>
-								<div class="thumb">
-									<figure class="image is-64x64 thumb">
-										<img src="../../assets/images/blank.png">
-									</figure>
-								</div>
-								<div class="info">
-									<h4>
-										<router-link :to="`/dashboard/albums/${album.id}`">{{ album.name }}</router-link>
-									</h4>
-									<span>Updated <timeago :since="album.editedAt" /></span>
-									<span>{{ album.fileCount || 0 }} files</span>
-								</div>
-								<div class="latest is-hidden-mobile">
-									<template v-if="album.fileCount > 0">
-										<div v-for="file of album.files"
-											:key="file.id"
-											class="thumb">
-											<figure class="image is-64x64">
-												<a :href="file.url"
-													target="_blank">
-													<img :src="file.thumbSquare">
-												</a>
-											</figure>
-										</div>
-										<div v-if="album.fileCount > 5"
-											class="thumb more no-background">
-											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
-										</div>
-									</template>
-									<template v-else>
-										<span class="no-files">Nothing to show here</span>
-									</template>
-								</div>
-
-								<div v-if="album.isDetailsOpen"
-									class="details">
-									<h2>Public links for this album:</h2>
-
-									<b-table
-										:data="album.links.length ? album.links : []"
-										:mobile-cards="true">
-										<template slot-scope="props">
-											<b-table-column field="identifier"
-												label="Link"
-												centered>
-												<a :href="`${config.URL}/a/${props.row.identifier}`"
-													target="_blank">
-													{{ props.row.identifier }}
-												</a>
-											</b-table-column>
-
-											<b-table-column field="views"
-												label="Views"
-												centered>
-												{{ props.row.views }}
-											</b-table-column>
-
-											<b-table-column field="enableDownload"
-												label="Allow download"
-												centered>
-												<b-switch v-model="props.row.enableDownload"
-													@input="linkOptionsChanged(props.row)" />
-											</b-table-column>
-
-											<b-table-column field="enabled"
-												label="Actions"
-												centered>
-												<button class="button is-danger"
-													@click="promptDeleteAlbumLink(props.row.identifier)">Delete link</button>
-											</b-table-column>
-
-											<!--
-												Until it's decided if we want to delete links or just hide them from the list
-												this setting will be hidden. Discussion about it is encouraged on Discord.
-											-->
-											<!--
-											<b-table-column field="actions"
-												label="Actions"
-												centered>
-												<button class="button is-danger"
-													@click="deleteLink(props.row.identifier)">Delete link</button>
-											</b-table-column>
-											-->
-										</template>
-										<template slot="empty">
-											<div class="has-text-centered">
-												<i class="icon-misc-mood-sad" />
-											</div>
-											<div class="has-text-centered">
-												Nothing here
-											</div>
-										</template>
-										<template slot="footer">
-											<div class="has-text-right">
-												<button :class="{ 'is-loading': album.isCreatingLink }"
-													class="button is-primary"
-													style="float: left"
-													@click="createLink(album)">Create new link</button>
-												{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
-											</div>
-
-											<div class="has-text-left">
-												<button class="button is-danger"
-													style="float: right"
-													@click="promptDeleteAlbum(album.id)">Delete album</button>
-											</div>
-										</template>
-									</b-table>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</section>
-</template>
-
-<script>
-import Sidebar from '../../components/sidebar/Sidebar.vue';
-
-export default {
-	components: {
-		Sidebar
-	},
-	data() {
-		return {
-			albums: [],
-			newAlbumName: null
-		};
-	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
-	metaInfo() {
-		return { title: 'Uploads' };
-	},
-	mounted() {
-		this.getAlbums();
-	},
-	methods: {
-		promptDeleteAlbum(id) {
-			this.$dialog.confirm({
-				message: 'Are you sure you want to delete this album?',
-				onConfirm: () => this.deleteAlbum(id)
-			});
-		},
-		promptPurgeAlbum(id) {
-			this.$dialog.confirm({
-				message: 'Would you like to delete every file associated with this album?',
-				cancelText: 'No',
-				confirmText: 'Yes',
-				onConfirm: () => this.deleteAlbum(id, true),
-				onCancel: () => this.deleteAlbum(id, false)
-			});
-		},
-		async deleteAlbum(id, purge) {
-			try {
-				const response = await this.axios.delete(`${this.config.baseURL}/album/${id}/${purge ? true : ''}`);
-				this.getAlbums();
-				return this.$toast.open(response.data.message);
-			} catch (error) {
-				return this.$onPromiseError(error);
-			}
-		},
-		promptDeleteAlbumLink(identifier) {
-			this.$dialog.confirm({
-				message: 'Are you sure you want to delete this album link?',
-				onConfirm: () => this.deleteAlbumLink(identifier)
-			});
-		},
-		async deleteAlbumLink(identifier) {
-			console.log('> deleteAlbumLink', identifier);
-			try {
-				const response = await this.axios.delete(`${this.config.baseURL}/album/link/delete/${identifier}`);
-				return this.$toast.open(response.data.message);
-			} catch (error) {
-				return this.$onPromiseError(error);
-			}
-		},
-		async linkOptionsChanged(link) {
-			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/link/edit`,
-					{
-						identifier: link.identifier,
-						enableDownload: link.enableDownload,
-						enabled: link.enabled
-					});
-				this.$toast.open(response.data.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
-		},
-		async createLink(album) {
-			album.isCreatingLink = true;
-			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/link/new`,
-					{ albumId: album.id });
-				this.$toast.open(response.data.message);
-				album.links.push({
-					identifier: response.data.identifier,
-					views: 0,
-					enabled: true,
-					enableDownload: true,
-					expiresAt: null
-				});
-			} catch (error) {
-				this.$onPromiseError(error);
-			} finally {
-				album.isCreatingLink = false;
-			}
-		},
-		async createAlbum() {
-			if (!this.newAlbumName || this.newAlbumName === '') return;
-			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/new`,
-					{ name: this.newAlbumName });
-				this.newAlbumName = null;
-				this.$toast.open(response.data.message);
-				this.getAlbums();
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
-		},
-		async getAlbums() {
-			try {
-				const response = await this.axios.get(`${this.config.baseURL}/albums/mini`);
-				for (const album of response.data.albums) {
-					album.isDetailsOpen = false;
-				}
-				this.albums = response.data.albums;
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
-		}
-	}
-};
-</script>
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
new file mode 100644
index 0000000..f5ec683
--- /dev/null
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -0,0 +1,126 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+
+	.albumsModal .columns .column { padding: .25rem; }
+</style>
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Files</h2>
+						<hr>
+						<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
+						<Grid v-if="files.length"
+							:files="files" />
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<b-modal :active.sync="isAlbumsModalActive"
+			:width="640"
+			scroll="keep">
+			<div class="card albumsModal">
+				<div class="card-content">
+					<div class="content">
+						<h3 class="subtitle">Select the albums this file should be a part of</h3>
+						<hr>
+						<div class="columns is-multiline">
+							<div v-for="(album, index) in albums"
+								:key="index"
+								class="column is-3">
+								<div class="field">
+									<b-checkbox :value="isAlbumSelected(album.id)"
+										@input="albumCheckboxClicked($event, album.id)">{{ album.name }}</b-checkbox>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</b-modal>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+import Grid from '~/components/grid/Grid.vue';
+
+export default {
+	components: {
+		Sidebar,
+		Grid
+	},
+	data() {
+		return {
+			name: null,
+			files: [],
+			albums: [],
+			isAlbumsModalActive: false,
+			showingModalForFile: null
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Album' };
+	},
+	mounted() {
+		this.getFiles();
+		this.getAlbums();
+	},
+	methods: {
+		isAlbumSelected(id) {
+			if (!this.showingModalForFile) return;
+			const found = this.showingModalForFile.albums.find(el => el.id === id);
+			return found ? found.id ? true : false : false;
+		},
+		openAlbumModal(file) {
+			this.showingModalForFile = file;
+			this.isAlbumsModalActive = true;
+		},
+		async albumCheckboxClicked(value, id) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/file/album/${value ? 'add' : 'del'}`, {
+					albumId: id,
+					fileId: this.showingModalForFile.id
+				});
+				this.$toast.open(response.data.message);
+				this.getFiles();
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async getFiles() {
+			// TODO: Make this think SSR with AsyncData
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/album/${this.$route.params.id}/full`);
+				this.files = response.data.files;
+			} catch (error) {
+				console.error(error);
+			}
+		},
+		async getAlbums() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/albums/dropdown`);
+				this.albums = response.data.albums;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
new file mode 100644
index 0000000..419c835
--- /dev/null
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -0,0 +1,392 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Manage your albums</h2>
+						<hr>
+
+						<div class="search-container">
+							<b-field>
+								<b-input v-model="newAlbumName"
+									placeholder="Album name..."
+									type="text"
+									@keyup.enter.native="createAlbum" />
+								<p class="control">
+									<button class="button is-primary"
+										@click="createAlbum">Create album</button>
+								</p>
+							</b-field>
+						</div>
+
+						<div class="view-container">
+							<div v-for="album in albums"
+								:key="album.id"
+								class="album">
+								<div class="arrow-container"
+									@click="album.isDetailsOpen = !album.isDetailsOpen">
+									<i :class="{ active: album.isDetailsOpen }"
+										class="icon-arrow" />
+								</div>
+								<div class="thumb">
+									<figure class="image is-64x64 thumb">
+										<img src="../../assets/images/blank.png">
+									</figure>
+								</div>
+								<div class="info">
+									<h4>
+										<router-link :to="`/dashboard/albums/${album.id}`">{{ album.name }}</router-link>
+									</h4>
+									<span>Updated <timeago :since="album.editedAt" /></span>
+									<span>{{ album.fileCount || 0 }} files</span>
+								</div>
+								<div class="latest is-hidden-mobile">
+									<template v-if="album.fileCount > 0">
+										<div v-for="file of album.files"
+											:key="file.id"
+											class="thumb">
+											<figure class="image is-64x64">
+												<a :href="file.url"
+													target="_blank">
+													<img :src="file.thumbSquare">
+												</a>
+											</figure>
+										</div>
+										<div v-if="album.fileCount > 5"
+											class="thumb more no-background">
+											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
+										</div>
+									</template>
+									<template v-else>
+										<span class="no-files">Nothing to show here</span>
+									</template>
+								</div>
+
+								<div v-if="album.isDetailsOpen"
+									class="details">
+									<h2>Public links for this album:</h2>
+
+									<b-table
+										:data="album.links.length ? album.links : []"
+										:mobile-cards="true">
+										<template slot-scope="props">
+											<b-table-column field="identifier"
+												label="Link"
+												centered>
+												<a :href="`${config.URL}/a/${props.row.identifier}`"
+													target="_blank">
+													{{ props.row.identifier }}
+												</a>
+											</b-table-column>
+
+											<b-table-column field="views"
+												label="Views"
+												centered>
+												{{ props.row.views }}
+											</b-table-column>
+
+											<b-table-column field="enableDownload"
+												label="Allow download"
+												centered>
+												<b-switch v-model="props.row.enableDownload"
+													@input="linkOptionsChanged(props.row)" />
+											</b-table-column>
+
+											<b-table-column field="enabled"
+												label="Actions"
+												centered>
+												<button class="button is-danger"
+													@click="promptDeleteAlbumLink(props.row.identifier)">Delete link</button>
+											</b-table-column>
+										</template>
+										<template slot="empty">
+											<div class="has-text-centered">
+												<i class="icon-misc-mood-sad" />
+											</div>
+											<div class="has-text-centered">
+												Nothing here
+											</div>
+										</template>
+										<template slot="footer">
+											<div class="has-text-right">
+												<button :class="{ 'is-loading': album.isCreatingLink }"
+													class="button is-primary"
+													style="float: left"
+													@click="createLink(album)">Create new link</button>
+												{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
+											</div>
+
+											<div class="has-text-left">
+												<button class="button is-danger"
+													style="float: right"
+													@click="promptDeleteAlbum(album.id)">Delete album</button>
+											</div>
+										</template>
+									</b-table>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '../../components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			albums: [],
+			newAlbumName: null
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getAlbums();
+	},
+	methods: {
+		promptDeleteAlbum(id) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this album?',
+				onConfirm: () => this.deleteAlbum(id)
+			});
+		},
+		promptPurgeAlbum(id) {
+			this.$dialog.confirm({
+				message: 'Would you like to delete every file associated with this album?',
+				cancelText: 'No',
+				confirmText: 'Yes',
+				onConfirm: () => this.deleteAlbum(id, true),
+				onCancel: () => this.deleteAlbum(id, false)
+			});
+		},
+		async deleteAlbum(id, purge) {
+			try {
+				const response = await this.axios.delete(`${this.config.baseURL}/album/${id}/${purge ? true : ''}`);
+				this.getAlbums();
+				return this.$toast.open(response.data.message);
+			} catch (error) {
+				return this.$onPromiseError(error);
+			}
+		},
+		promptDeleteAlbumLink(identifier) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this album link?',
+				onConfirm: () => this.deleteAlbumLink(identifier)
+			});
+		},
+		async deleteAlbumLink(identifier) {
+			console.log('> deleteAlbumLink', identifier);
+			try {
+				const response = await this.axios.delete(`${this.config.baseURL}/album/link/delete/${identifier}`);
+				return this.$toast.open(response.data.message);
+			} catch (error) {
+				return this.$onPromiseError(error);
+			}
+		},
+		async linkOptionsChanged(link) {
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/link/edit`,
+					{
+						identifier: link.identifier,
+						enableDownload: link.enableDownload,
+						enabled: link.enabled
+					});
+				this.$toast.open(response.data.message);
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async createLink(album) {
+			album.isCreatingLink = true;
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/link/new`,
+					{ albumId: album.id });
+				this.$toast.open(response.data.message);
+				album.links.push({
+					identifier: response.data.identifier,
+					views: 0,
+					enabled: true,
+					enableDownload: true,
+					expiresAt: null
+				});
+			} catch (error) {
+				this.$onPromiseError(error);
+			} finally {
+				album.isCreatingLink = false;
+			}
+		},
+		async createAlbum() {
+			if (!this.newAlbumName || this.newAlbumName === '') return;
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/album/new`,
+					{ name: this.newAlbumName });
+				this.newAlbumName = null;
+				this.$toast.open(response.data.message);
+				this.getAlbums();
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async getAlbums() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/albums/mini`);
+				for (const album of response.data.albums) {
+					album.isDetailsOpen = false;
+				}
+				this.albums = response.data.albums;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 565d64b..92da2a7 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -7,10 +7,6 @@
 
 	.albumsModal .columns .column { padding: .25rem; }
 </style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-</style>
-
 
 <template>
 	<section class="hero is-fullheight">
@@ -23,6 +19,7 @@
 					<div class="column">
 						<h2 class="subtitle">Your uploaded files</h2>
 						<hr>
+						<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
 						<Grid v-if="files.length"
 							:files="files" />
 					</div>
-- 
cgit v1.2.3


From e04833dff15675d05f388096e57ab0c7a123b4c4 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 12 Mar 2019 08:05:46 +0000
Subject: Whoops

---
 src/site/pages/dashboard/albums/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 419c835..679eb8c 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -165,7 +165,7 @@
 								</div>
 								<div class="thumb">
 									<figure class="image is-64x64 thumb">
-										<img src="../../assets/images/blank.png">
+										<img src="~/assets/images/blank.png">
 									</figure>
 								</div>
 								<div class="info">
@@ -269,7 +269,7 @@
 </template>
 
 <script>
-import Sidebar from '../../components/sidebar/Sidebar.vue';
+import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-- 
cgit v1.2.3


From 79eb00f71cc18dbb195a29bd79871d35176f33d1 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 14 Mar 2019 23:14:24 +0900
Subject: Small fixes

---
 src/site/pages/dashboard/albums/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 679eb8c..1ad7653 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -189,7 +189,7 @@
 										</div>
 										<div v-if="album.fileCount > 5"
 											class="thumb more no-background">
-											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
+											<router-link :to="`/dashboard/albums/${album.id}`">{{ album.fileCount - 5 }}+ more</router-link>
 										</div>
 									</template>
 									<template v-else>
-- 
cgit v1.2.3


From 497a961a3844afccc763ebdfa2d77f107318394a Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 14 Mar 2019 23:14:37 +0900
Subject: Tags

---
 src/site/pages/dashboard/tags/index.vue | 284 ++++++++++++++++++++++++++++++++
 1 file changed, 284 insertions(+)
 create mode 100644 src/site/pages/dashboard/tags/index.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
new file mode 100644
index 0000000..b4c5906
--- /dev/null
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -0,0 +1,284 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	section { background-color: $backgroundLight1 !important; }
+	section.hero div.hero-body {
+		align-items: baseline;
+	}
+	div.search-container {
+		display: flex;
+		justify-content: center;
+	}
+
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
+
+
+<template>
+	<section class="hero is-fullheight">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Manage your tags</h2>
+						<hr>
+
+						<div class="search-container">
+							<b-field>
+								<b-input v-model="newTagName"
+									placeholder="Tag name..."
+									type="text"
+									@keyup.enter.native="createTag" />
+								<p class="control">
+									<button class="button is-primary"
+										@click="createTag">Create tags</button>
+								</p>
+							</b-field>
+						</div>
+
+						<div class="view-container">
+							<div v-for="tag in tags"
+								:key="tag.id"
+								class="album">
+								<div class="arrow-container"
+									@click="promptDeleteTag">
+									<i class="icon-arrow" />
+								</div>
+								<!--
+								<div class="thumb">
+									<figure class="image is-64x64 thumb">
+										<img src="~/assets/images/blank.png">
+									</figure>
+								</div>
+								-->
+								<div class="info">
+									<h4>
+										<router-link :to="`/dashboard/tags/${tag.id}`">{{ tag.name }}</router-link>
+									</h4>
+									<span>{{ tag.count || 0 }} files</span>
+								</div>
+								<!--
+								<div class="latest is-hidden-mobile">
+									<template v-if="album.fileCount > 0">
+										<div v-for="file of album.files"
+											:key="file.id"
+											class="thumb">
+											<figure class="image is-64x64">
+												<a :href="file.url"
+													target="_blank">
+													<img :src="file.thumbSquare">
+												</a>
+											</figure>
+										</div>
+										<div v-if="album.fileCount > 5"
+											class="thumb more no-background">
+											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
+										</div>
+									</template>
+									<template v-else>
+										<span class="no-files">Nothing to show here</span>
+									</template>
+								</div>
+								-->
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	data() {
+		return {
+			tags: [],
+			newTagName: null
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Tags' };
+	},
+	mounted() {
+		this.getTags();
+	},
+	methods: {
+		promptDeleteTag(id) {
+			this.$dialog.confirm({
+				message: 'Are you sure you want to delete this tag?',
+				onConfirm: () => this.promptPurgeTag(id)
+			});
+		},
+		promptPurgeTag(id) {
+			this.$dialog.confirm({
+				message: 'Would you like to delete every file associated with this tag?',
+				cancelText: 'No',
+				confirmText: 'Yes',
+				onConfirm: () => this.deleteTag(id, true),
+				onCancel: () => this.deleteTag(id, false)
+			});
+		},
+		async deleteTag(id, purge) {
+			try {
+				const response = await this.axios.delete(`${this.config.baseURL}/tags/${id}/${purge ? true : ''}`);
+				this.getTags();
+				return this.$toast.open(response.data.message);
+			} catch (error) {
+				return this.$onPromiseError(error);
+			}
+		},
+		async createTag() {
+			if (!this.newTagName || this.newTagName === '') return;
+			try {
+				const response = await this.axios.post(`${this.config.baseURL}/tag/new`,
+					{ name: this.newTagName });
+				this.newTagName = null;
+				this.$toast.open(response.data.message);
+				this.getTags();
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		},
+		async getTags() {
+			try {
+				const response = await this.axios.get(`${this.config.baseURL}/tags`);
+				for (const tag of response.data.tags) {
+					tag.isDetailsOpen = false;
+				}
+				this.tags = response.data.tags;
+			} catch (error) {
+				this.$onPromiseError(error);
+			}
+		}
+	}
+};
+</script>
-- 
cgit v1.2.3


From 107d1f4750e8f82a628b528c4ec200e918be271d Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 19 Mar 2019 07:58:36 +0000
Subject: API key WIP

---
 src/site/pages/dashboard/account.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 3ff6c70..b0b90a3 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -67,7 +67,8 @@
 							message="This API key lets you use the service from other apps"
 							horizontal>
 							<b-input v-model="user.apiKey"
-								expanded />
+								expanded
+								disabled />
 						</b-field>
 
 						<div class="mb2 mt2 text-center">
@@ -130,7 +131,8 @@ export default {
 		},
 		promptNewAPIKey() {
 			this.$dialog.confirm({
-				message: 'Are you sure you want to regenerate your API key?',
+				type: 'is-danger',
+				message: 'Are you sure you want to regenerate your API key? If you had a previous API key generated it will stop working. Make sure to write it down as this is the only time its gonna be displayed to you.',
 				onConfirm: () => this.requestNewAPIKey()
 			});
 		},
@@ -139,6 +141,7 @@ export default {
 				const response = await this.axios.post(`${this.config.baseURL}/user/apikey/change`);
 				this.user.apiKey = response.data.apiKey;
 				this.$toast.open(response.data.message);
+				this.$forceUpdate();
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
-- 
cgit v1.2.3


From cff0ab7ccb5066915f0e76f28ab404cfa2b5414b Mon Sep 17 00:00:00 2001
From: Robin B <contact@robflop.me>
Date: Thu, 21 Mar 2019 17:47:14 +0100
Subject: Update account.vue

As discussed before, an adjustment for the wording alongside a grammatical fix.

PR as suggested by you.
---
 src/site/pages/dashboard/account.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index b0b90a3..50bc7fd 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -132,7 +132,7 @@ export default {
 		promptNewAPIKey() {
 			this.$dialog.confirm({
 				type: 'is-danger',
-				message: 'Are you sure you want to regenerate your API key? If you had a previous API key generated it will stop working. Make sure to write it down as this is the only time its gonna be displayed to you.',
+				message: 'Are you sure you want to regenerate your API key? Previously generated API keys will stop working. Make sure to write the new key down as this is the only time it will be displayed to you.',
 				onConfirm: () => this.requestNewAPIKey()
 			});
 		},
-- 
cgit v1.2.3


From ea3e503d13b7be477c064b02b9b2e5a9ef06c9a9 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Fri, 29 Mar 2019 00:35:58 +0900
Subject: Added middleware for pages and switched to $axios

---
 src/site/pages/dashboard/account.vue      | 19 +++++++++++--------
 src/site/pages/dashboard/albums/_id.vue   | 13 +++++++------
 src/site/pages/dashboard/albums/index.vue | 29 +++++++++++++++--------------
 src/site/pages/dashboard/index.vue        | 13 +++++++------
 src/site/pages/dashboard/settings.vue     |  9 +++++----
 src/site/pages/dashboard/tags/index.vue   | 15 ++++++++-------
 src/site/pages/dashboard/users.vue        | 17 +++++++++--------
 7 files changed, 62 insertions(+), 53 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 3ff6c70..df07591 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -67,7 +67,8 @@
 							message="This API key lets you use the service from other apps"
 							horizontal>
 							<b-input v-model="user.apiKey"
-								expanded />
+								expanded
+								disabled />
 						</b-field>
 
 						<div class="mb2 mt2 text-center">
@@ -88,6 +89,7 @@ export default {
 	components: {
 		Sidebar
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			user: {}
@@ -107,8 +109,8 @@ export default {
 	methods: {
 		async getUserSetttings() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/users/me`);
-				this.user = response.data.user;
+				const response = await this.$axios.$get(`users/me`);
+				this.user = response.user;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
@@ -118,12 +120,12 @@ export default {
 			if (this.user.newPassword !== this.user.reNewPassword) return this.$showToast('Passwords don\'t match', true);
 
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/user/password/change`,
+				const response = await this.$axios.$post(`user/password/change`,
 					{
 						password: this.user.password,
 						newPassword: this.user.newPassword
 					});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
@@ -136,9 +138,10 @@ export default {
 		},
 		async requestNewAPIKey() {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/user/apikey/change`);
-				this.user.apiKey = response.data.apiKey;
-				this.$toast.open(response.data.message);
+				const response = await this.$axios.$post(`user/apikey/change`);
+				this.user.apiKey = response.apiKey;
+				this.$forceUpdate();
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index f5ec683..ed5f8fd 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -61,6 +61,7 @@ export default {
 		Sidebar,
 		Grid
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			name: null,
@@ -94,11 +95,11 @@ export default {
 		},
 		async albumCheckboxClicked(value, id) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/file/album/${value ? 'add' : 'del'}`, {
+				const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
 					albumId: id,
 					fileId: this.showingModalForFile.id
 				});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 				this.getFiles();
 			} catch (error) {
 				this.$onPromiseError(error);
@@ -107,16 +108,16 @@ export default {
 		async getFiles() {
 			// TODO: Make this think SSR with AsyncData
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/album/${this.$route.params.id}/full`);
-				this.files = response.data.files;
+				const response = await this.$axios.$get(`album/${this.$route.params.id}/full`);
+				this.files = response.files;
 			} catch (error) {
 				console.error(error);
 			}
 		},
 		async getAlbums() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/albums/dropdown`);
-				this.albums = response.data.albums;
+				const response = await this.$axios.$get(`albums/dropdown`);
+				this.albums = response.albums;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 1ad7653..c2c054d 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -275,6 +275,7 @@ export default {
 	components: {
 		Sidebar
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			albums: [],
@@ -310,9 +311,9 @@ export default {
 		},
 		async deleteAlbum(id, purge) {
 			try {
-				const response = await this.axios.delete(`${this.config.baseURL}/album/${id}/${purge ? true : ''}`);
+				const response = await this.$axios.$delete(`album/${id}/${purge ? true : ''}`);
 				this.getAlbums();
-				return this.$toast.open(response.data.message);
+				return this.$toast.open(response.message);
 			} catch (error) {
 				return this.$onPromiseError(error);
 			}
@@ -326,21 +327,21 @@ export default {
 		async deleteAlbumLink(identifier) {
 			console.log('> deleteAlbumLink', identifier);
 			try {
-				const response = await this.axios.delete(`${this.config.baseURL}/album/link/delete/${identifier}`);
-				return this.$toast.open(response.data.message);
+				const response = await this.$axios.$delete(`album/link/delete/${identifier}`);
+				return this.$toast.open(response.message);
 			} catch (error) {
 				return this.$onPromiseError(error);
 			}
 		},
 		async linkOptionsChanged(link) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/link/edit`,
+				const response = await this.$axios.$post(`album/link/edit`,
 					{
 						identifier: link.identifier,
 						enableDownload: link.enableDownload,
 						enabled: link.enabled
 					});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
@@ -348,11 +349,11 @@ export default {
 		async createLink(album) {
 			album.isCreatingLink = true;
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/link/new`,
+				const response = await this.$axios.$post(`album/link/new`,
 					{ albumId: album.id });
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 				album.links.push({
-					identifier: response.data.identifier,
+					identifier: response.identifier,
 					views: 0,
 					enabled: true,
 					enableDownload: true,
@@ -367,10 +368,10 @@ export default {
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/album/new`,
+				const response = await this.$axios.$post(`album/new`,
 					{ name: this.newAlbumName });
 				this.newAlbumName = null;
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 				this.getAlbums();
 			} catch (error) {
 				this.$onPromiseError(error);
@@ -378,11 +379,11 @@ export default {
 		},
 		async getAlbums() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/albums/mini`);
-				for (const album of response.data.albums) {
+				const response = await this.$axios.$get(`albums/mini`);
+				for (const album of response.albums) {
 					album.isDetailsOpen = false;
 				}
-				this.albums = response.data.albums;
+				this.albums = response.albums;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 92da2a7..6d547e2 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -61,6 +61,7 @@ export default {
 		Sidebar,
 		Grid
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			files: [],
@@ -93,11 +94,11 @@ export default {
 		},
 		async albumCheckboxClicked(value, id) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/file/album/${value ? 'add' : 'del'}`, {
+				const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
 					albumId: id,
 					fileId: this.showingModalForFile.id
 				});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 
 				// Not the prettiest solution to refetch on each click but it'll do for now
 				this.getFiles();
@@ -107,16 +108,16 @@ export default {
 		},
 		async getFiles() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/files`);
-				this.files = response.data.files;
+				const response = await this.$axios.$get(`files`);
+				this.files = response.files;
 			} catch (error) {
 				console.error(error);
 			}
 		},
 		async getAlbums() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/albums/dropdown`);
-				this.albums = response.data.albums;
+				const response = await this.$axios.$get(`albums/dropdown`);
+				this.albums = response.albums;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 02bf5d2..23635ed 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -132,6 +132,7 @@ export default {
 	components: {
 		Sidebar
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			options: {}
@@ -151,8 +152,8 @@ export default {
 	methods: {
 		async getSettings() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/service/config`);
-				this.options = response.data.config;
+				const response = await this.$axios.$get(`service/config`);
+				this.options = response.config;
 				console.log(this.options);
 			} catch (error) {
 				this.$onPromiseError(error);
@@ -166,8 +167,8 @@ export default {
 		},
 		async restartService() {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/service/restart`);
-				this.$toast.open(response.data.message);
+				const response = await this.$axios.$post(`service/restart`);
+				this.$toast.open(response.message);
 				return;
 			} catch (error) {
 				this.$onPromiseError(error);
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index b4c5906..cc057a1 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -214,6 +214,7 @@ export default {
 	components: {
 		Sidebar
 	},
+	middleware: 'auth',
 	data() {
 		return {
 			tags: [],
@@ -249,9 +250,9 @@ export default {
 		},
 		async deleteTag(id, purge) {
 			try {
-				const response = await this.axios.delete(`${this.config.baseURL}/tags/${id}/${purge ? true : ''}`);
+				const response = await this.$axios.$delete(`tags/${id}/${purge ? true : ''}`);
 				this.getTags();
-				return this.$toast.open(response.data.message);
+				return this.$toast.open(response.message);
 			} catch (error) {
 				return this.$onPromiseError(error);
 			}
@@ -259,10 +260,10 @@ export default {
 		async createTag() {
 			if (!this.newTagName || this.newTagName === '') return;
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/tag/new`,
+				const response = await this.$axios.$post(`tag/new`,
 					{ name: this.newTagName });
 				this.newTagName = null;
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 				this.getTags();
 			} catch (error) {
 				this.$onPromiseError(error);
@@ -270,11 +271,11 @@ export default {
 		},
 		async getTags() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/tags`);
-				for (const tag of response.data.tags) {
+				const response = await this.$axios.$get(`tags`);
+				for (const tag of response.tags) {
 					tag.isDetailsOpen = false;
 				}
-				this.tags = response.data.tags;
+				this.tags = response.tags;
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index 820969a..4ef3e5b 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -207,6 +207,7 @@ export default {
 	components: {
 		Sidebar
 	},
+	middleware: ['auth', 'admin'],
 	data() {
 		return {
 			users: []
@@ -226,8 +227,8 @@ export default {
 	methods: {
 		async getUsers() {
 			try {
-				const response = await this.axios.get(`${this.config.baseURL}/admin/users`);
-				this.users = response.data.users;
+				const response = await this.$axios.$get(`admin/users`);
+				this.users = response.users;
 				console.log(this.users);
 			} catch (error) {
 				this.$onPromiseError(error);
@@ -235,20 +236,20 @@ export default {
 		},
 		async changeEnabledStatus(row) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/admin/users/${row.enabled ? 'enable' : 'disable'}`, {
+				const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
 					id: row.id
 				});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
 		},
 		async changeIsAdmin(row) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
+				const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
 					id: row.id
 				});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
@@ -261,10 +262,10 @@ export default {
 		},
 		async purgeFiles(row) {
 			try {
-				const response = await this.axios.post(`${this.config.baseURL}/admin/users/purge`, {
+				const response = await this.$axios.$post(`admin/users/purge`, {
 					id: row.id
 				});
-				this.$toast.open(response.data.message);
+				this.$toast.open(response.message);
 			} catch (error) {
 				this.$onPromiseError(error);
 			}
-- 
cgit v1.2.3


From 3bd8d119ba88e940932eca50be406d50d73040fb Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Wed, 24 Apr 2019 08:36:28 +0000
Subject: Refactor a bit since we globally catch API exceptions

---
 src/site/pages/dashboard/account.vue      | 52 ++++++++++++------------
 src/site/pages/dashboard/albums/_id.vue   | 48 ++++++++++------------
 src/site/pages/dashboard/albums/index.vue | 66 +++++++++++--------------------
 src/site/pages/dashboard/index.vue        | 34 ++++++----------
 src/site/pages/dashboard/settings.vue     | 18 ++-------
 src/site/pages/dashboard/tags/index.vue   | 36 ++++++-----------
 src/site/pages/dashboard/users.vue        | 45 +++++++--------------
 7 files changed, 110 insertions(+), 189 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 3ccbc31..3aa103f 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -108,27 +108,31 @@ export default {
 	},
 	methods: {
 		async getUserSetttings() {
-			try {
-				const response = await this.$axios.$get(`users/me`);
-				this.user = response.user;
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$get(`users/me`);
+			this.user = response.user;
 		},
 		async changePassword() {
-			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) return this.$showToast('One or more fields are missing', true);
-			if (this.user.newPassword !== this.user.reNewPassword) return this.$showToast('Passwords don\'t match', true);
-
-			try {
-				const response = await this.$axios.$post(`user/password/change`,
-					{
-						password: this.user.password,
-						newPassword: this.user.newPassword
-					});
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
+			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) {
+				this.$store.dispatch('alert', {
+					text: 'One or more fields are missing',
+					error: true
+				});
+				return;
+			}
+			if (this.user.newPassword !== this.user.reNewPassword) {
+				this.$store.dispatch('alert', {
+					text: 'Passwords don\'t match',
+					error: true
+				});
+				return;
 			}
+
+			const response = await this.$axios.$post(`user/password/change`,
+				{
+					password: this.user.password,
+					newPassword: this.user.newPassword
+				});
+			this.$toast.open(response.message);
 		},
 		promptNewAPIKey() {
 			this.$dialog.confirm({
@@ -138,14 +142,10 @@ export default {
 			});
 		},
 		async requestNewAPIKey() {
-			try {
-				const response = await this.$axios.$post(`user/apikey/change`);
-				this.user.apiKey = response.apiKey;
-				this.$forceUpdate();
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`user/apikey/change`);
+			this.user.apiKey = response.apiKey;
+			this.$forceUpdate();
+			this.$toast.open(response.message);
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index ed5f8fd..037957c 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -79,9 +79,16 @@ export default {
 	metaInfo() {
 		return { title: 'Album' };
 	},
-	mounted() {
-		this.getFiles();
-		this.getAlbums();
+	async asyncData({ $axios, route }) {
+		try {
+			const response = await $axios.$get(`album/${route.params.id}/full`);
+			return {
+				files: response.files ? response.files : []
+			};
+		} catch (error) {
+			console.error(error);
+			return { files: [] };
+		}
 	},
 	methods: {
 		isAlbumSelected(id) {
@@ -90,37 +97,22 @@ export default {
 			return found ? found.id ? true : false : false;
 		},
 		openAlbumModal(file) {
+			// Only get the list if the usuer actually wants to change a file's album, otherwise useless call
+			this.getAlbums();
 			this.showingModalForFile = file;
 			this.isAlbumsModalActive = true;
 		},
 		async albumCheckboxClicked(value, id) {
-			try {
-				const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
-					albumId: id,
-					fileId: this.showingModalForFile.id
-				});
-				this.$toast.open(response.message);
-				this.getFiles();
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
-		},
-		async getFiles() {
-			// TODO: Make this think SSR with AsyncData
-			try {
-				const response = await this.$axios.$get(`album/${this.$route.params.id}/full`);
-				this.files = response.files;
-			} catch (error) {
-				console.error(error);
-			}
+			const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
+				albumId: id,
+				fileId: this.showingModalForFile.id
+			});
+			this.$toast.open(response.message);
+			this.getFiles();
 		},
 		async getAlbums() {
-			try {
-				const response = await this.$axios.$get(`albums/dropdown`);
-				this.albums = response.albums;
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$get(`albums/dropdown`);
+			this.albums = response.albums;
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index c2c054d..079114d 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -310,13 +310,9 @@ export default {
 			});
 		},
 		async deleteAlbum(id, purge) {
-			try {
-				const response = await this.$axios.$delete(`album/${id}/${purge ? true : ''}`);
-				this.getAlbums();
-				return this.$toast.open(response.message);
-			} catch (error) {
-				return this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$delete(`album/${id}/${purge ? true : ''}`);
+			this.getAlbums();
+			return this.$toast.open(response.message);
 		},
 		promptDeleteAlbumLink(identifier) {
 			this.$dialog.confirm({
@@ -325,29 +321,21 @@ export default {
 			});
 		},
 		async deleteAlbumLink(identifier) {
-			console.log('> deleteAlbumLink', identifier);
-			try {
-				const response = await this.$axios.$delete(`album/link/delete/${identifier}`);
-				return this.$toast.open(response.message);
-			} catch (error) {
-				return this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$delete(`album/link/delete/${identifier}`);
+			return this.$toast.open(response.message);
 		},
 		async linkOptionsChanged(link) {
-			try {
-				const response = await this.$axios.$post(`album/link/edit`,
-					{
-						identifier: link.identifier,
-						enableDownload: link.enableDownload,
-						enabled: link.enabled
-					});
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`album/link/edit`,
+				{
+					identifier: link.identifier,
+					enableDownload: link.enableDownload,
+					enabled: link.enabled
+				});
+			this.$toast.open(response.message);
 		},
 		async createLink(album) {
 			album.isCreatingLink = true;
+			// Since we actually want to change the state even if the call fails, use a try catch
 			try {
 				const response = await this.$axios.$post(`album/link/new`,
 					{ albumId: album.id });
@@ -360,33 +348,25 @@ export default {
 					expiresAt: null
 				});
 			} catch (error) {
-				this.$onPromiseError(error);
+				//
 			} finally {
 				album.isCreatingLink = false;
 			}
 		},
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
-			try {
-				const response = await this.$axios.$post(`album/new`,
-					{ name: this.newAlbumName });
-				this.newAlbumName = null;
-				this.$toast.open(response.message);
-				this.getAlbums();
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`album/new`,
+				{ name: this.newAlbumName });
+			this.newAlbumName = null;
+			this.$toast.open(response.message);
+			this.getAlbums();
 		},
 		async getAlbums() {
-			try {
-				const response = await this.$axios.$get(`albums/mini`);
-				for (const album of response.albums) {
-					album.isDetailsOpen = false;
-				}
-				this.albums = response.albums;
-			} catch (error) {
-				this.$onPromiseError(error);
+			const response = await this.$axios.$get(`albums/mini`);
+			for (const album of response.albums) {
+				album.isDetailsOpen = false;
 			}
+			this.albums = response.albums;
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 6d547e2..7551937 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -93,34 +93,22 @@ export default {
 			this.isAlbumsModalActive = true;
 		},
 		async albumCheckboxClicked(value, id) {
-			try {
-				const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
-					albumId: id,
-					fileId: this.showingModalForFile.id
-				});
-				this.$toast.open(response.message);
+			const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
+				albumId: id,
+				fileId: this.showingModalForFile.id
+			});
+			this.$toast.open(response.message);
 
-				// Not the prettiest solution to refetch on each click but it'll do for now
-				this.getFiles();
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			// Not the prettiest solution to refetch on each click but it'll do for now
+			this.getFiles();
 		},
 		async getFiles() {
-			try {
-				const response = await this.$axios.$get(`files`);
-				this.files = response.files;
-			} catch (error) {
-				console.error(error);
-			}
+			const response = await this.$axios.$get(`files`);
+			this.files = response.files;
 		},
 		async getAlbums() {
-			try {
-				const response = await this.$axios.$get(`albums/dropdown`);
-				this.albums = response.albums;
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$get(`albums/dropdown`);
+			this.albums = response.albums;
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 23635ed..8aea325 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -151,13 +151,8 @@ export default {
 	},
 	methods: {
 		async getSettings() {
-			try {
-				const response = await this.$axios.$get(`service/config`);
-				this.options = response.config;
-				console.log(this.options);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$get(`service/config`);
+			this.options = response.config;
 		},
 		promptRestartService() {
 			this.$dialog.confirm({
@@ -166,13 +161,8 @@ export default {
 			});
 		},
 		async restartService() {
-			try {
-				const response = await this.$axios.$post(`service/restart`);
-				this.$toast.open(response.message);
-				return;
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`service/restart`);
+			this.$toast.open(response.message);
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index cc057a1..6dbcb55 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -249,36 +249,24 @@ export default {
 			});
 		},
 		async deleteTag(id, purge) {
-			try {
-				const response = await this.$axios.$delete(`tags/${id}/${purge ? true : ''}`);
-				this.getTags();
-				return this.$toast.open(response.message);
-			} catch (error) {
-				return this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$delete(`tags/${id}/${purge ? true : ''}`);
+			this.getTags();
+			return this.$toast.open(response.message);
 		},
 		async createTag() {
 			if (!this.newTagName || this.newTagName === '') return;
-			try {
-				const response = await this.$axios.$post(`tag/new`,
-					{ name: this.newTagName });
-				this.newTagName = null;
-				this.$toast.open(response.message);
-				this.getTags();
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`tag/new`,
+				{ name: this.newTagName });
+			this.newTagName = null;
+			this.$toast.open(response.message);
+			this.getTags();
 		},
 		async getTags() {
-			try {
-				const response = await this.$axios.$get(`tags`);
-				for (const tag of response.tags) {
-					tag.isDetailsOpen = false;
-				}
-				this.tags = response.tags;
-			} catch (error) {
-				this.$onPromiseError(error);
+			const response = await this.$axios.$get(`tags`);
+			for (const tag of response.tags) {
+				tag.isDetailsOpen = false;
 			}
+			this.tags = response.tags;
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index 4ef3e5b..9326243 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -226,33 +226,20 @@ export default {
 	},
 	methods: {
 		async getUsers() {
-			try {
-				const response = await this.$axios.$get(`admin/users`);
-				this.users = response.users;
-				console.log(this.users);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$get(`admin/users`);
+			this.users = response.users;
 		},
 		async changeEnabledStatus(row) {
-			try {
-				const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
-					id: row.id
-				});
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
+				id: row.id
+			});
+			this.$toast.open(response.message);
 		},
 		async changeIsAdmin(row) {
-			try {
-				const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
-					id: row.id
-				});
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
+				id: row.id
+			});
+			this.$toast.open(response.message);
 		},
 		promptPurgeFiles(row) {
 			this.$dialog.confirm({
@@ -261,14 +248,10 @@ export default {
 			});
 		},
 		async purgeFiles(row) {
-			try {
-				const response = await this.$axios.$post(`admin/users/purge`, {
-					id: row.id
-				});
-				this.$toast.open(response.message);
-			} catch (error) {
-				this.$onPromiseError(error);
-			}
+			const response = await this.$axios.$post(`admin/users/purge`, {
+				id: row.id
+			});
+			this.$toast.open(response.message);
 		}
 	}
 };
-- 
cgit v1.2.3


From 4db167ec43806e20cc40932a292efc2909e69328 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Mon, 30 Sep 2019 07:24:37 +0000
Subject: Fix deletion of albums and links

---
 src/site/pages/dashboard/albums/index.vue | 13 ++-----------
 src/site/pages/dashboard/tags/index.vue   |  2 +-
 2 files changed, 3 insertions(+), 12 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 079114d..9a7f8c9 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -300,17 +300,8 @@ export default {
 				onConfirm: () => this.deleteAlbum(id)
 			});
 		},
-		promptPurgeAlbum(id) {
-			this.$dialog.confirm({
-				message: 'Would you like to delete every file associated with this album?',
-				cancelText: 'No',
-				confirmText: 'Yes',
-				onConfirm: () => this.deleteAlbum(id, true),
-				onCancel: () => this.deleteAlbum(id, false)
-			});
-		},
-		async deleteAlbum(id, purge) {
-			const response = await this.$axios.$delete(`album/${id}/${purge ? true : ''}`);
+		async deleteAlbum(id) {
+			const response = await this.$axios.$delete(`album/${id}`);
 			this.getAlbums();
 			return this.$toast.open(response.message);
 		},
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 6dbcb55..a025d46 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -249,7 +249,7 @@ export default {
 			});
 		},
 		async deleteTag(id, purge) {
-			const response = await this.$axios.$delete(`tags/${id}/${purge ? true : ''}`);
+			const response = await this.$axios.$delete(`tags/${id}/${purge ? 'purge' : ''}`);
 			this.getTags();
 			return this.$toast.open(response.message);
 		},
-- 
cgit v1.2.3


From b1f56ef9b92de59c063407bda54eea299dd149c0 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Mon, 30 Sep 2019 07:26:15 +0000
Subject: chore: hide search until it's ready

---
 src/site/pages/dashboard/index.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 7551937..e8b6e38 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -21,7 +21,8 @@
 						<hr>
 						<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
 						<Grid v-if="files.length"
-							:files="files" />
+							:files="files"
+							:enableSearch="false" />
 					</div>
 				</div>
 			</div>
-- 
cgit v1.2.3


From 459ab5433b9c3b60f43f9b2293189be8e29e0e84 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 12 Oct 2019 14:58:58 +0900
Subject: chore: remove exif strip support. After some thought, modifying
 uploaded files is not something I want to support.

---
 src/site/pages/dashboard/settings.vue | 8 --------
 1 file changed, 8 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 8aea325..944c378 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -90,14 +90,6 @@
 								:false-value="false" />
 						</b-field>
 
-						<b-field label="Strip EXIF"
-							message="Remove EXIF metadata from uploaded files"
-							horizontal>
-							<b-switch v-model="options.stripExif"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
-
 						<b-field label="Public mode"
 							message="Enable anonymous uploades"
 							horizontal>
-- 
cgit v1.2.3


From 391ee68e4a67aec640e25bc3506f9e31c77e58f5 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 12 Oct 2019 15:47:25 +0900
Subject: chore: Upgrade buefy to newest version

---
 src/site/pages/dashboard/account.vue      |  6 +++---
 src/site/pages/dashboard/albums/_id.vue   |  2 +-
 src/site/pages/dashboard/albums/index.vue | 14 +++++++-------
 src/site/pages/dashboard/index.vue        |  2 +-
 src/site/pages/dashboard/settings.vue     |  4 ++--
 src/site/pages/dashboard/tags/index.vue   |  8 ++++----
 src/site/pages/dashboard/users.vue        |  8 ++++----
 7 files changed, 22 insertions(+), 22 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 3aa103f..8955844 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -132,10 +132,10 @@ export default {
 					password: this.user.password,
 					newPassword: this.user.newPassword
 				});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		},
 		promptNewAPIKey() {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to regenerate your API key? Previously generated API keys will stop working. Make sure to write the new key down as this is the only time it will be displayed to you.',
 				onConfirm: () => this.requestNewAPIKey()
@@ -145,7 +145,7 @@ export default {
 			const response = await this.$axios.$post(`user/apikey/change`);
 			this.user.apiKey = response.apiKey;
 			this.$forceUpdate();
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 037957c..964a416 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -107,7 +107,7 @@ export default {
 				albumId: id,
 				fileId: this.showingModalForFile.id
 			});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 			this.getFiles();
 		},
 		async getAlbums() {
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 9a7f8c9..123f1cd 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -295,7 +295,7 @@ export default {
 	},
 	methods: {
 		promptDeleteAlbum(id) {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this album?',
 				onConfirm: () => this.deleteAlbum(id)
 			});
@@ -303,17 +303,17 @@ export default {
 		async deleteAlbum(id) {
 			const response = await this.$axios.$delete(`album/${id}`);
 			this.getAlbums();
-			return this.$toast.open(response.message);
+			return this.$buefy.toast.open(response.message);
 		},
 		promptDeleteAlbumLink(identifier) {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this album link?',
 				onConfirm: () => this.deleteAlbumLink(identifier)
 			});
 		},
 		async deleteAlbumLink(identifier) {
 			const response = await this.$axios.$delete(`album/link/delete/${identifier}`);
-			return this.$toast.open(response.message);
+			return this.$buefy.toast.open(response.message);
 		},
 		async linkOptionsChanged(link) {
 			const response = await this.$axios.$post(`album/link/edit`,
@@ -322,7 +322,7 @@ export default {
 					enableDownload: link.enableDownload,
 					enabled: link.enabled
 				});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		},
 		async createLink(album) {
 			album.isCreatingLink = true;
@@ -330,7 +330,7 @@ export default {
 			try {
 				const response = await this.$axios.$post(`album/link/new`,
 					{ albumId: album.id });
-				this.$toast.open(response.message);
+				this.$buefy.toast.open(response.message);
 				album.links.push({
 					identifier: response.identifier,
 					views: 0,
@@ -349,7 +349,7 @@ export default {
 			const response = await this.$axios.$post(`album/new`,
 				{ name: this.newAlbumName });
 			this.newAlbumName = null;
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 			this.getAlbums();
 		},
 		async getAlbums() {
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index e8b6e38..3f9e8e0 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -98,7 +98,7 @@ export default {
 				albumId: id,
 				fileId: this.showingModalForFile.id
 			});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 
 			// Not the prettiest solution to refetch on each click but it'll do for now
 			this.getFiles();
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 944c378..bc39b4f 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -147,14 +147,14 @@ export default {
 			this.options = response.config;
 		},
 		promptRestartService() {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
 				onConfirm: () => this.restartService()
 			});
 		},
 		async restartService() {
 			const response = await this.$axios.$post(`service/restart`);
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index a025d46..7dd917b 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -234,13 +234,13 @@ export default {
 	},
 	methods: {
 		promptDeleteTag(id) {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this tag?',
 				onConfirm: () => this.promptPurgeTag(id)
 			});
 		},
 		promptPurgeTag(id) {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Would you like to delete every file associated with this tag?',
 				cancelText: 'No',
 				confirmText: 'Yes',
@@ -251,14 +251,14 @@ export default {
 		async deleteTag(id, purge) {
 			const response = await this.$axios.$delete(`tags/${id}/${purge ? 'purge' : ''}`);
 			this.getTags();
-			return this.$toast.open(response.message);
+			return this.$buefy.toast.open(response.message);
 		},
 		async createTag() {
 			if (!this.newTagName || this.newTagName === '') return;
 			const response = await this.$axios.$post(`tag/new`,
 				{ name: this.newTagName });
 			this.newTagName = null;
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 			this.getTags();
 		},
 		async getTags() {
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index 9326243..ff80ea1 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -233,16 +233,16 @@ export default {
 			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
 				id: row.id
 			});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		},
 		async changeIsAdmin(row) {
 			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
 				id: row.id
 			});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		},
 		promptPurgeFiles(row) {
-			this.$dialog.confirm({
+			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this user\'s files?',
 				onConfirm: () => this.purgeFiles(row)
 			});
@@ -251,7 +251,7 @@ export default {
 			const response = await this.$axios.$post(`admin/users/purge`, {
 				id: row.id
 			});
-			this.$toast.open(response.message);
+			this.$buefy.toast.open(response.message);
 		}
 	}
 };
-- 
cgit v1.2.3


From 43eb86c77fe37deb359ddf26bf9aab78e4f7f85e Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 12 Oct 2019 20:16:10 +0900
Subject: fix: we don't want non-admins to access the settings section

---
 src/site/pages/dashboard/settings.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index bc39b4f..1b9adcb 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -124,7 +124,7 @@ export default {
 	components: {
 		Sidebar
 	},
-	middleware: 'auth',
+	middleware: 'admin',
 	data() {
 		return {
 			options: {}
-- 
cgit v1.2.3


From bca8fbcd839d2239e3f6f141f662fbbc74726835 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sat, 12 Oct 2019 21:14:19 +0900
Subject: refactor: removed useless code, cleaned up, fixed permissions

---
 src/site/pages/dashboard/account.vue      | 23 +----------------------
 src/site/pages/dashboard/albums/_id.vue   |  7 +------
 src/site/pages/dashboard/albums/index.vue | 11 +----------
 src/site/pages/dashboard/index.vue        | 13 +------------
 src/site/pages/dashboard/settings.vue     | 28 +---------------------------
 src/site/pages/dashboard/tags/index.vue   | 11 +----------
 src/site/pages/dashboard/users.vue        | 11 +----------
 7 files changed, 7 insertions(+), 97 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 8955844..6ecc885 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -1,21 +1,5 @@
-<style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-</style>
-
-
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
@@ -95,11 +79,6 @@ export default {
 			user: {}
 		};
 	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
 	metaInfo() {
 		return { title: 'Account' };
 	},
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 964a416..c2f6a18 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -9,7 +9,7 @@
 </style>
 
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
@@ -71,11 +71,6 @@ export default {
 			showingModalForFile: null
 		};
 	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
 	metaInfo() {
 		return { title: 'Album' };
 	},
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 123f1cd..9333ffa 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -1,14 +1,5 @@
 <style lang="scss" scoped>
 	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-
 	div.view-container {
 		padding: 2rem;
 	}
@@ -130,7 +121,7 @@
 
 
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 3f9e8e0..9419fa1 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -1,15 +1,9 @@
 <style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-
 	.albumsModal .columns .column { padding: .25rem; }
 </style>
 
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
@@ -71,11 +65,6 @@ export default {
 			showingModalForFile: null
 		};
 	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
index 1b9adcb..35a23e8 100644
--- a/src/site/pages/dashboard/settings.vue
+++ b/src/site/pages/dashboard/settings.vue
@@ -1,21 +1,5 @@
-<style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-</style>
-
-
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
@@ -25,11 +9,6 @@
 					<div class="column">
 						<h2 class="subtitle">Service settings</h2>
 						<hr>
-						<!--
-						<h1 class="title">Uploads</h1>
-						<h2 class="subtitle">Keep track of all your uploads in here</h2>
-						<hr>
-						-->
 
 						<b-field label="Service name"
 							message="Please enter the name which this service is gonna be identified as"
@@ -130,11 +109,6 @@ export default {
 			options: {}
 		};
 	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
 	metaInfo() {
 		return { title: 'Settings' };
 	},
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 7dd917b..bc9ae57 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -1,14 +1,5 @@
 <style lang="scss" scoped>
 	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-
 	div.view-container {
 		padding: 2rem;
 	}
@@ -130,7 +121,7 @@
 
 
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
index ff80ea1..66ccebe 100644
--- a/src/site/pages/dashboard/users.vue
+++ b/src/site/pages/dashboard/users.vue
@@ -1,14 +1,5 @@
 <style lang="scss" scoped>
 	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-	div.search-container {
-		display: flex;
-		justify-content: center;
-	}
-
 	div.view-container {
 		padding: 2rem;
 	}
@@ -130,7 +121,7 @@
 
 
 <template>
-	<section class="hero is-fullheight">
+	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
 			<div class="container">
 				<div class="columns">
-- 
cgit v1.2.3


From cba7bf8586f59a049f79aba586db201ac6f3530b Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sun, 13 Oct 2019 02:53:45 +0900
Subject: This commit adds a bunch of features for admins:

* banning IP
* see files from other users if you are admin
* be able to see details of an uploaded file and it's user
* improved display of thumbnails for non-image files
---
 src/site/pages/dashboard/admin/file/_id.vue | 170 +++++++++++++++++++
 src/site/pages/dashboard/admin/settings.vue | 135 +++++++++++++++
 src/site/pages/dashboard/admin/user/_id.vue | 102 ++++++++++++
 src/site/pages/dashboard/admin/users.vue    | 249 ++++++++++++++++++++++++++++
 src/site/pages/dashboard/settings.vue       | 135 ---------------
 src/site/pages/dashboard/users.vue          | 249 ----------------------------
 6 files changed, 656 insertions(+), 384 deletions(-)
 create mode 100644 src/site/pages/dashboard/admin/file/_id.vue
 create mode 100644 src/site/pages/dashboard/admin/settings.vue
 create mode 100644 src/site/pages/dashboard/admin/user/_id.vue
 create mode 100644 src/site/pages/dashboard/admin/users.vue
 delete mode 100644 src/site/pages/dashboard/settings.vue
 delete mode 100644 src/site/pages/dashboard/users.vue

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
new file mode 100644
index 0000000..6718b32
--- /dev/null
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -0,0 +1,170 @@
+<style lang="scss" scoped>
+	.underline { text-decoration: underline; }
+</style>
+<template>
+	<section class="hero is-fullheight dashboard">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">File details</h2>
+						<hr>
+
+						<div class="columns">
+							<div class="column is-6">
+								<b-field label="ID"
+									horizontal>
+									<span>{{ file.id }}</span>
+								</b-field>
+
+								<b-field label="Name"
+									horizontal>
+									<span>{{ file.name }}</span>
+								</b-field>
+
+								<b-field label="Original Name"
+									horizontal>
+									<span>{{ file.original }}</span>
+								</b-field>
+
+								<b-field label="IP"
+									horizontal>
+									<span class="underline">{{ file.ip }}</span>
+								</b-field>
+
+								<b-field label="Link"
+									horizontal>
+									<a :href="file.url"
+										target="_blank">{{ file.url }}</a>
+								</b-field>
+
+								<b-field label="Size"
+									horizontal>
+									<span>{{ formatBytes(file.size) }}</span>
+								</b-field>
+
+								<b-field label="Hash"
+									horizontal>
+									<span>{{ file.hash }}</span>
+								</b-field>
+
+								<b-field label="Uploaded"
+									horizontal>
+									<span><timeago :since="file.createdAt" /></span>
+								</b-field>
+							</div>
+							<div class="column is-6">
+								<b-field label="User Id"
+									horizontal>
+									<span>{{ user.id }}</span>
+								</b-field>
+
+								<b-field label="Username"
+									horizontal>
+									<span>{{ user.username }}</span>
+								</b-field>
+
+								<b-field label="Enabled"
+									horizontal>
+									<span>{{ user.enabled }}</span>
+								</b-field>
+
+								<b-field label="Registered"
+									horizontal>
+									<span><timeago :since="user.createdAt" /></span>
+								</b-field>
+
+								<b-field label="Files"
+									horizontal>
+									<span>
+										<nuxt-link :to="`/dashboard/admin/user/${user.id}`">{{ user.fileCount }}</nuxt-link>
+									</span>
+								</b-field>
+							</div>
+						</div>
+
+						<div class="mb2 mt2 text-center">
+							<button class="button is-danger"
+								@click="promptBanIP">Ban IP</button>
+							<button class="button is-danger"
+								@click="promptDisableUser">Disable user</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	middleware: ['auth', 'admin'],
+	data() {
+		return {
+			options: {},
+			file: null,
+			user: null
+		};
+	},
+	async asyncData({ $axios, route }) {
+		try {
+			const response = await $axios.$get(`file/${route.params.id}`);
+			return {
+				file: response.file ? response.file : null,
+				user: response.user ? response.user : null
+			};
+		} catch (error) {
+			console.error(error);
+			return {
+				file: null,
+				user: null
+			};
+		}
+	},
+	methods: {
+		promptDisableUser() {
+			this.$buefy.dialog.confirm({
+				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
+				onConfirm: () => this.disableUser()
+			});
+		},
+		async disableUser() {
+			const response = await this.$axios.$post('admin/users/disable', {
+				id: this.user.id
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		promptBanIP() {
+			this.$buefy.dialog.confirm({
+				message: 'Are you sure you want to ban the IP this file was uploaded from?',
+				onConfirm: () => this.banIP()
+			});
+		},
+		async banIP() {
+			const response = await this.$axios.$post('admin/ban/ip', {
+				ip: this.file.ip
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		formatBytes(bytes, decimals = 2) {
+			if (bytes === 0) return '0 Bytes';
+
+			const k = 1024;
+			const dm = decimals < 0 ? 0 : decimals;
+			const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+
+			const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+			return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
new file mode 100644
index 0000000..052a641
--- /dev/null
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -0,0 +1,135 @@
+<template>
+	<section class="hero is-fullheight dashboard">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Service settings</h2>
+						<hr>
+
+						<b-field label="Service name"
+							message="Please enter the name which this service is gonna be identified as"
+							horizontal>
+							<b-input v-model="options.serviceName"
+								expanded />
+						</b-field>
+
+						<b-field label="Upload folder"
+							message="Where to store the files relative to the working directory"
+							horizontal>
+							<b-input v-model="options.uploadFolder"
+								expanded />
+						</b-field>
+
+						<b-field label="Links per album"
+							message="Maximum links allowed per album"
+							horizontal>
+							<b-input v-model="options.linksPerAlbum"
+								type="number"
+								expanded />
+						</b-field>
+
+						<b-field label="Max upload size"
+							message="Maximum allowed file size in MB"
+							horizontal>
+							<b-input v-model="options.maxUploadSize"
+								expanded />
+						</b-field>
+
+						<b-field label="Filename length"
+							message="How many characters long should the generated filenames be"
+							horizontal>
+							<b-input v-model="options.filenameLength"
+								expanded />
+						</b-field>
+
+						<b-field label="Album link length"
+							message="How many characters a link for an album should have"
+							horizontal>
+							<b-input v-model="options.albumLinkLength"
+								expanded />
+						</b-field>
+
+						<b-field label="Generate thumbnails"
+							message="Generate thumbnails when uploading a file if possible"
+							horizontal>
+							<b-switch v-model="options.generateThumbnails"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Generate zips"
+							message="Allow generating zips to download entire albums"
+							horizontal>
+							<b-switch v-model="options.generateZips"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Public mode"
+							message="Enable anonymous uploades"
+							horizontal>
+							<b-switch v-model="options.publicMode"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<b-field label="Enable creating account"
+							message="Enable creating new accounts in the platform"
+							horizontal>
+							<b-switch v-model="options.enableAccounts"
+								:true-value="true"
+								:false-value="false" />
+						</b-field>
+
+						<div class="mb2 mt2 text-center">
+							<button class="button is-primary"
+								@click="promptRestartService">Save and restart service</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	middleware: ['auth', 'admin'],
+	data() {
+		return {
+			options: {}
+		};
+	},
+	metaInfo() {
+		return { title: 'Settings' };
+	},
+	mounted() {
+		this.getSettings();
+	},
+	methods: {
+		async getSettings() {
+			const response = await this.$axios.$get(`service/config`);
+			this.options = response.config;
+		},
+		promptRestartService() {
+			this.$buefy.dialog.confirm({
+				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
+				onConfirm: () => this.restartService()
+			});
+		},
+		async restartService() {
+			const response = await this.$axios.$post(`service/restart`);
+			this.$buefy.toast.open(response.message);
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
new file mode 100644
index 0000000..7703b1c
--- /dev/null
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -0,0 +1,102 @@
+<style lang="scss" scoped>
+	.underline { text-decoration: underline; }
+</style>
+<template>
+	<section class="hero is-fullheight dashboard">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">User details</h2>
+						<hr>
+
+						<b-field label="User Id"
+							horizontal>
+							<span>{{ user.id }}</span>
+						</b-field>
+
+						<b-field label="Username"
+							horizontal>
+							<span>{{ user.username }}</span>
+						</b-field>
+
+						<b-field label="Enabled"
+							horizontal>
+							<span>{{ user.enabled }}</span>
+						</b-field>
+
+						<b-field label="Registered"
+							horizontal>
+							<span><timeago :since="user.createdAt" /></span>
+						</b-field>
+
+						<b-field label="Files"
+							horizontal>
+							<span>{{ files.length }}</span>
+						</b-field>
+
+						<div class="mb2 mt2 text-center">
+							<button class="button is-danger"
+								@click="promptDisableUser">Disable user</button>
+						</div>
+
+						<Grid v-if="files.length"
+							:files="files" />
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+import Grid from '~/components/grid/Grid.vue';
+
+export default {
+	components: {
+		Sidebar,
+		Grid
+	},
+	middleware: ['auth', 'admin'],
+	data() {
+		return {
+			options: {},
+			files: null,
+			user: null
+		};
+	},
+	async asyncData({ $axios, route }) {
+		try {
+			const response = await $axios.$get(`/admin/users/${route.params.id}`);
+			return {
+				files: response.files ? response.files : null,
+				user: response.user ? response.user : null
+			};
+		} catch (error) {
+			console.error(error);
+			return {
+				files: null,
+				user: null
+			};
+		}
+	},
+	methods: {
+		promptDisableUser() {
+			this.$buefy.dialog.confirm({
+				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
+				onConfirm: () => this.disableUser()
+			});
+		},
+		async disableUser() {
+			const response = await this.$axios.$post('admin/users/disable', {
+				id: this.user.id
+			});
+			this.$buefy.toast.open(response.message);
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
new file mode 100644
index 0000000..1fefa1e
--- /dev/null
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -0,0 +1,249 @@
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
+
+
+<template>
+	<section class="hero is-fullheight dashboard">
+		<div class="hero-body">
+			<div class="container">
+				<div class="columns">
+					<div class="column is-narrow">
+						<Sidebar />
+					</div>
+					<div class="column">
+						<h2 class="subtitle">Manage your users</h2>
+						<hr>
+
+						<div class="view-container">
+							<b-table
+								:data="users || []"
+								:mobile-cards="true">
+								<template slot-scope="props">
+									<b-table-column field="id"
+										label="Id"
+										centered>
+										{{ props.row.id }}
+									</b-table-column>
+
+									<b-table-column field="username"
+										label="Username"
+										centered>
+										<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">{{ props.row.username }}</nuxt-link>
+									</b-table-column>
+
+									<b-table-column field="enabled"
+										label="Enabled"
+										centered>
+										<b-switch v-model="props.row.enabled"
+											@input="changeEnabledStatus(props.row)" />
+									</b-table-column>
+
+									<b-table-column field="isAdmin"
+										label="Admin"
+										centered>
+										<b-switch v-model="props.row.isAdmin"
+											@input="changeIsAdmin(props.row)" />
+									</b-table-column>
+
+									<b-table-column field="purge"
+										centered>
+										<button class="button is-primary"
+											@click="promptPurgeFiles(props.row)">Purge files</button>
+									</b-table-column>
+								</template>
+								<template slot="empty">
+									<div class="has-text-centered">
+										<i class="icon-misc-mood-sad" />
+									</div>
+									<div class="has-text-centered">
+										Nothing here
+									</div>
+								</template>
+								<template slot="footer">
+									<div class="has-text-right">
+										{{ users.length }} users
+									</div>
+								</template>
+							</b-table>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar
+	},
+	middleware: ['auth', 'admin'],
+	data() {
+		return {
+			users: []
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		}
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getUsers();
+	},
+	methods: {
+		async getUsers() {
+			const response = await this.$axios.$get(`admin/users`);
+			this.users = response.users;
+		},
+		async changeEnabledStatus(row) {
+			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
+				id: row.id
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		async changeIsAdmin(row) {
+			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
+				id: row.id
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		promptPurgeFiles(row) {
+			this.$buefy.dialog.confirm({
+				message: 'Are you sure you want to delete this user\'s files?',
+				onConfirm: () => this.purgeFiles(row)
+			});
+		},
+		async purgeFiles(row) {
+			const response = await this.$axios.$post(`admin/users/purge`, {
+				id: row.id
+			});
+			this.$buefy.toast.open(response.message);
+		}
+	}
+};
+</script>
diff --git a/src/site/pages/dashboard/settings.vue b/src/site/pages/dashboard/settings.vue
deleted file mode 100644
index 35a23e8..0000000
--- a/src/site/pages/dashboard/settings.vue
+++ /dev/null
@@ -1,135 +0,0 @@
-<template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Service settings</h2>
-						<hr>
-
-						<b-field label="Service name"
-							message="Please enter the name which this service is gonna be identified as"
-							horizontal>
-							<b-input v-model="options.serviceName"
-								expanded />
-						</b-field>
-
-						<b-field label="Upload folder"
-							message="Where to store the files relative to the working directory"
-							horizontal>
-							<b-input v-model="options.uploadFolder"
-								expanded />
-						</b-field>
-
-						<b-field label="Links per album"
-							message="Maximum links allowed per album"
-							horizontal>
-							<b-input v-model="options.linksPerAlbum"
-								type="number"
-								expanded />
-						</b-field>
-
-						<b-field label="Max upload size"
-							message="Maximum allowed file size in MB"
-							horizontal>
-							<b-input v-model="options.maxUploadSize"
-								expanded />
-						</b-field>
-
-						<b-field label="Filename length"
-							message="How many characters long should the generated filenames be"
-							horizontal>
-							<b-input v-model="options.filenameLength"
-								expanded />
-						</b-field>
-
-						<b-field label="Album link length"
-							message="How many characters a link for an album should have"
-							horizontal>
-							<b-input v-model="options.albumLinkLength"
-								expanded />
-						</b-field>
-
-						<b-field label="Generate thumbnails"
-							message="Generate thumbnails when uploading a file if possible"
-							horizontal>
-							<b-switch v-model="options.generateThumbnails"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
-
-						<b-field label="Generate zips"
-							message="Allow generating zips to download entire albums"
-							horizontal>
-							<b-switch v-model="options.generateZips"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
-
-						<b-field label="Public mode"
-							message="Enable anonymous uploades"
-							horizontal>
-							<b-switch v-model="options.publicMode"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
-
-						<b-field label="Enable creating account"
-							message="Enable creating new accounts in the platform"
-							horizontal>
-							<b-switch v-model="options.enableAccounts"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
-
-						<div class="mb2 mt2 text-center">
-							<button class="button is-primary"
-								@click="promptRestartService">Save and restart service</button>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</section>
-</template>
-
-<script>
-import Sidebar from '~/components/sidebar/Sidebar.vue';
-
-export default {
-	components: {
-		Sidebar
-	},
-	middleware: 'admin',
-	data() {
-		return {
-			options: {}
-		};
-	},
-	metaInfo() {
-		return { title: 'Settings' };
-	},
-	mounted() {
-		this.getSettings();
-	},
-	methods: {
-		async getSettings() {
-			const response = await this.$axios.$get(`service/config`);
-			this.options = response.config;
-		},
-		promptRestartService() {
-			this.$buefy.dialog.confirm({
-				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
-				onConfirm: () => this.restartService()
-			});
-		},
-		async restartService() {
-			const response = await this.$axios.$post(`service/restart`);
-			this.$buefy.toast.open(response.message);
-		}
-	}
-};
-</script>
diff --git a/src/site/pages/dashboard/users.vue b/src/site/pages/dashboard/users.vue
deleted file mode 100644
index 66ccebe..0000000
--- a/src/site/pages/dashboard/users.vue
+++ /dev/null
@@ -1,249 +0,0 @@
-<style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	div.view-container {
-		padding: 2rem;
-	}
-	div.album {
-		display: flex;
-		flex-wrap: wrap;
-		margin-bottom: 10px;
-
-		div.arrow-container {
-			width: 2em;
-			height: 64px;
-			position: relative;
-			cursor: pointer;
-
-			i {
-				border: 2px solid $defaultTextColor;
-				border-right: 0;
-				border-top: 0;
-				display: block;
-				height: 1em;
-				position: absolute;
-				transform: rotate(-135deg);
-				transform-origin: center;
-				width: 1em;
-				z-index: 4;
-				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
-				transition: transform 0.1s linear;
-
-				&.active {
-					transform: rotate(-45deg);
-				}
-			}
-		}
-		div.thumb {
-			width: 64px;
-			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-
-		div.info {
-			margin-left: 15px;
-			h4 {
-				font-size: 1.5rem;
-				a {
-					color: $defaultTextColor;
-					font-weight: 400;
-					&:hover { text-decoration: underline; }
-				}
-			}
-			span { display: block; }
-			span:nth-child(3) {
-				font-size: 0.9rem;
-			}
-		}
-
-		div.latest {
-			flex-grow: 1;
-			justify-content: flex-end;
-			display: flex;
-			margin-left: 15px;
-
-			span.no-files {
-				font-size: 1.5em;
-				color: #b1b1b1;
-				padding-top: 17px;
-			}
-
-			div.more {
-				width: 64px;
-				height: 64px;
-				background: white;
-				display: flex;
-				align-items: center;
-				padding: 10px;
-				text-align: center;
-				a {
-					line-height: 1rem;
-					color: $defaultTextColor;
-					&:hover { text-decoration: underline; }
-				}
-			}
-		}
-
-		div.details {
-			flex: 0 1 100%;
-			padding-left: 2em;
-			padding-top: 1em;
-			min-height: 50px;
-
-			.b-table {
-				padding: 2em 0em;
-
-				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
-				}
-			}
-		}
-	}
-
-	div.column > h2.subtitle { padding-top: 1px; }
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-
-	.b-table {
-		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-	}
-</style>
-
-
-<template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Manage your users</h2>
-						<hr>
-
-						<div class="view-container">
-							<b-table
-								:data="users || []"
-								:mobile-cards="true">
-								<template slot-scope="props">
-									<b-table-column field="id"
-										label="Id"
-										centered>
-										{{ props.row.id }}
-									</b-table-column>
-
-									<b-table-column field="username"
-										label="Username"
-										centered>
-										{{ props.row.username }}
-									</b-table-column>
-
-									<b-table-column field="enabled"
-										label="Enabled"
-										centered>
-										<b-switch v-model="props.row.enabled"
-											@input="changeEnabledStatus(props.row)" />
-									</b-table-column>
-
-									<b-table-column field="isAdmin"
-										label="Admin"
-										centered>
-										<b-switch v-model="props.row.isAdmin"
-											@input="changeIsAdmin(props.row)" />
-									</b-table-column>
-
-									<b-table-column field="purge"
-										centered>
-										<button class="button is-primary"
-											@click="promptPurgeFiles(props.row)">Purge files</button>
-									</b-table-column>
-								</template>
-								<template slot="empty">
-									<div class="has-text-centered">
-										<i class="icon-misc-mood-sad" />
-									</div>
-									<div class="has-text-centered">
-										Nothing here
-									</div>
-								</template>
-								<template slot="footer">
-									<div class="has-text-right">
-										{{ users.length }} users
-									</div>
-								</template>
-							</b-table>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</section>
-</template>
-
-<script>
-import Sidebar from '../../components/sidebar/Sidebar.vue';
-
-export default {
-	components: {
-		Sidebar
-	},
-	middleware: ['auth', 'admin'],
-	data() {
-		return {
-			users: []
-		};
-	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
-	metaInfo() {
-		return { title: 'Uploads' };
-	},
-	mounted() {
-		this.getUsers();
-	},
-	methods: {
-		async getUsers() {
-			const response = await this.$axios.$get(`admin/users`);
-			this.users = response.users;
-		},
-		async changeEnabledStatus(row) {
-			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		},
-		async changeIsAdmin(row) {
-			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		},
-		promptPurgeFiles(row) {
-			this.$buefy.dialog.confirm({
-				message: 'Are you sure you want to delete this user\'s files?',
-				onConfirm: () => this.purgeFiles(row)
-			});
-		},
-		async purgeFiles(row) {
-			const response = await this.$axios.$post(`admin/users/purge`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		}
-	}
-};
-</script>
-- 
cgit v1.2.3


From d63f1f57e9bd1314de204d92634ca1262d089111 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Tue, 28 Apr 2020 10:47:22 +0900
Subject: wip: * Dark theme by default * Re-arranged vue files structure *
 Re-arranged the layout file to make it easier to extend

---
 src/site/pages/dashboard/albums/index.vue | 267 +++++++++++++++---------------
 src/site/pages/dashboard/index.vue        |   7 +-
 2 files changed, 137 insertions(+), 137 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 9333ffa..7dee517 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -1,125 +1,3 @@
-<style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	div.view-container {
-		padding: 2rem;
-	}
-	div.album {
-		display: flex;
-		flex-wrap: wrap;
-		margin-bottom: 10px;
-
-		div.arrow-container {
-			width: 2em;
-			height: 64px;
-			position: relative;
-			cursor: pointer;
-
-			i {
-				border: 2px solid $defaultTextColor;
-				border-right: 0;
-				border-top: 0;
-				display: block;
-				height: 1em;
-				position: absolute;
-				transform: rotate(-135deg);
-				transform-origin: center;
-				width: 1em;
-				z-index: 4;
-				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
-				transition: transform 0.1s linear;
-
-				&.active {
-					transform: rotate(-45deg);
-				}
-			}
-		}
-		div.thumb {
-			width: 64px;
-			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-
-		div.info {
-			margin-left: 15px;
-			h4 {
-				font-size: 1.5rem;
-				a {
-					color: $defaultTextColor;
-					font-weight: 400;
-					&:hover { text-decoration: underline; }
-				}
-			}
-			span { display: block; }
-			span:nth-child(3) {
-				font-size: 0.9rem;
-			}
-		}
-
-		div.latest {
-			flex-grow: 1;
-			justify-content: flex-end;
-			display: flex;
-			margin-left: 15px;
-
-			span.no-files {
-				font-size: 1.5em;
-				color: #b1b1b1;
-				padding-top: 17px;
-			}
-
-			div.more {
-				width: 64px;
-				height: 64px;
-				background: white;
-				display: flex;
-				align-items: center;
-				padding: 10px;
-				text-align: center;
-				a {
-					line-height: 1rem;
-					color: $defaultTextColor;
-					&:hover { text-decoration: underline; }
-				}
-			}
-		}
-
-		div.details {
-			flex: 0 1 100%;
-			padding-left: 2em;
-			padding-top: 1em;
-			min-height: 50px;
-
-			.b-table {
-				padding: 2em 0em;
-
-				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
-				}
-			}
-		}
-	}
-
-	div.column > h2.subtitle { padding-top: 1px; }
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-
-	.b-table {
-		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-	}
-</style>
-
-
 <template>
 	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
@@ -234,18 +112,20 @@
 											</div>
 										</template>
 										<template slot="footer">
-											<div class="has-text-right">
-												<button :class="{ 'is-loading': album.isCreatingLink }"
-													class="button is-primary"
-													style="float: left"
-													@click="createLink(album)">Create new link</button>
-												{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
-											</div>
+											<div class="wrapper">
+												<div class="has-text-right">
+													<button :class="{ 'is-loading': album.isCreatingLink }"
+														class="button is-primary"
+														style="float: left"
+														@click="createLink(album)">Create new link</button>
+													{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
+												</div>
 
-											<div class="has-text-left">
-												<button class="button is-danger"
-													style="float: right"
-													@click="promptDeleteAlbum(album.id)">Delete album</button>
+												<div class="has-text-left">
+													<button class="button is-danger"
+														style="float: right"
+														@click="promptDeleteAlbum(album.id)">Delete album</button>
+												</div>
 											</div>
 										</template>
 									</b-table>
@@ -353,3 +233,124 @@ export default {
 	}
 };
 </script>
+<style lang="scss" scoped>
+	@import '~/assets/styles/_colors.scss';
+	div.view-container {
+		padding: 2rem;
+	}
+	div.album {
+		display: flex;
+		flex-wrap: wrap;
+		margin-bottom: 10px;
+
+		div.arrow-container {
+			width: 2em;
+			height: 64px;
+			position: relative;
+			cursor: pointer;
+
+			i {
+				border: 2px solid $defaultTextColor;
+				border-right: 0;
+				border-top: 0;
+				display: block;
+				height: 1em;
+				position: absolute;
+				transform: rotate(-135deg);
+				transform-origin: center;
+				width: 1em;
+				z-index: 4;
+				top: 22px;
+
+				-webkit-transition: transform 0.1s linear;
+				-moz-transition: transform 0.1s linear;
+				-ms-transition: transform 0.1s linear;
+				-o-transition: transform 0.1s linear;
+				transition: transform 0.1s linear;
+
+				&.active {
+					transform: rotate(-45deg);
+				}
+			}
+		}
+		div.thumb {
+			width: 64px;
+			height: 64px;
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+
+		div.info {
+			margin-left: 15px;
+			text-align: left;
+			h4 {
+				font-size: 1.5rem;
+				a {
+					color: $defaultTextColor;
+					font-weight: 400;
+					&:hover { text-decoration: underline; }
+				}
+			}
+			span { display: block; }
+			span:nth-child(3) {
+				font-size: 0.9rem;
+			}
+		}
+
+		div.latest {
+			flex-grow: 1;
+			justify-content: flex-end;
+			display: flex;
+			margin-left: 15px;
+
+			span.no-files {
+				font-size: 1.5em;
+				color: #b1b1b1;
+				padding-top: 17px;
+			}
+
+			div.more {
+				width: 64px;
+				height: 64px;
+				background: white;
+				display: flex;
+				align-items: center;
+				padding: 10px;
+				text-align: center;
+				a {
+					line-height: 1rem;
+					color: $defaultTextColor;
+					&:hover { text-decoration: underline; }
+				}
+			}
+		}
+
+		div.details {
+			flex: 0 1 100%;
+			padding-left: 2em;
+			padding-top: 1em;
+			min-height: 50px;
+
+			.b-table {
+				padding: 2em 0em;
+
+				.table-wrapper {
+					-webkit-box-shadow: $boxShadowLight;
+							box-shadow: $boxShadowLight;
+				}
+			}
+		}
+	}
+
+	div.column > h2.subtitle { padding-top: 1px; }
+</style>
+<style lang="scss">
+	@import '~/assets/styles/_colors.scss';
+
+	.b-table {
+		.table-wrapper {
+			-webkit-box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
+		}
+	}
+</style>
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 9419fa1..84b0c45 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -1,7 +1,3 @@
-<style lang="scss" scoped>
-	.albumsModal .columns .column { padding: .25rem; }
-</style>
-
 <template>
 	<section class="hero is-fullheight dashboard">
 		<div class="hero-body">
@@ -103,3 +99,6 @@ export default {
 	}
 };
 </script>
+<style lang="scss" scoped>
+	.albumsModal .columns .column { padding: .25rem; }
+</style>
-- 
cgit v1.2.3


From aadb01bcffb7cd08e525e6aec0a9a7652892e9b4 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sun, 10 May 2020 20:01:05 +0900
Subject: Style changes to albums

---
 src/site/pages/dashboard/albums/_id.vue | 6 ------
 1 file changed, 6 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index c2f6a18..e4ab8dd 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -1,10 +1,4 @@
 <style lang="scss" scoped>
-	@import '~/assets/styles/_colors.scss';
-	section { background-color: $backgroundLight1 !important; }
-	section.hero div.hero-body {
-		align-items: baseline;
-	}
-
 	.albumsModal .columns .column { padding: .25rem; }
 </style>
 
-- 
cgit v1.2.3


From 124ff68f06bcfee7494e4b8117d87dd206c6ecbe Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Sun, 10 May 2020 21:22:48 +0900
Subject: Feat: implement lazy loading for waterfall view

---
 src/site/pages/dashboard/index.vue | 55 +-------------------------------------
 1 file changed, 1 insertion(+), 54 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 84b0c45..b58e567 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -17,29 +17,6 @@
 				</div>
 			</div>
 		</div>
-
-		<b-modal :active.sync="isAlbumsModalActive"
-			:width="640"
-			scroll="keep">
-			<div class="card albumsModal">
-				<div class="card-content">
-					<div class="content">
-						<h3 class="subtitle">Select the albums this file should be a part of</h3>
-						<hr>
-						<div class="columns is-multiline">
-							<div v-for="(album, index) in albums"
-								:key="index"
-								class="column is-3">
-								<div class="field">
-									<b-checkbox :value="isAlbumSelected(album.id)"
-										@input="albumCheckboxClicked($event, album.id)">{{ album.name }}</b-checkbox>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</b-modal>
 	</section>
 </template>
 
@@ -55,10 +32,7 @@ export default {
 	middleware: 'auth',
 	data() {
 		return {
-			files: [],
-			albums: [],
-			isAlbumsModalActive: false,
-			showingModalForFile: null
+			files: []
 		};
 	},
 	metaInfo() {
@@ -66,39 +40,12 @@ export default {
 	},
 	mounted() {
 		this.getFiles();
-		this.getAlbums();
 	},
 	methods: {
-		isAlbumSelected(id) {
-			if (!this.showingModalForFile) return;
-			const found = this.showingModalForFile.albums.find(el => el.id === id);
-			return found ? found.id ? true : false : false;
-		},
-		openAlbumModal(file) {
-			this.showingModalForFile = file;
-			this.isAlbumsModalActive = true;
-		},
-		async albumCheckboxClicked(value, id) {
-			const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
-				albumId: id,
-				fileId: this.showingModalForFile.id
-			});
-			this.$buefy.toast.open(response.message);
-
-			// Not the prettiest solution to refetch on each click but it'll do for now
-			this.getFiles();
-		},
 		async getFiles() {
 			const response = await this.$axios.$get(`files`);
 			this.files = response.files;
-		},
-		async getAlbums() {
-			const response = await this.$axios.$get(`albums/dropdown`);
-			this.albums = response.albums;
 		}
 	}
 };
 </script>
-<style lang="scss" scoped>
-	.albumsModal .columns .column { padding: .25rem; }
-</style>
-- 
cgit v1.2.3


From b886fda0793b8a26de58cd462acf6676a0a8e7ed Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Mon, 11 May 2020 00:19:10 +0900
Subject: chore: cleanup and todo

---
 src/site/pages/dashboard/albums/_id.vue | 53 +--------------------------------
 1 file changed, 1 insertion(+), 52 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index e4ab8dd..1b7c442 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -20,29 +20,6 @@
 				</div>
 			</div>
 		</div>
-
-		<b-modal :active.sync="isAlbumsModalActive"
-			:width="640"
-			scroll="keep">
-			<div class="card albumsModal">
-				<div class="card-content">
-					<div class="content">
-						<h3 class="subtitle">Select the albums this file should be a part of</h3>
-						<hr>
-						<div class="columns is-multiline">
-							<div v-for="(album, index) in albums"
-								:key="index"
-								class="column is-3">
-								<div class="field">
-									<b-checkbox :value="isAlbumSelected(album.id)"
-										@input="albumCheckboxClicked($event, album.id)">{{ album.name }}</b-checkbox>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</b-modal>
 	</section>
 </template>
 
@@ -59,10 +36,7 @@ export default {
 	data() {
 		return {
 			name: null,
-			files: [],
-			albums: [],
-			isAlbumsModalActive: false,
-			showingModalForFile: null
+			files: []
 		};
 	},
 	metaInfo() {
@@ -78,31 +52,6 @@ export default {
 			console.error(error);
 			return { files: [] };
 		}
-	},
-	methods: {
-		isAlbumSelected(id) {
-			if (!this.showingModalForFile) return;
-			const found = this.showingModalForFile.albums.find(el => el.id === id);
-			return found ? found.id ? true : false : false;
-		},
-		openAlbumModal(file) {
-			// Only get the list if the usuer actually wants to change a file's album, otherwise useless call
-			this.getAlbums();
-			this.showingModalForFile = file;
-			this.isAlbumsModalActive = true;
-		},
-		async albumCheckboxClicked(value, id) {
-			const response = await this.$axios.$post(`file/album/${value ? 'add' : 'del'}`, {
-				albumId: id,
-				fileId: this.showingModalForFile.id
-			});
-			this.$buefy.toast.open(response.message);
-			this.getFiles();
-		},
-		async getAlbums() {
-			const response = await this.$axios.$get(`albums/dropdown`);
-			this.albums = response.albums;
-		}
 	}
 };
 </script>
-- 
cgit v1.2.3


From b526d8803696161961ffb9eb912cb4b83a3c9eff Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 25 Jun 2020 01:35:52 +0900
Subject: Optimize the queries fetching albums/files

---
 src/site/pages/dashboard/albums/index.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 7dee517..60607ac 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -28,7 +28,7 @@
 								:key="album.id"
 								class="album">
 								<div class="arrow-container"
-									@click="album.isDetailsOpen = !album.isDetailsOpen">
+									@click="fetchAlbumDetails(album)">
 									<i :class="{ active: album.isDetailsOpen }"
 										class="icon-arrow" />
 								</div>
@@ -165,6 +165,12 @@ export default {
 		this.getAlbums();
 	},
 	methods: {
+		async fetchAlbumDetails(album) {
+			const response = await this.$axios.$get(`album/${album.id}/links`);
+			album.links = response.links;
+			album.isDetailsOpen = !album.isDetailsOpen;
+			this.$forceUpdate();
+		},
 		promptDeleteAlbum(id) {
 			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this album?',
-- 
cgit v1.2.3


From 50d233cd661e792e4aea92a389b0897dd734f772 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Mon, 29 Jun 2020 17:02:06 +0300
Subject: fix: fix minor visual issues on the album page

---
 src/site/pages/dashboard/albums/index.vue | 42 ++++++++++++++++++++-----------
 src/site/pages/dashboard/tags/index.vue   |  4 +++
 2 files changed, 32 insertions(+), 14 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 60607ac..6003c49 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -17,7 +17,8 @@
 									type="text"
 									@keyup.enter.native="createAlbum" />
 								<p class="control">
-									<button class="button is-primary"
+									<button outlined
+										class="button is-primary"
 										@click="createAlbum">Create album</button>
 								</p>
 							</b-field>
@@ -97,8 +98,7 @@
 											</b-table-column>
 
 											<b-table-column field="enabled"
-												label="Actions"
-												centered>
+												numeric>
 												<button class="button is-danger"
 													@click="promptDeleteAlbumLink(props.row.identifier)">Delete link</button>
 											</b-table-column>
@@ -112,19 +112,25 @@
 											</div>
 										</template>
 										<template slot="footer">
-											<div class="wrapper">
-												<div class="has-text-right">
-													<button :class="{ 'is-loading': album.isCreatingLink }"
-														class="button is-primary"
-														style="float: left"
-														@click="createLink(album)">Create new link</button>
-													{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created
+											<div class="level is-paddingless">
+												<div class="level-left">
+													<div class="level-item">
+														<button :class="{ 'is-loading': album.isCreatingLink }"
+															class="button is-primary"
+															style="float: left"
+															@click="createLink(album)">Create new link</button>
+													</div>
+													<div class="level-item">
+														<span class="has-text-default">{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created</span>
+													</div>
 												</div>
 
-												<div class="has-text-left">
-													<button class="button is-danger"
-														style="float: right"
-														@click="promptDeleteAlbum(album.id)">Delete album</button>
+												<div class="level-right">
+													<div class="level-item">
+														<button class="button is-danger"
+															style="float: right"
+															@click="promptDeleteAlbum(album.id)">Delete album</button>
+													</div>
 												</div>
 											</div>
 										</template>
@@ -244,6 +250,12 @@ export default {
 	div.view-container {
 		padding: 2rem;
 	}
+
+	div.search-container {
+		padding: 1rem 2rem;
+		background-color: $base-2;
+	}
+
 	div.album {
 		display: flex;
 		flex-wrap: wrap;
@@ -349,6 +361,8 @@ export default {
 	}
 
 	div.column > h2.subtitle { padding-top: 1px; }
+
+	div.no-background { background: none !important; }
 </style>
 <style lang="scss">
 	@import '~/assets/styles/_colors.scss';
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index bc9ae57..8523231 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -107,6 +107,10 @@
 	}
 
 	div.column > h2.subtitle { padding-top: 1px; }
+
+	div.no-background {
+		background: none;
+	}
 </style>
 <style lang="scss">
 	@import '~/assets/styles/_colors.scss';
-- 
cgit v1.2.3


From ac037c773ef5f15372c6999445a2efe00034c0c0 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Mon, 29 Jun 2020 20:02:47 +0300
Subject: fix: Remove hero and hero body and use sections and containers
 instead

Hero is meant to be used as a full-width banner to showcare or present somethign, not to contain the entire content of the webpage
---
 src/site/pages/dashboard/account.vue        | 104 ++++++++---------
 src/site/pages/dashboard/admin/file/_id.vue | 174 ++++++++++++++--------------
 src/site/pages/dashboard/admin/settings.vue | 156 ++++++++++++-------------
 src/site/pages/dashboard/admin/user/_id.vue |  72 ++++++------
 src/site/pages/dashboard/admin/users.vue    | 124 ++++++++++----------
 src/site/pages/dashboard/albums/_id.vue     |  26 ++---
 src/site/pages/dashboard/index.vue          |  58 +++++++---
 src/site/pages/dashboard/tags/index.vue     | 130 ++++++++++-----------
 8 files changed, 428 insertions(+), 416 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 6ecc885..121b2b3 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -1,64 +1,62 @@
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Account settings</h2>
-						<hr>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Account settings</h2>
+					<hr>
 
-						<b-field label="Username"
-							message="Nothing to do here"
-							horizontal>
-							<b-input v-model="user.username"
-								expanded
-								disabled />
-						</b-field>
+					<b-field label="Username"
+						message="Nothing to do here"
+						horizontal>
+						<b-input v-model="user.username"
+							expanded
+							disabled />
+					</b-field>
 
-						<b-field label="Current password"
-							message="If you want to change your password input the current one here"
-							horizontal>
-							<b-input v-model="user.password"
-								type="password"
-								expanded />
-						</b-field>
+					<b-field label="Current password"
+						message="If you want to change your password input the current one here"
+						horizontal>
+						<b-input v-model="user.password"
+							type="password"
+							expanded />
+					</b-field>
 
-						<b-field label="New password"
-							message="Your new password"
-							horizontal>
-							<b-input v-model="user.newPassword"
-								type="password"
-								expanded />
-						</b-field>
+					<b-field label="New password"
+						message="Your new password"
+						horizontal>
+						<b-input v-model="user.newPassword"
+							type="password"
+							expanded />
+					</b-field>
 
-						<b-field label="New password again"
-							message="Your new password once again"
-							horizontal>
-							<b-input v-model="user.reNewPassword"
-								type="password"
-								expanded />
-						</b-field>
+					<b-field label="New password again"
+						message="Your new password once again"
+						horizontal>
+						<b-input v-model="user.reNewPassword"
+							type="password"
+							expanded />
+					</b-field>
 
-						<div class="mb2 mt2 text-center">
-							<button class="button is-primary"
-								@click="changePassword">Change password</button>
-						</div>
+					<div class="mb2 mt2 text-center">
+						<button class="button is-primary"
+							@click="changePassword">Change password</button>
+					</div>
 
-						<b-field label="Api key"
-							message="This API key lets you use the service from other apps"
-							horizontal>
-							<b-input v-model="user.apiKey"
-								expanded
-								disabled />
-						</b-field>
+					<b-field label="Api key"
+						message="This API key lets you use the service from other apps"
+						horizontal>
+						<b-input v-model="user.apiKey"
+							expanded
+							disabled />
+					</b-field>
 
-						<div class="mb2 mt2 text-center">
-							<button class="button is-primary"
-								@click="promptNewAPIKey">Request new API key</button>
-						</div>
+					<div class="mb2 mt2 text-center">
+						<button class="button is-primary"
+							@click="promptNewAPIKey">Request new API key</button>
 					</div>
 				</div>
 			</div>
diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index 6718b32..5821292 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -2,97 +2,95 @@
 	.underline { text-decoration: underline; }
 </style>
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">File details</h2>
-						<hr>
-
-						<div class="columns">
-							<div class="column is-6">
-								<b-field label="ID"
-									horizontal>
-									<span>{{ file.id }}</span>
-								</b-field>
-
-								<b-field label="Name"
-									horizontal>
-									<span>{{ file.name }}</span>
-								</b-field>
-
-								<b-field label="Original Name"
-									horizontal>
-									<span>{{ file.original }}</span>
-								</b-field>
-
-								<b-field label="IP"
-									horizontal>
-									<span class="underline">{{ file.ip }}</span>
-								</b-field>
-
-								<b-field label="Link"
-									horizontal>
-									<a :href="file.url"
-										target="_blank">{{ file.url }}</a>
-								</b-field>
-
-								<b-field label="Size"
-									horizontal>
-									<span>{{ formatBytes(file.size) }}</span>
-								</b-field>
-
-								<b-field label="Hash"
-									horizontal>
-									<span>{{ file.hash }}</span>
-								</b-field>
-
-								<b-field label="Uploaded"
-									horizontal>
-									<span><timeago :since="file.createdAt" /></span>
-								</b-field>
-							</div>
-							<div class="column is-6">
-								<b-field label="User Id"
-									horizontal>
-									<span>{{ user.id }}</span>
-								</b-field>
-
-								<b-field label="Username"
-									horizontal>
-									<span>{{ user.username }}</span>
-								</b-field>
-
-								<b-field label="Enabled"
-									horizontal>
-									<span>{{ user.enabled }}</span>
-								</b-field>
-
-								<b-field label="Registered"
-									horizontal>
-									<span><timeago :since="user.createdAt" /></span>
-								</b-field>
-
-								<b-field label="Files"
-									horizontal>
-									<span>
-										<nuxt-link :to="`/dashboard/admin/user/${user.id}`">{{ user.fileCount }}</nuxt-link>
-									</span>
-								</b-field>
-							</div>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">File details</h2>
+					<hr>
+
+					<div class="columns">
+						<div class="column is-6">
+							<b-field label="ID"
+								horizontal>
+								<span>{{ file.id }}</span>
+							</b-field>
+
+							<b-field label="Name"
+								horizontal>
+								<span>{{ file.name }}</span>
+							</b-field>
+
+							<b-field label="Original Name"
+								horizontal>
+								<span>{{ file.original }}</span>
+							</b-field>
+
+							<b-field label="IP"
+								horizontal>
+								<span class="underline">{{ file.ip }}</span>
+							</b-field>
+
+							<b-field label="Link"
+								horizontal>
+								<a :href="file.url"
+									target="_blank">{{ file.url }}</a>
+							</b-field>
+
+							<b-field label="Size"
+								horizontal>
+								<span>{{ formatBytes(file.size) }}</span>
+							</b-field>
+
+							<b-field label="Hash"
+								horizontal>
+								<span>{{ file.hash }}</span>
+							</b-field>
+
+							<b-field label="Uploaded"
+								horizontal>
+								<span><timeago :since="file.createdAt" /></span>
+							</b-field>
 						</div>
-
-						<div class="mb2 mt2 text-center">
-							<button class="button is-danger"
-								@click="promptBanIP">Ban IP</button>
-							<button class="button is-danger"
-								@click="promptDisableUser">Disable user</button>
+						<div class="column is-6">
+							<b-field label="User Id"
+								horizontal>
+								<span>{{ user.id }}</span>
+							</b-field>
+
+							<b-field label="Username"
+								horizontal>
+								<span>{{ user.username }}</span>
+							</b-field>
+
+							<b-field label="Enabled"
+								horizontal>
+								<span>{{ user.enabled }}</span>
+							</b-field>
+
+							<b-field label="Registered"
+								horizontal>
+								<span><timeago :since="user.createdAt" /></span>
+							</b-field>
+
+							<b-field label="Files"
+								horizontal>
+								<span>
+									<nuxt-link :to="`/dashboard/admin/user/${user.id}`">{{ user.fileCount }}</nuxt-link>
+								</span>
+							</b-field>
 						</div>
 					</div>
+
+					<div class="mb2 mt2 text-center">
+						<button class="button is-danger"
+							@click="promptBanIP">Ban IP</button>
+						<button class="button is-danger"
+							@click="promptDisableUser">Disable user</button>
+					</div>
 				</div>
 			</div>
 		</div>
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 052a641..2d59fff 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -1,94 +1,92 @@
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Service settings</h2>
-						<hr>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Service settings</h2>
+					<hr>
 
-						<b-field label="Service name"
-							message="Please enter the name which this service is gonna be identified as"
-							horizontal>
-							<b-input v-model="options.serviceName"
-								expanded />
-						</b-field>
+					<b-field label="Service name"
+						message="Please enter the name which this service is gonna be identified as"
+						horizontal>
+						<b-input v-model="options.serviceName"
+							expanded />
+					</b-field>
 
-						<b-field label="Upload folder"
-							message="Where to store the files relative to the working directory"
-							horizontal>
-							<b-input v-model="options.uploadFolder"
-								expanded />
-						</b-field>
+					<b-field label="Upload folder"
+						message="Where to store the files relative to the working directory"
+						horizontal>
+						<b-input v-model="options.uploadFolder"
+							expanded />
+					</b-field>
 
-						<b-field label="Links per album"
-							message="Maximum links allowed per album"
-							horizontal>
-							<b-input v-model="options.linksPerAlbum"
-								type="number"
-								expanded />
-						</b-field>
+					<b-field label="Links per album"
+						message="Maximum links allowed per album"
+						horizontal>
+						<b-input v-model="options.linksPerAlbum"
+							type="number"
+							expanded />
+					</b-field>
 
-						<b-field label="Max upload size"
-							message="Maximum allowed file size in MB"
-							horizontal>
-							<b-input v-model="options.maxUploadSize"
-								expanded />
-						</b-field>
+					<b-field label="Max upload size"
+						message="Maximum allowed file size in MB"
+						horizontal>
+						<b-input v-model="options.maxUploadSize"
+							expanded />
+					</b-field>
 
-						<b-field label="Filename length"
-							message="How many characters long should the generated filenames be"
-							horizontal>
-							<b-input v-model="options.filenameLength"
-								expanded />
-						</b-field>
+					<b-field label="Filename length"
+						message="How many characters long should the generated filenames be"
+						horizontal>
+						<b-input v-model="options.filenameLength"
+							expanded />
+					</b-field>
 
-						<b-field label="Album link length"
-							message="How many characters a link for an album should have"
-							horizontal>
-							<b-input v-model="options.albumLinkLength"
-								expanded />
-						</b-field>
+					<b-field label="Album link length"
+						message="How many characters a link for an album should have"
+						horizontal>
+						<b-input v-model="options.albumLinkLength"
+							expanded />
+					</b-field>
 
-						<b-field label="Generate thumbnails"
-							message="Generate thumbnails when uploading a file if possible"
-							horizontal>
-							<b-switch v-model="options.generateThumbnails"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
+					<b-field label="Generate thumbnails"
+						message="Generate thumbnails when uploading a file if possible"
+						horizontal>
+						<b-switch v-model="options.generateThumbnails"
+							:true-value="true"
+							:false-value="false" />
+					</b-field>
 
-						<b-field label="Generate zips"
-							message="Allow generating zips to download entire albums"
-							horizontal>
-							<b-switch v-model="options.generateZips"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
+					<b-field label="Generate zips"
+						message="Allow generating zips to download entire albums"
+						horizontal>
+						<b-switch v-model="options.generateZips"
+							:true-value="true"
+							:false-value="false" />
+					</b-field>
 
-						<b-field label="Public mode"
-							message="Enable anonymous uploades"
-							horizontal>
-							<b-switch v-model="options.publicMode"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
+					<b-field label="Public mode"
+						message="Enable anonymous uploades"
+						horizontal>
+						<b-switch v-model="options.publicMode"
+							:true-value="true"
+							:false-value="false" />
+					</b-field>
 
-						<b-field label="Enable creating account"
-							message="Enable creating new accounts in the platform"
-							horizontal>
-							<b-switch v-model="options.enableAccounts"
-								:true-value="true"
-								:false-value="false" />
-						</b-field>
+					<b-field label="Enable creating account"
+						message="Enable creating new accounts in the platform"
+						horizontal>
+						<b-switch v-model="options.enableAccounts"
+							:true-value="true"
+							:false-value="false" />
+					</b-field>
 
-						<div class="mb2 mt2 text-center">
-							<button class="button is-primary"
-								@click="promptRestartService">Save and restart service</button>
-						</div>
+					<div class="mb2 mt2 text-center">
+						<button class="button is-primary"
+							@click="promptRestartService">Save and restart service</button>
 					</div>
 				</div>
 			</div>
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 7703b1c..2a56c34 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -2,50 +2,48 @@
 	.underline { text-decoration: underline; }
 </style>
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">User details</h2>
-						<hr>
-
-						<b-field label="User Id"
-							horizontal>
-							<span>{{ user.id }}</span>
-						</b-field>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">User details</h2>
+					<hr>
 
-						<b-field label="Username"
-							horizontal>
-							<span>{{ user.username }}</span>
-						</b-field>
+					<b-field label="User Id"
+						horizontal>
+						<span>{{ user.id }}</span>
+					</b-field>
 
-						<b-field label="Enabled"
-							horizontal>
-							<span>{{ user.enabled }}</span>
-						</b-field>
+					<b-field label="Username"
+						horizontal>
+						<span>{{ user.username }}</span>
+					</b-field>
 
-						<b-field label="Registered"
-							horizontal>
-							<span><timeago :since="user.createdAt" /></span>
-						</b-field>
+					<b-field label="Enabled"
+						horizontal>
+						<span>{{ user.enabled }}</span>
+					</b-field>
 
-						<b-field label="Files"
-							horizontal>
-							<span>{{ files.length }}</span>
-						</b-field>
+					<b-field label="Registered"
+						horizontal>
+						<span><timeago :since="user.createdAt" /></span>
+					</b-field>
 
-						<div class="mb2 mt2 text-center">
-							<button class="button is-danger"
-								@click="promptDisableUser">Disable user</button>
-						</div>
+					<b-field label="Files"
+						horizontal>
+						<span>{{ files.length }}</span>
+					</b-field>
 
-						<Grid v-if="files.length"
-							:files="files" />
+					<div class="mb2 mt2 text-center">
+						<button class="button is-danger"
+							@click="promptDisableUser">Disable user</button>
 					</div>
+
+					<Grid v-if="files.length"
+						:files="files" />
 				</div>
 			</div>
 		</div>
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index 1fefa1e..695cf0b 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -121,69 +121,67 @@
 
 
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Manage your users</h2>
-						<hr>
-
-						<div class="view-container">
-							<b-table
-								:data="users || []"
-								:mobile-cards="true">
-								<template slot-scope="props">
-									<b-table-column field="id"
-										label="Id"
-										centered>
-										{{ props.row.id }}
-									</b-table-column>
-
-									<b-table-column field="username"
-										label="Username"
-										centered>
-										<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">{{ props.row.username }}</nuxt-link>
-									</b-table-column>
-
-									<b-table-column field="enabled"
-										label="Enabled"
-										centered>
-										<b-switch v-model="props.row.enabled"
-											@input="changeEnabledStatus(props.row)" />
-									</b-table-column>
-
-									<b-table-column field="isAdmin"
-										label="Admin"
-										centered>
-										<b-switch v-model="props.row.isAdmin"
-											@input="changeIsAdmin(props.row)" />
-									</b-table-column>
-
-									<b-table-column field="purge"
-										centered>
-										<button class="button is-primary"
-											@click="promptPurgeFiles(props.row)">Purge files</button>
-									</b-table-column>
-								</template>
-								<template slot="empty">
-									<div class="has-text-centered">
-										<i class="icon-misc-mood-sad" />
-									</div>
-									<div class="has-text-centered">
-										Nothing here
-									</div>
-								</template>
-								<template slot="footer">
-									<div class="has-text-right">
-										{{ users.length }} users
-									</div>
-								</template>
-							</b-table>
-						</div>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Manage your users</h2>
+					<hr>
+
+					<div class="view-container">
+						<b-table
+							:data="users || []"
+							:mobile-cards="true">
+							<template slot-scope="props">
+								<b-table-column field="id"
+									label="Id"
+									centered>
+									{{ props.row.id }}
+								</b-table-column>
+
+								<b-table-column field="username"
+									label="Username"
+									centered>
+									<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">{{ props.row.username }}</nuxt-link>
+								</b-table-column>
+
+								<b-table-column field="enabled"
+									label="Enabled"
+									centered>
+									<b-switch v-model="props.row.enabled"
+										@input="changeEnabledStatus(props.row)" />
+								</b-table-column>
+
+								<b-table-column field="isAdmin"
+									label="Admin"
+									centered>
+									<b-switch v-model="props.row.isAdmin"
+										@input="changeIsAdmin(props.row)" />
+								</b-table-column>
+
+								<b-table-column field="purge"
+									centered>
+									<button class="button is-primary"
+										@click="promptPurgeFiles(props.row)">Purge files</button>
+								</b-table-column>
+							</template>
+							<template slot="empty">
+								<div class="has-text-centered">
+									<i class="icon-misc-mood-sad" />
+								</div>
+								<div class="has-text-centered">
+									Nothing here
+								</div>
+							</template>
+							<template slot="footer">
+								<div class="has-text-right">
+									{{ users.length }} users
+								</div>
+							</template>
+						</b-table>
 					</div>
 				</div>
 			</div>
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 1b7c442..e716b37 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -3,20 +3,18 @@
 </style>
 
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Files</h2>
-						<hr>
-						<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
-						<Grid v-if="files.length"
-							:files="files" />
-					</div>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Files</h2>
+					<hr>
+					<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
+					<Grid v-if="files.length"
+						:files="files" />
 				</div>
 			</div>
 		</div>
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index b58e567..8a4031b 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -1,19 +1,32 @@
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Your uploaded files</h2>
-						<hr>
-						<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
-						<Grid v-if="files.length"
-							:files="files"
-							:enableSearch="false" />
-					</div>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns is-variable is-0-mobile">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Your uploaded files</h2>
+					<hr>
+					<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
+					<Grid v-if="files.length"
+						:files="paginatedFiles"
+						:enableSearch="false"
+						class="grid" />
+
+					<b-pagination
+						v-if="files.length > perPage"
+						:total="files.length"
+						:per-page="perPage"
+						:current.sync="current"
+						class="pagination"
+						icon-prev="icon-interface-arrow-left"
+						icon-next="icon-interface-arrow-right"
+						icon-pack="icon"
+						aria-next-label="Next page"
+						aria-previous-label="Previous page"
+						aria-page-label="Page"
+						aria-current-label="Current page" />
 				</div>
 			</div>
 		</div>
@@ -32,9 +45,16 @@ export default {
 	middleware: 'auth',
 	data() {
 		return {
-			files: []
+			files: [],
+			current: 1,
+			perPage: 20
 		};
 	},
+	computed: {
+		paginatedFiles() {
+			return this.files.slice((this.current - 1) * this.perPage, this.current * this.perPage);
+		}
+	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
@@ -49,3 +69,9 @@ export default {
 	}
 };
 </script>
+
+<style lang="scss" scoped>
+	div.grid {
+		margin-bottom: 1rem;
+	}
+</style>
\ No newline at end of file
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 8523231..7c295b7 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -125,75 +125,73 @@
 
 
 <template>
-	<section class="hero is-fullheight dashboard">
-		<div class="hero-body">
-			<div class="container">
-				<div class="columns">
-					<div class="column is-narrow">
-						<Sidebar />
-					</div>
-					<div class="column">
-						<h2 class="subtitle">Manage your tags</h2>
-						<hr>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">Manage your tags</h2>
+					<hr>
 
-						<div class="search-container">
-							<b-field>
-								<b-input v-model="newTagName"
-									placeholder="Tag name..."
-									type="text"
-									@keyup.enter.native="createTag" />
-								<p class="control">
-									<button class="button is-primary"
-										@click="createTag">Create tags</button>
-								</p>
-							</b-field>
-						</div>
+					<div class="search-container">
+						<b-field>
+							<b-input v-model="newTagName"
+								placeholder="Tag name..."
+								type="text"
+								@keyup.enter.native="createTag" />
+							<p class="control">
+								<button class="button is-primary"
+									@click="createTag">Create tags</button>
+							</p>
+						</b-field>
+					</div>
 
-						<div class="view-container">
-							<div v-for="tag in tags"
-								:key="tag.id"
-								class="album">
-								<div class="arrow-container"
-									@click="promptDeleteTag">
-									<i class="icon-arrow" />
-								</div>
-								<!--
-								<div class="thumb">
-									<figure class="image is-64x64 thumb">
-										<img src="~/assets/images/blank.png">
-									</figure>
-								</div>
-								-->
-								<div class="info">
-									<h4>
-										<router-link :to="`/dashboard/tags/${tag.id}`">{{ tag.name }}</router-link>
-									</h4>
-									<span>{{ tag.count || 0 }} files</span>
-								</div>
-								<!--
-								<div class="latest is-hidden-mobile">
-									<template v-if="album.fileCount > 0">
-										<div v-for="file of album.files"
-											:key="file.id"
-											class="thumb">
-											<figure class="image is-64x64">
-												<a :href="file.url"
-													target="_blank">
-													<img :src="file.thumbSquare">
-												</a>
-											</figure>
-										</div>
-										<div v-if="album.fileCount > 5"
-											class="thumb more no-background">
-											<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
-										</div>
-									</template>
-									<template v-else>
-										<span class="no-files">Nothing to show here</span>
-									</template>
-								</div>
-								-->
+					<div class="view-container">
+						<div v-for="tag in tags"
+							:key="tag.id"
+							class="album">
+							<div class="arrow-container"
+								@click="promptDeleteTag">
+								<i class="icon-arrow" />
+							</div>
+							<!--
+							<div class="thumb">
+								<figure class="image is-64x64 thumb">
+									<img src="~/assets/images/blank.png">
+								</figure>
+							</div>
+							-->
+							<div class="info">
+								<h4>
+									<router-link :to="`/dashboard/tags/${tag.id}`">{{ tag.name }}</router-link>
+								</h4>
+								<span>{{ tag.count || 0 }} files</span>
+							</div>
+							<!--
+							<div class="latest is-hidden-mobile">
+								<template v-if="album.fileCount > 0">
+									<div v-for="file of album.files"
+										:key="file.id"
+										class="thumb">
+										<figure class="image is-64x64">
+											<a :href="file.url"
+												target="_blank">
+												<img :src="file.thumbSquare">
+											</a>
+										</figure>
+									</div>
+									<div v-if="album.fileCount > 5"
+										class="thumb more no-background">
+										<router-link :to="`/dashboard/albums/${album.uuid}`">{{ album.fileCount - 5 }}+ more</router-link>
+									</div>
+								</template>
+								<template v-else>
+									<span class="no-files">Nothing to show here</span>
+								</template>
 							</div>
+							-->
 						</div>
 					</div>
 				</div>
-- 
cgit v1.2.3


From 20a782fefe0a0c9489bce23ec7ee6548dc5f012d Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Mon, 29 Jun 2020 22:17:42 +0300
Subject: feat: add darker image for album section

---
 src/site/pages/dashboard/albums/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 6003c49..065667a 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -35,7 +35,7 @@
 								</div>
 								<div class="thumb">
 									<figure class="image is-64x64 thumb">
-										<img src="~/assets/images/blank.png">
+										<img src="~/assets/images/blank_darker.png">
 									</figure>
 								</div>
 								<div class="info">
-- 
cgit v1.2.3


From 520062508ccad88d49229e603fc4d2c0c0a118d3 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Mon, 29 Jun 2020 22:18:42 +0300
Subject: feat: backend pagination

serverLoad++;
userRamUsage--;
---
 src/site/pages/dashboard/index.vue | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 8a4031b..64f8266 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -8,15 +8,16 @@
 				<div class="column">
 					<h2 class="subtitle">Your uploaded files</h2>
 					<hr>
+
 					<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
-					<Grid v-if="files.length"
-						:files="paginatedFiles"
+					<Grid v-if="count"
+						:files="files"
 						:enableSearch="false"
 						class="grid" />
 
 					<b-pagination
-						v-if="files.length > perPage"
-						:total="files.length"
+						v-if="count > perPage"
+						:total="count"
 						:per-page="perPage"
 						:current.sync="current"
 						class="pagination"
@@ -46,25 +47,26 @@ export default {
 	data() {
 		return {
 			files: [],
+			count: 0,
 			current: 1,
 			perPage: 20
 		};
 	},
-	computed: {
-		paginatedFiles() {
-			return this.files.slice((this.current - 1) * this.perPage, this.current * this.perPage);
-		}
-	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
+	watch: {
+		current: 'getFiles'
+	},
 	mounted() {
 		this.getFiles();
 	},
 	methods: {
 		async getFiles() {
-			const response = await this.$axios.$get(`files`);
+			// TODO: Cache a few pages once fetched
+			const response = await this.$axios.$get(`files`, { params: { page: this.current, limit: this.perPage }});
 			this.files = response.files;
+			this.count = response.count;
 		}
 	}
 };
-- 
cgit v1.2.3


From 44e8175e968c62f4e8e3df39efd445743ea6aa8f Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Wed, 1 Jul 2020 20:39:42 +0300
Subject: feat: use SSR when rendering the dashboard (if possible)

---
 src/site/pages/dashboard/index.vue | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 64f8266..0eb9532 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -9,7 +9,6 @@
 					<h2 class="subtitle">Your uploaded files</h2>
 					<hr>
 
-					<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
 					<Grid v-if="count"
 						:files="files"
 						:enableSearch="false"
@@ -49,7 +48,7 @@ export default {
 			files: [],
 			count: 0,
 			current: 1,
-			perPage: 20
+			perPage: 30
 		};
 	},
 	metaInfo() {
@@ -58,8 +57,22 @@ export default {
 	watch: {
 		current: 'getFiles'
 	},
-	mounted() {
-		this.getFiles();
+	async asyncData({ $axios, route }) {
+		const perPage = 30;
+		const current = 1; // current page
+
+		try {
+			const response = await $axios.$get(`files`, { params: { page: current, limit: perPage }});
+			return {
+				files: response.files || [],
+				count: response.count || 0,
+				current,
+				perPage
+			};
+		} catch (error) {
+			console.error(error);
+			return { files: [] };
+		}
 	},
 	methods: {
 		async getFiles() {
-- 
cgit v1.2.3


From e9ef148d7498b7068274a4141d5591cc8a64016e Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Wed, 1 Jul 2020 20:40:10 +0300
Subject: feat: backend pagination for albums

---
 src/site/pages/dashboard/albums/_id.vue | 43 +++++++++++++++++++++++++++++----
 1 file changed, 38 insertions(+), 5 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index e716b37..47e7057 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -12,9 +12,23 @@
 				<div class="column">
 					<h2 class="subtitle">Files</h2>
 					<hr>
-					<!-- TODO: Add a list view so the user can see the files that don't have thumbnails, like text documents -->
+
 					<Grid v-if="files.length"
 						:files="files" />
+
+					<b-pagination
+						v-if="count > perPage"
+						:total="count"
+						:per-page="perPage"
+						:current.sync="current"
+						class="pagination"
+						icon-prev="icon-interface-arrow-left"
+						icon-next="icon-interface-arrow-right"
+						icon-pack="icon"
+						aria-next-label="Next page"
+						aria-previous-label="Previous page"
+						aria-page-label="Page"
+						aria-current-label="Current page" />
 				</div>
 			</div>
 		</div>
@@ -34,22 +48,41 @@ export default {
 	data() {
 		return {
 			name: null,
-			files: []
+			files: [],
+			count: 0,
+			current: 1,
+			perPage: 30
 		};
 	},
 	metaInfo() {
 		return { title: 'Album' };
 	},
+	watch: {
+		current: 'getFiles'
+	},
 	async asyncData({ $axios, route }) {
+		const perPage = 30;
+		const current = 1; // current page
+
 		try {
-			const response = await $axios.$get(`album/${route.params.id}/full`);
+			const response = await $axios.$get(`album/${route.params.id}/full`, { params: { page: current, limit: perPage }});
 			return {
-				files: response.files ? response.files : []
+				files: response.files || [],
+				count: response.count || 0,
+				current,
+				perPage
 			};
 		} catch (error) {
 			console.error(error);
 			return { files: [] };
 		}
-	}
+	},
+	methods: {
+		async getFiles() {
+			const response = await this.$axios.$get(`album/${this.$route.params.id}/full`, { params: { page: this.current, limit: this.perPage }});
+			this.files = response.files;
+			this.count = response.count;
+		}
+	},
 };
 </script>
-- 
cgit v1.2.3


From 720ffaf0083564c85a07d66a6d303f34706add41 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 2 Jul 2020 02:50:55 +0300
Subject: feat: start refactoring the code to actually use vuex

This includes creating multiple stores as needed for components and removing all complex states from components (since all those states should be stored in vuex)
---
 src/site/pages/dashboard/index.vue | 124 +++++++++++++++++++++++--------------
 1 file changed, 77 insertions(+), 47 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 0eb9532..6c1b99b 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -6,27 +6,55 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">Your uploaded files</h2>
+					<nav class="level">
+						<div class="level-left">
+							<div class="level-item">
+								<h2 class="subtitle">Your uploaded files</h2>
+							</div>
+						</div>
+						<div class="level-right">
+							<div class="level-item">
+								<b-field>
+									<b-input
+										placeholder="Search"
+										type="search"/>
+									<p class="control">
+										<button
+											outlined
+											class="button is-primary">
+											Search
+										</button>
+									</p>
+								</b-field>
+							</div>
+						</div>
+					</nav>					
 					<hr>
 
-					<Grid v-if="count"
-						:files="files"
-						:enableSearch="false"
-						class="grid" />
+					<b-loading :active="images.isLoading" />
 
-					<b-pagination
-						v-if="count > perPage"
-						:total="count"
-						:per-page="perPage"
-						:current.sync="current"
-						class="pagination"
-						icon-prev="icon-interface-arrow-left"
-						icon-next="icon-interface-arrow-right"
-						icon-pack="icon"
-						aria-next-label="Next page"
-						aria-previous-label="Previous page"
-						aria-page-label="Page"
-						aria-current-label="Current page" />
+					<Grid v-if="totalFiles"
+						:files="images.files"
+						:enableSearch="false"
+						class="grid">
+						<template v-slot:pagination>
+							<b-pagination
+								v-if="shouldPaginate"
+								:total="totalFiles"
+								:per-page="limit"
+								:current.sync="current"
+								range-before="2"
+								range-after="2"
+								class="pagination-slot"
+								icon-prev="icon-interface-arrow-left"
+								icon-next="icon-interface-arrow-right"
+								icon-pack="icon"
+								aria-next-label="Next page"
+								aria-previous-label="Previous page"
+								aria-page-label="Page"
+								aria-current-label="Current page" />
+						</template>
+					</Grid>
 				</div>
 			</div>
 		</div>
@@ -34,6 +62,8 @@
 </template>
 
 <script>
+import { mapState, mapGetters, mapActions } from 'vuex';
+
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import Grid from '~/components/grid/Grid.vue';
 
@@ -42,44 +72,34 @@ export default {
 		Sidebar,
 		Grid
 	},
-	middleware: 'auth',
+	middleware: ['auth', ({ store }) => {
+		store.dispatch('images/fetch');
+	}],
 	data() {
 		return {
-			files: [],
-			count: 0,
-			current: 1,
-			perPage: 30
+			current: 1
 		};
 	},
+	computed: {
+		...mapGetters({ 
+			totalFiles: 'images/getTotalFiles',
+			shouldPaginate: 'images/shouldPaginate',
+			limit: 'images/getLimit'
+		}),
+		...mapState(['images'])
+	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
 	watch: {
-		current: 'getFiles'
-	},
-	async asyncData({ $axios, route }) {
-		const perPage = 30;
-		const current = 1; // current page
-
-		try {
-			const response = await $axios.$get(`files`, { params: { page: current, limit: perPage }});
-			return {
-				files: response.files || [],
-				count: response.count || 0,
-				current,
-				perPage
-			};
-		} catch (error) {
-			console.error(error);
-			return { files: [] };
-		}
+		current: 'fetchPaginate'
 	},
 	methods: {
-		async getFiles() {
-			// TODO: Cache a few pages once fetched
-			const response = await this.$axios.$get(`files`, { params: { page: this.current, limit: this.perPage }});
-			this.files = response.files;
-			this.count = response.count;
+		...mapActions({
+			fetch: 'images/fetch'
+		}),
+		fetchPaginate() {
+			this.fetch(this.current)
 		}
 	}
 };
@@ -89,4 +109,14 @@ export default {
 	div.grid {
 		margin-bottom: 1rem;
 	}
-</style>
\ No newline at end of file
+
+	.pagination-slot {
+		padding: 1rem 0;
+	}
+</style>
+
+<style lang="scss">
+	.pagination-slot > .pagination-previous, .pagination-slot > .pagination-next {
+		display: none !important;
+	}
+</style>
-- 
cgit v1.2.3


From c2dbbe6396540ee9d76991a00f5028b49d221d0c Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 2 Jul 2020 23:42:02 +0300
Subject: feat: refactor account to use vuex, fix small presentational
 components

---
 src/site/pages/dashboard/account.vue | 74 +++++++++++++++++++++---------------
 src/site/pages/dashboard/index.vue   |  2 +-
 2 files changed, 45 insertions(+), 31 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 121b2b3..1c335e8 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -12,7 +12,7 @@
 					<b-field label="Username"
 						message="Nothing to do here"
 						horizontal>
-						<b-input v-model="user.username"
+						<b-input :value="user.username"
 							expanded
 							disabled />
 					</b-field>
@@ -20,7 +20,7 @@
 					<b-field label="Current password"
 						message="If you want to change your password input the current one here"
 						horizontal>
-						<b-input v-model="user.password"
+						<b-input v-model="password"
 							type="password"
 							expanded />
 					</b-field>
@@ -28,7 +28,7 @@
 					<b-field label="New password"
 						message="Your new password"
 						horizontal>
-						<b-input v-model="user.newPassword"
+						<b-input v-model="newPassword"
 							type="password"
 							expanded />
 					</b-field>
@@ -36,7 +36,7 @@
 					<b-field label="New password again"
 						message="Your new password once again"
 						horizontal>
-						<b-input v-model="user.reNewPassword"
+						<b-input v-model="reNewPassword"
 							type="password"
 							expanded />
 					</b-field>
@@ -46,12 +46,17 @@
 							@click="changePassword">Change password</button>
 					</div>
 
-					<b-field label="Api key"
+					<b-field label="API key"
 						message="This API key lets you use the service from other apps"
 						horizontal>
-						<b-input v-model="user.apiKey"
-							expanded
-							disabled />
+						<b-field expanded>
+							<b-input :value="apiKey"
+								expanded
+								disabled />
+							<p class="control">
+								<button class="button is-primary">Copy</button>
+							</p>
+						</b-field>
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
@@ -65,51 +70,62 @@
 </template>
 
 <script>
+import { mapState, mapActions, mapGetters } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
 		Sidebar
 	},
-	middleware: 'auth',
+	middleware: ['auth', ({ store }) => {
+		store.dispatch('auth/fetchCurrentUser');
+	}],
 	data() {
 		return {
-			user: {}
+			password: '',
+			newPassword: '',
+			reNewPassword: ''
 		};
+	}, 
+	computed: {
+		...mapGetters({ 'apiKey': 'auth/getApiKey' }),
+		...mapState({
+			user: state => state.auth.user
+		})
 	},
 	metaInfo() {
 		return { title: 'Account' };
 	},
-	mounted() {
-		this.getUserSetttings();
-	},
 	methods: {
-		async getUserSetttings() {
-			const response = await this.$axios.$get(`users/me`);
-			this.user = response.user;
-		},
+		...mapActions({
+			getUserSetttings: 'auth/fetchCurrentUser'
+		}),
 		async changePassword() {
-			if (!this.user.password || !this.user.newPassword || !this.user.reNewPassword) {
-				this.$store.dispatch('alert', {
+			const { password, newPassword, reNewPassword } = this;
+
+			if (!password || !newPassword || !reNewPassword) {
+				this.$store.dispatch('alert/set', {
 					text: 'One or more fields are missing',
 					error: true
 				});
 				return;
 			}
-			if (this.user.newPassword !== this.user.reNewPassword) {
-				this.$store.dispatch('alert', {
+			if (newPassword !== reNewPassword) {
+				this.$store.dispatch('alert/set', {
 					text: 'Passwords don\'t match',
 					error: true
 				});
 				return;
 			}
 
-			const response = await this.$axios.$post(`user/password/change`,
-				{
-					password: this.user.password,
-					newPassword: this.user.newPassword
-				});
-			this.$buefy.toast.open(response.message);
+			const response = await this.$store.dispatch('auth/changePassword', {
+				password,
+				newPassword
+			});
+
+			if (response) {
+				this.$buefy.toast.open(response.message);
+			}
 		},
 		promptNewAPIKey() {
 			this.$buefy.dialog.confirm({
@@ -119,9 +135,7 @@ export default {
 			});
 		},
 		async requestNewAPIKey() {
-			const response = await this.$axios.$post(`user/apikey/change`);
-			this.user.apiKey = response.apiKey;
-			this.$forceUpdate();
+			const response = await this.$store.dispatch('auth/requestAPIKey');		
 			this.$buefy.toast.open(response.message);
 		}
 	}
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 6c1b99b..89f0fac 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -99,7 +99,7 @@ export default {
 			fetch: 'images/fetch'
 		}),
 		fetchPaginate() {
-			this.fetch(this.current)
+			this.fetch(this.current);
 		}
 	}
 };
-- 
cgit v1.2.3


From 7581d13d1cdbd190009dea11549669cfa5cc00ad Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Fri, 3 Jul 2020 00:35:09 +0300
Subject: feat: separate album view into multiple components and use vuex

---
 src/site/pages/dashboard/albums/index.vue | 312 ++----------------------------
 1 file changed, 11 insertions(+), 301 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 065667a..2a54ab8 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -25,118 +25,9 @@
 						</div>
 
 						<div class="view-container">
-							<div v-for="album in albums"
+							<AlbumEntry v-for="album in albums.list"
 								:key="album.id"
-								class="album">
-								<div class="arrow-container"
-									@click="fetchAlbumDetails(album)">
-									<i :class="{ active: album.isDetailsOpen }"
-										class="icon-arrow" />
-								</div>
-								<div class="thumb">
-									<figure class="image is-64x64 thumb">
-										<img src="~/assets/images/blank_darker.png">
-									</figure>
-								</div>
-								<div class="info">
-									<h4>
-										<router-link :to="`/dashboard/albums/${album.id}`">{{ album.name }}</router-link>
-									</h4>
-									<span>Updated <timeago :since="album.editedAt" /></span>
-									<span>{{ album.fileCount || 0 }} files</span>
-								</div>
-								<div class="latest is-hidden-mobile">
-									<template v-if="album.fileCount > 0">
-										<div v-for="file of album.files"
-											:key="file.id"
-											class="thumb">
-											<figure class="image is-64x64">
-												<a :href="file.url"
-													target="_blank">
-													<img :src="file.thumbSquare">
-												</a>
-											</figure>
-										</div>
-										<div v-if="album.fileCount > 5"
-											class="thumb more no-background">
-											<router-link :to="`/dashboard/albums/${album.id}`">{{ album.fileCount - 5 }}+ more</router-link>
-										</div>
-									</template>
-									<template v-else>
-										<span class="no-files">Nothing to show here</span>
-									</template>
-								</div>
-
-								<div v-if="album.isDetailsOpen"
-									class="details">
-									<h2>Public links for this album:</h2>
-
-									<b-table
-										:data="album.links.length ? album.links : []"
-										:mobile-cards="true">
-										<template slot-scope="props">
-											<b-table-column field="identifier"
-												label="Link"
-												centered>
-												<a :href="`${config.URL}/a/${props.row.identifier}`"
-													target="_blank">
-													{{ props.row.identifier }}
-												</a>
-											</b-table-column>
-
-											<b-table-column field="views"
-												label="Views"
-												centered>
-												{{ props.row.views }}
-											</b-table-column>
-
-											<b-table-column field="enableDownload"
-												label="Allow download"
-												centered>
-												<b-switch v-model="props.row.enableDownload"
-													@input="linkOptionsChanged(props.row)" />
-											</b-table-column>
-
-											<b-table-column field="enabled"
-												numeric>
-												<button class="button is-danger"
-													@click="promptDeleteAlbumLink(props.row.identifier)">Delete link</button>
-											</b-table-column>
-										</template>
-										<template slot="empty">
-											<div class="has-text-centered">
-												<i class="icon-misc-mood-sad" />
-											</div>
-											<div class="has-text-centered">
-												Nothing here
-											</div>
-										</template>
-										<template slot="footer">
-											<div class="level is-paddingless">
-												<div class="level-left">
-													<div class="level-item">
-														<button :class="{ 'is-loading': album.isCreatingLink }"
-															class="button is-primary"
-															style="float: left"
-															@click="createLink(album)">Create new link</button>
-													</div>
-													<div class="level-item">
-														<span class="has-text-default">{{ album.links.length }} / {{ config.maxLinksPerAlbum }} links created</span>
-													</div>
-												</div>
-
-												<div class="level-right">
-													<div class="level-item">
-														<button class="button is-danger"
-															style="float: right"
-															@click="promptDeleteAlbum(album.id)">Delete album</button>
-													</div>
-												</div>
-											</div>
-										</template>
-									</b-table>
-								</div>
-							</div>
+								:album="album" />
 						</div>
 					</div>
 				</div>
@@ -146,87 +37,28 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
+import AlbumEntry from '~/components/album/AlbumEntry.vue';
 
 export default {
 	components: {
-		Sidebar
+		Sidebar,
+		AlbumEntry
 	},
-	middleware: 'auth',
+	middleware: ['auth', ({ store }) => {
+		store.dispatch('albums/fetch');
+	}],
 	data() {
 		return {
-			albums: [],
 			newAlbumName: null
 		};
 	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
+	computed: mapState(['config', 'albums']),
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
-	mounted() {
-		this.getAlbums();
-	},
 	methods: {
-		async fetchAlbumDetails(album) {
-			const response = await this.$axios.$get(`album/${album.id}/links`);
-			album.links = response.links;
-			album.isDetailsOpen = !album.isDetailsOpen;
-			this.$forceUpdate();
-		},
-		promptDeleteAlbum(id) {
-			this.$buefy.dialog.confirm({
-				message: 'Are you sure you want to delete this album?',
-				onConfirm: () => this.deleteAlbum(id)
-			});
-		},
-		async deleteAlbum(id) {
-			const response = await this.$axios.$delete(`album/${id}`);
-			this.getAlbums();
-			return this.$buefy.toast.open(response.message);
-		},
-		promptDeleteAlbumLink(identifier) {
-			this.$buefy.dialog.confirm({
-				message: 'Are you sure you want to delete this album link?',
-				onConfirm: () => this.deleteAlbumLink(identifier)
-			});
-		},
-		async deleteAlbumLink(identifier) {
-			const response = await this.$axios.$delete(`album/link/delete/${identifier}`);
-			return this.$buefy.toast.open(response.message);
-		},
-		async linkOptionsChanged(link) {
-			const response = await this.$axios.$post(`album/link/edit`,
-				{
-					identifier: link.identifier,
-					enableDownload: link.enableDownload,
-					enabled: link.enabled
-				});
-			this.$buefy.toast.open(response.message);
-		},
-		async createLink(album) {
-			album.isCreatingLink = true;
-			// Since we actually want to change the state even if the call fails, use a try catch
-			try {
-				const response = await this.$axios.$post(`album/link/new`,
-					{ albumId: album.id });
-				this.$buefy.toast.open(response.message);
-				album.links.push({
-					identifier: response.identifier,
-					views: 0,
-					enabled: true,
-					enableDownload: true,
-					expiresAt: null
-				});
-			} catch (error) {
-				//
-			} finally {
-				album.isCreatingLink = false;
-			}
-		},
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
 			const response = await this.$axios.$post(`album/new`,
@@ -234,17 +66,11 @@ export default {
 			this.newAlbumName = null;
 			this.$buefy.toast.open(response.message);
 			this.getAlbums();
-		},
-		async getAlbums() {
-			const response = await this.$axios.$get(`albums/mini`);
-			for (const album of response.albums) {
-				album.isDetailsOpen = false;
-			}
-			this.albums = response.albums;
 		}
 	}
 };
 </script>
+
 <style lang="scss" scoped>
 	@import '~/assets/styles/_colors.scss';
 	div.view-container {
@@ -256,121 +82,5 @@ export default {
 		background-color: $base-2;
 	}
 
-	div.album {
-		display: flex;
-		flex-wrap: wrap;
-		margin-bottom: 10px;
-
-		div.arrow-container {
-			width: 2em;
-			height: 64px;
-			position: relative;
-			cursor: pointer;
-
-			i {
-				border: 2px solid $defaultTextColor;
-				border-right: 0;
-				border-top: 0;
-				display: block;
-				height: 1em;
-				position: absolute;
-				transform: rotate(-135deg);
-				transform-origin: center;
-				width: 1em;
-				z-index: 4;
-				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
-				transition: transform 0.1s linear;
-
-				&.active {
-					transform: rotate(-45deg);
-				}
-			}
-		}
-		div.thumb {
-			width: 64px;
-			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-
-		div.info {
-			margin-left: 15px;
-			text-align: left;
-			h4 {
-				font-size: 1.5rem;
-				a {
-					color: $defaultTextColor;
-					font-weight: 400;
-					&:hover { text-decoration: underline; }
-				}
-			}
-			span { display: block; }
-			span:nth-child(3) {
-				font-size: 0.9rem;
-			}
-		}
-
-		div.latest {
-			flex-grow: 1;
-			justify-content: flex-end;
-			display: flex;
-			margin-left: 15px;
-
-			span.no-files {
-				font-size: 1.5em;
-				color: #b1b1b1;
-				padding-top: 17px;
-			}
-
-			div.more {
-				width: 64px;
-				height: 64px;
-				background: white;
-				display: flex;
-				align-items: center;
-				padding: 10px;
-				text-align: center;
-				a {
-					line-height: 1rem;
-					color: $defaultTextColor;
-					&:hover { text-decoration: underline; }
-				}
-			}
-		}
-
-		div.details {
-			flex: 0 1 100%;
-			padding-left: 2em;
-			padding-top: 1em;
-			min-height: 50px;
-
-			.b-table {
-				padding: 2em 0em;
-
-				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
-				}
-			}
-		}
-	}
-
 	div.column > h2.subtitle { padding-top: 1px; }
-
-	div.no-background { background: none !important; }
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
-
-	.b-table {
-		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
-		}
-	}
 </style>
-- 
cgit v1.2.3


From 92be4504ccb8f6d918013e5c33870858cd22376a Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Sat, 4 Jul 2020 03:26:35 +0300
Subject: feat: refactor most of the album components to use store for
 presentation and actions

---
 src/site/pages/dashboard/admin/file/_id.vue |  2 +
 src/site/pages/dashboard/admin/user/_id.vue |  1 +
 src/site/pages/dashboard/albums/_id.vue     | 60 +++++++++++++++++++++--------
 src/site/pages/dashboard/albums/index.vue   | 28 ++++++++++----
 src/site/pages/dashboard/tags/index.vue     |  2 +
 5 files changed, 69 insertions(+), 24 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index 5821292..5853770 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -130,6 +130,7 @@ export default {
 	methods: {
 		promptDisableUser() {
 			this.$buefy.dialog.confirm({
+				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
 				onConfirm: () => this.disableUser()
 			});
@@ -142,6 +143,7 @@ export default {
 		},
 		promptBanIP() {
 			this.$buefy.dialog.confirm({
+				type: 'is-danger',
 				message: 'Are you sure you want to ban the IP this file was uploaded from?',
 				onConfirm: () => this.banIP()
 			});
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 2a56c34..8c73037 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -85,6 +85,7 @@ export default {
 	methods: {
 		promptDisableUser() {
 			this.$buefy.dialog.confirm({
+				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
 				onConfirm: () => this.disableUser()
 			});
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 47e7057..c082b63 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -10,25 +10,53 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">Files</h2>
+					<nav class="level">
+						<div class="level-left">
+							<div class="level-item">
+								<h2 class="subtitle">Files</h2>
+							</div>
+						</div>
+						<div class="level-right">
+							<div class="level-item">
+								<b-field>
+									<b-input
+										placeholder="Search"
+										type="search"/>
+									<p class="control">
+										<button
+											outlined
+											class="button is-primary">
+											Search
+										</button>
+									</p>
+								</b-field>
+							</div>
+						</div>
+					</nav>
+
 					<hr>
 
 					<Grid v-if="files.length"
-						:files="files" />
-
-					<b-pagination
-						v-if="count > perPage"
-						:total="count"
-						:per-page="perPage"
-						:current.sync="current"
-						class="pagination"
-						icon-prev="icon-interface-arrow-left"
-						icon-next="icon-interface-arrow-right"
-						icon-pack="icon"
-						aria-next-label="Next page"
-						aria-previous-label="Previous page"
-						aria-page-label="Page"
-						aria-current-label="Current page" />
+						:files="files"
+						:total="count">
+						<template v-slot:pagination>
+							<b-pagination
+								v-if="count > perPage"
+								:total="count"
+								:per-page="perPage"
+								:current.sync="current"
+								range-before="2"
+								range-after="2"
+								class="pagination-slot"
+								icon-prev="icon-interface-arrow-left"
+								icon-next="icon-interface-arrow-right"
+								icon-pack="icon"
+								aria-next-label="Next page"
+								aria-previous-label="Previous page"
+								aria-page-label="Page"
+								aria-current-label="Current page" />
+						</template>
+					</Grid>
 				</div>
 			</div>
 		</div>
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 2a54ab8..a010254 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -18,7 +18,8 @@
 									@keyup.enter.native="createAlbum" />
 								<p class="control">
 									<button outlined
-										class="button is-primary"
+										class="button is-black"
+										:disabled="isCreatingAlbum"
 										@click="createAlbum">Create album</button>
 								</p>
 							</b-field>
@@ -37,7 +38,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex';
+import { mapState, mapActions } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import AlbumEntry from '~/components/album/AlbumEntry.vue';
 
@@ -51,7 +52,8 @@ export default {
 	}],
 	data() {
 		return {
-			newAlbumName: null
+			newAlbumName: null,
+			isCreatingAlbum: false
 		};
 	},
 	computed: mapState(['config', 'albums']),
@@ -59,13 +61,23 @@ export default {
 		return { title: 'Uploads' };
 	},
 	methods: {
+		...mapActions({
+			'alert': 'alert/set'
+		}),
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
-			const response = await this.$axios.$post(`album/new`,
-				{ name: this.newAlbumName });
-			this.newAlbumName = null;
-			this.$buefy.toast.open(response.message);
-			this.getAlbums();
+
+			this.isCreatingAlbum = true;
+			try {
+				const response = await this.$store.dispatch('albums/createAlbum', this.newAlbumName);
+
+				this.alert({ text: response.message, error: false });
+			} catch (e) {
+				this.alert({ text: e.message, error: true });
+			} finally {
+				this.isCreatingAlbum = false;
+				this.newAlbumName = null;
+			}
 		}
 	}
 };
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 7c295b7..a9476da 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -228,12 +228,14 @@ export default {
 	methods: {
 		promptDeleteTag(id) {
 			this.$buefy.dialog.confirm({
+				type: 'is-danger',
 				message: 'Are you sure you want to delete this tag?',
 				onConfirm: () => this.promptPurgeTag(id)
 			});
 		},
 		promptPurgeTag(id) {
 			this.$buefy.dialog.confirm({
+				type: 'is-danger',
 				message: 'Would you like to delete every file associated with this tag?',
 				cancelText: 'No',
 				confirmText: 'Yes',
-- 
cgit v1.2.3


From 04fdd63cee5327f49e5e11d5837a9031027c34ef Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Sun, 5 Jul 2020 04:17:09 +0300
Subject: feat: refactor single album page to use vuex

---
 src/site/pages/dashboard/albums/_id.vue   | 94 +++++++++++++++++++------------
 src/site/pages/dashboard/albums/index.vue | 33 +++++++----
 2 files changed, 79 insertions(+), 48 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index c082b63..0d3bd68 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -13,7 +13,14 @@
 					<nav class="level">
 						<div class="level-left">
 							<div class="level-item">
-								<h2 class="subtitle">Files</h2>
+								<h1 class="title is-3">
+									{{ name }}
+								</h1>
+							</div>
+							<div class="level-item">
+								<h2 class="subtitle is-5">
+									({{ totalFiles }} files)
+								</h2>
 							</div>
 						</div>
 						<div class="level-right">
@@ -21,7 +28,7 @@
 								<b-field>
 									<b-input
 										placeholder="Search"
-										type="search"/>
+										type="search" />
 									<p class="control">
 										<button
 											outlined
@@ -36,14 +43,15 @@
 
 					<hr>
 
-					<Grid v-if="files.length"
-						:files="files"
-						:total="count">
+					<Grid
+						v-if="totalFiles"
+						:files="album.files"
+						:total="totalFiles">
 						<template v-slot:pagination>
 							<b-pagination
-								v-if="count > perPage"
-								:total="count"
-								:per-page="perPage"
+								v-if="shouldPaginate"
+								:total="totalFiles"
+								:per-page="limit"
 								:current.sync="current"
 								range-before="2"
 								range-after="2"
@@ -64,53 +72,65 @@
 </template>
 
 <script>
+import { mapState, mapGetters, mapActions } from 'vuex';
+
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import Grid from '~/components/grid/Grid.vue';
 
 export default {
 	components: {
 		Sidebar,
-		Grid
+		Grid,
 	},
-	middleware: 'auth',
+	middleware: ['auth', ({ route, store }) => {
+		store.dispatch('album/fetchById', { id: route.params.id });
+	}],
 	data() {
 		return {
-			name: null,
-			files: [],
-			count: 0,
 			current: 1,
-			perPage: 30
 		};
 	},
+	computed: {
+		...mapGetters({
+			totalFiles: 'album/getTotalFiles',
+			shouldPaginate: 'album/shouldPaginate',
+			limit: 'album/getLimit',
+			name: 'album/getName',
+		}),
+		...mapState(['album']),
+		id() {
+			return this.$route.params.id;
+		},
+	},
 	metaInfo() {
 		return { title: 'Album' };
 	},
 	watch: {
-		current: 'getFiles'
-	},
-	async asyncData({ $axios, route }) {
-		const perPage = 30;
-		const current = 1; // current page
-
-		try {
-			const response = await $axios.$get(`album/${route.params.id}/full`, { params: { page: current, limit: perPage }});
-			return {
-				files: response.files || [],
-				count: response.count || 0,
-				current,
-				perPage
-			};
-		} catch (error) {
-			console.error(error);
-			return { files: [] };
-		}
+		current: 'fetchPaginate',
 	},
 	methods: {
-		async getFiles() {
-			const response = await this.$axios.$get(`album/${this.$route.params.id}/full`, { params: { page: this.current, limit: this.perPage }});
-			this.files = response.files;
-			this.count = response.count;
-		}
+		...mapActions({
+			fetch: 'album/fetchById',
+		}),
+		fetchPaginate() {
+			this.fetch({ id: this.id, page: this.current });
+		},
 	},
 };
 </script>
+
+<style lang="scss" scoped>
+	div.grid {
+		margin-bottom: 1rem;
+	}
+
+	.pagination-slot {
+		padding: 1rem 0;
+	}
+</style>
+
+<style lang="scss">
+	.pagination-slot > .pagination-previous, .pagination-slot > .pagination-next {
+		display: none !important;
+	}
+</style>
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index a010254..a2ba522 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -7,26 +7,33 @@
 						<Sidebar />
 					</div>
 					<div class="column">
-						<h2 class="subtitle">Manage your albums</h2>
+						<h2 class="subtitle">
+							Manage your albums
+						</h2>
 						<hr>
 
 						<div class="search-container">
 							<b-field>
-								<b-input v-model="newAlbumName"
+								<b-input
+									v-model="newAlbumName"
 									placeholder="Album name..."
 									type="text"
 									@keyup.enter.native="createAlbum" />
 								<p class="control">
-									<button outlined
+									<button
+										outlined
 										class="button is-black"
 										:disabled="isCreatingAlbum"
-										@click="createAlbum">Create album</button>
+										@click="createAlbum">
+										Create album
+									</button>
 								</p>
 							</b-field>
 						</div>
 
 						<div class="view-container">
-							<AlbumEntry v-for="album in albums.list"
+							<AlbumEntry
+								v-for="album in albums.list"
 								:key="album.id"
 								:album="album" />
 						</div>
@@ -45,15 +52,19 @@ import AlbumEntry from '~/components/album/AlbumEntry.vue';
 export default {
 	components: {
 		Sidebar,
-		AlbumEntry
+		AlbumEntry,
 	},
 	middleware: ['auth', ({ store }) => {
-		store.dispatch('albums/fetch');
+		try {
+			store.dispatch('albums/fetch');
+		} catch (e) {
+			this.alert({ text: e.message, error: true });
+		}
 	}],
 	data() {
 		return {
 			newAlbumName: null,
-			isCreatingAlbum: false
+			isCreatingAlbum: false,
 		};
 	},
 	computed: mapState(['config', 'albums']),
@@ -62,7 +73,7 @@ export default {
 	},
 	methods: {
 		...mapActions({
-			'alert': 'alert/set'
+			'alert': 'alert/set',
 		}),
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
@@ -78,8 +89,8 @@ export default {
 				this.isCreatingAlbum = false;
 				this.newAlbumName = null;
 			}
-		}
-	}
+		},
+	},
 };
 </script>
 
-- 
cgit v1.2.3


From fb0bc57542a44dcc94149f393d8a4ff0c2e7902b Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Tue, 7 Jul 2020 02:02:59 +0300
Subject: feat: try fixing THE SHITTY WATERFALL

---
 src/site/pages/dashboard/account.vue        |  78 +++++---
 src/site/pages/dashboard/admin/user/_id.vue |  45 +++--
 src/site/pages/dashboard/admin/users.vue    | 270 ++++++++++++++--------------
 src/site/pages/dashboard/albums/_id.vue     |  17 +-
 src/site/pages/dashboard/index.vue          |  42 +++--
 5 files changed, 251 insertions(+), 201 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 1c335e8..fb8b273 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -6,62 +6,82 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">Account settings</h2>
+					<h2 class="subtitle">
+						Account settings
+					</h2>
 					<hr>
 
-					<b-field label="Username"
+					<b-field
+						label="Username"
 						message="Nothing to do here"
 						horizontal>
-						<b-input :value="user.username"
+						<b-input
+							:value="user.username"
 							expanded
 							disabled />
 					</b-field>
 
-					<b-field label="Current password"
+					<b-field
+						label="Current password"
 						message="If you want to change your password input the current one here"
 						horizontal>
-						<b-input v-model="password"
+						<b-input
+							v-model="password"
 							type="password"
 							expanded />
 					</b-field>
 
-					<b-field label="New password"
+					<b-field
+						label="New password"
 						message="Your new password"
 						horizontal>
-						<b-input v-model="newPassword"
+						<b-input
+							v-model="newPassword"
 							type="password"
 							expanded />
 					</b-field>
 
-					<b-field label="New password again"
+					<b-field
+						label="New password again"
 						message="Your new password once again"
 						horizontal>
-						<b-input v-model="reNewPassword"
+						<b-input
+							v-model="reNewPassword"
 							type="password"
 							expanded />
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button class="button is-primary"
-							@click="changePassword">Change password</button>
+						<button
+							class="button is-primary"
+							@click="changePassword">
+							Change password
+						</button>
 					</div>
 
-					<b-field label="API key"
+					<b-field
+						label="API key"
 						message="This API key lets you use the service from other apps"
 						horizontal>
 						<b-field expanded>
-							<b-input :value="apiKey"
+							<b-input
+								:value="apiKey"
 								expanded
 								disabled />
 							<p class="control">
-								<button class="button is-primary">Copy</button>
+								<button class="button is-primary">
+									Copy
+								</button>
 							</p>
 						</b-field>
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button class="button is-primary"
-							@click="promptNewAPIKey">Request new API key</button>
+						<button
+							class="button is-primary"
+							@click="promptNewAPIKey">
+							Request new API key
+						</button>
 					</div>
 				</div>
 			</div>
@@ -75,7 +95,7 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar
+		Sidebar,
 	},
 	middleware: ['auth', ({ store }) => {
 		store.dispatch('auth/fetchCurrentUser');
@@ -84,21 +104,21 @@ export default {
 		return {
 			password: '',
 			newPassword: '',
-			reNewPassword: ''
+			reNewPassword: '',
 		};
-	}, 
+	},
 	computed: {
 		...mapGetters({ 'apiKey': 'auth/getApiKey' }),
 		...mapState({
-			user: state => state.auth.user
-		})
+			user: (state) => state.auth.user,
+		}),
 	},
 	metaInfo() {
 		return { title: 'Account' };
 	},
 	methods: {
 		...mapActions({
-			getUserSetttings: 'auth/fetchCurrentUser'
+			getUserSetttings: 'auth/fetchCurrentUser',
 		}),
 		async changePassword() {
 			const { password, newPassword, reNewPassword } = this;
@@ -106,21 +126,21 @@ export default {
 			if (!password || !newPassword || !reNewPassword) {
 				this.$store.dispatch('alert/set', {
 					text: 'One or more fields are missing',
-					error: true
+					error: true,
 				});
 				return;
 			}
 			if (newPassword !== reNewPassword) {
 				this.$store.dispatch('alert/set', {
 					text: 'Passwords don\'t match',
-					error: true
+					error: true,
 				});
 				return;
 			}
 
 			const response = await this.$store.dispatch('auth/changePassword', {
 				password,
-				newPassword
+				newPassword,
 			});
 
 			if (response) {
@@ -131,13 +151,13 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to regenerate your API key? Previously generated API keys will stop working. Make sure to write the new key down as this is the only time it will be displayed to you.',
-				onConfirm: () => this.requestNewAPIKey()
+				onConfirm: () => this.requestNewAPIKey(),
 			});
 		},
 		async requestNewAPIKey() {
-			const response = await this.$store.dispatch('auth/requestAPIKey');		
+			const response = await this.$store.dispatch('auth/requestAPIKey');
 			this.$buefy.toast.open(response.message);
-		}
-	}
+		},
+	},
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 8c73037..1755b89 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -9,40 +9,51 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">User details</h2>
+					<h2 class="subtitle">
+						User details
+					</h2>
 					<hr>
 
-					<b-field label="User Id"
+					<b-field
+						label="User Id"
 						horizontal>
 						<span>{{ user.id }}</span>
 					</b-field>
 
-					<b-field label="Username"
+					<b-field
+						label="Username"
 						horizontal>
 						<span>{{ user.username }}</span>
 					</b-field>
 
-					<b-field label="Enabled"
+					<b-field
+						label="Enabled"
 						horizontal>
 						<span>{{ user.enabled }}</span>
 					</b-field>
 
-					<b-field label="Registered"
+					<b-field
+						label="Registered"
 						horizontal>
 						<span><timeago :since="user.createdAt" /></span>
 					</b-field>
 
-					<b-field label="Files"
+					<b-field
+						label="Files"
 						horizontal>
 						<span>{{ files.length }}</span>
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button class="button is-danger"
-							@click="promptDisableUser">Disable user</button>
+						<button
+							class="button is-danger"
+							@click="promptDisableUser">
+							Disable user
+						</button>
 					</div>
 
-					<Grid v-if="files.length"
+					<Grid
+						v-if="files.length"
 						:files="files" />
 				</div>
 			</div>
@@ -57,14 +68,14 @@ import Grid from '~/components/grid/Grid.vue';
 export default {
 	components: {
 		Sidebar,
-		Grid
+		Grid,
 	},
 	middleware: ['auth', 'admin'],
 	data() {
 		return {
 			options: {},
 			files: null,
-			user: null
+			user: null,
 		};
 	},
 	async asyncData({ $axios, route }) {
@@ -72,13 +83,13 @@ export default {
 			const response = await $axios.$get(`/admin/users/${route.params.id}`);
 			return {
 				files: response.files ? response.files : null,
-				user: response.user ? response.user : null
+				user: response.user ? response.user : null,
 			};
 		} catch (error) {
 			console.error(error);
 			return {
 				files: null,
-				user: null
+				user: null,
 			};
 		}
 	},
@@ -87,15 +98,15 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
-				onConfirm: () => this.disableUser()
+				onConfirm: () => this.disableUser(),
 			});
 		},
 		async disableUser() {
 			const response = await this.$axios.$post('admin/users/disable', {
-				id: this.user.id
+				id: this.user.id,
 			});
 			this.$buefy.toast.open(response.message);
-		}
-	}
+		},
+	},
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index 695cf0b..269946c 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -1,3 +1,143 @@
+<template>
+	<section class="section is-fullheight dashboard">
+		<div class="container">
+			<div class="columns">
+				<div class="column is-narrow">
+					<Sidebar />
+				</div>
+				<div class="column">
+					<h2 class="subtitle">
+						Manage your users
+					</h2>
+					<hr>
+
+					<div class="view-container">
+						<b-table
+							:data="users || []"
+							:mobile-cards="true">
+							<template slot-scope="props">
+								<b-table-column
+									field="id"
+									label="Id"
+									centered>
+									{{ props.row.id }}
+								</b-table-column>
+
+								<b-table-column
+									field="username"
+									label="Username"
+									centered>
+									<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">
+										{{ props.row.username }}
+									</nuxt-link>
+								</b-table-column>
+
+								<b-table-column
+									field="enabled"
+									label="Enabled"
+									centered>
+									<b-switch
+										v-model="props.row.enabled"
+										@input="changeEnabledStatus(props.row)" />
+								</b-table-column>
+
+								<b-table-column
+									field="isAdmin"
+									label="Admin"
+									centered>
+									<b-switch
+										v-model="props.row.isAdmin"
+										@input="changeIsAdmin(props.row)" />
+								</b-table-column>
+
+								<b-table-column
+									field="purge"
+									centered>
+									<button
+										class="button is-primary"
+										@click="promptPurgeFiles(props.row)">
+										Purge files
+									</button>
+								</b-table-column>
+							</template>
+							<template slot="empty">
+								<div class="has-text-centered">
+									<i class="icon-misc-mood-sad" />
+								</div>
+								<div class="has-text-centered">
+									Nothing here
+								</div>
+							</template>
+							<template slot="footer">
+								<div class="has-text-right">
+									{{ users.length }} users
+								</div>
+							</template>
+						</b-table>
+					</div>
+				</div>
+			</div>
+		</div>
+	</section>
+</template>
+
+<script>
+import Sidebar from '~/components/sidebar/Sidebar.vue';
+
+export default {
+	components: {
+		Sidebar,
+	},
+	middleware: ['auth', 'admin'],
+	data() {
+		return {
+			users: [],
+		};
+	},
+	computed: {
+		config() {
+			return this.$store.state.config;
+		},
+	},
+	metaInfo() {
+		return { title: 'Uploads' };
+	},
+	mounted() {
+		this.getUsers();
+	},
+	methods: {
+		async getUsers() {
+			const response = await this.$axios.$get('admin/users');
+			this.users = response.users;
+		},
+		async changeEnabledStatus(row) {
+			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
+				id: row.id,
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		async changeIsAdmin(row) {
+			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
+				id: row.id,
+			});
+			this.$buefy.toast.open(response.message);
+		},
+		promptPurgeFiles(row) {
+			this.$buefy.dialog.confirm({
+				message: 'Are you sure you want to delete this user\'s files?',
+				onConfirm: () => this.purgeFiles(row),
+			});
+		},
+		async purgeFiles(row) {
+			const response = await this.$axios.$post('admin/users/purge', {
+				id: row.id,
+			});
+			this.$buefy.toast.open(response.message);
+		},
+	},
+};
+</script>
+
 <style lang="scss" scoped>
 	@import '~/assets/styles/_colors.scss';
 	div.view-container {
@@ -107,9 +247,6 @@
 	}
 
 	div.column > h2.subtitle { padding-top: 1px; }
-</style>
-<style lang="scss">
-	@import '~/assets/styles/_colors.scss';
 
 	.b-table {
 		.table-wrapper {
@@ -118,130 +255,3 @@
 		}
 	}
 </style>
-
-
-<template>
-	<section class="section is-fullheight dashboard">
-		<div class="container">
-			<div class="columns">
-				<div class="column is-narrow">
-					<Sidebar />
-				</div>
-				<div class="column">
-					<h2 class="subtitle">Manage your users</h2>
-					<hr>
-
-					<div class="view-container">
-						<b-table
-							:data="users || []"
-							:mobile-cards="true">
-							<template slot-scope="props">
-								<b-table-column field="id"
-									label="Id"
-									centered>
-									{{ props.row.id }}
-								</b-table-column>
-
-								<b-table-column field="username"
-									label="Username"
-									centered>
-									<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">{{ props.row.username }}</nuxt-link>
-								</b-table-column>
-
-								<b-table-column field="enabled"
-									label="Enabled"
-									centered>
-									<b-switch v-model="props.row.enabled"
-										@input="changeEnabledStatus(props.row)" />
-								</b-table-column>
-
-								<b-table-column field="isAdmin"
-									label="Admin"
-									centered>
-									<b-switch v-model="props.row.isAdmin"
-										@input="changeIsAdmin(props.row)" />
-								</b-table-column>
-
-								<b-table-column field="purge"
-									centered>
-									<button class="button is-primary"
-										@click="promptPurgeFiles(props.row)">Purge files</button>
-								</b-table-column>
-							</template>
-							<template slot="empty">
-								<div class="has-text-centered">
-									<i class="icon-misc-mood-sad" />
-								</div>
-								<div class="has-text-centered">
-									Nothing here
-								</div>
-							</template>
-							<template slot="footer">
-								<div class="has-text-right">
-									{{ users.length }} users
-								</div>
-							</template>
-						</b-table>
-					</div>
-				</div>
-			</div>
-		</div>
-	</section>
-</template>
-
-<script>
-import Sidebar from '~/components/sidebar/Sidebar.vue';
-
-export default {
-	components: {
-		Sidebar
-	},
-	middleware: ['auth', 'admin'],
-	data() {
-		return {
-			users: []
-		};
-	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		}
-	},
-	metaInfo() {
-		return { title: 'Uploads' };
-	},
-	mounted() {
-		this.getUsers();
-	},
-	methods: {
-		async getUsers() {
-			const response = await this.$axios.$get(`admin/users`);
-			this.users = response.users;
-		},
-		async changeEnabledStatus(row) {
-			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		},
-		async changeIsAdmin(row) {
-			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		},
-		promptPurgeFiles(row) {
-			this.$buefy.dialog.confirm({
-				message: 'Are you sure you want to delete this user\'s files?',
-				onConfirm: () => this.purgeFiles(row)
-			});
-		},
-		async purgeFiles(row) {
-			const response = await this.$axios.$post(`admin/users/purge`, {
-				id: row.id
-			});
-			this.$buefy.toast.open(response.message);
-		}
-	}
-};
-</script>
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 0d3bd68..33b0319 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -14,7 +14,7 @@
 						<div class="level-left">
 							<div class="level-item">
 								<h1 class="title is-3">
-									{{ name }}
+									{{ images.name }}
 								</h1>
 							</div>
 							<div class="level-item">
@@ -45,7 +45,7 @@
 
 					<Grid
 						v-if="totalFiles"
-						:files="album.files"
+						:files="images.files"
 						:total="totalFiles">
 						<template v-slot:pagination>
 							<b-pagination
@@ -83,7 +83,7 @@ export default {
 		Grid,
 	},
 	middleware: ['auth', ({ route, store }) => {
-		store.dispatch('album/fetchById', { id: route.params.id });
+		store.dispatch('images/fetchByAlbumId', { id: route.params.id });
 	}],
 	data() {
 		return {
@@ -92,12 +92,11 @@ export default {
 	},
 	computed: {
 		...mapGetters({
-			totalFiles: 'album/getTotalFiles',
-			shouldPaginate: 'album/shouldPaginate',
-			limit: 'album/getLimit',
-			name: 'album/getName',
+			totalFiles: 'images/getTotalFiles',
+			shouldPaginate: 'images/shouldPaginate',
+			limit: 'images/getLimit',
 		}),
-		...mapState(['album']),
+		...mapState(['images']),
 		id() {
 			return this.$route.params.id;
 		},
@@ -110,7 +109,7 @@ export default {
 	},
 	methods: {
 		...mapActions({
-			fetch: 'album/fetchById',
+			fetch: 'images/fetchByAlbumId',
 		}),
 		fetchPaginate() {
 			this.fetch({ id: this.id, page: this.current });
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 89f0fac..71df7eb 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -9,7 +9,9 @@
 					<nav class="level">
 						<div class="level-left">
 							<div class="level-item">
-								<h2 class="subtitle">Your uploaded files</h2>
+								<h2 class="subtitle">
+									Your uploaded files
+								</h2>
 							</div>
 						</div>
 						<div class="level-right">
@@ -17,7 +19,7 @@
 								<b-field>
 									<b-input
 										placeholder="Search"
-										type="search"/>
+										type="search" />
 									<p class="control">
 										<button
 											outlined
@@ -28,15 +30,17 @@
 								</b-field>
 							</div>
 						</div>
-					</nav>					
+					</nav>
 					<hr>
 
 					<b-loading :active="images.isLoading" />
 
-					<Grid v-if="totalFiles"
+					<Grid
+						v-if="totalFiles && !isLoading"
 						:files="images.files"
 						:enableSearch="false"
-						class="grid">
+						class="grid"
+						@delete="handleFileDelete">
 						<template v-slot:pagination>
 							<b-pagination
 								v-if="shouldPaginate"
@@ -70,38 +74,44 @@ import Grid from '~/components/grid/Grid.vue';
 export default {
 	components: {
 		Sidebar,
-		Grid
+		Grid,
 	},
 	middleware: ['auth', ({ store }) => {
 		store.dispatch('images/fetch');
 	}],
 	data() {
 		return {
-			current: 1
+			current: 1,
+			isLoading: false,
 		};
 	},
 	computed: {
-		...mapGetters({ 
+		...mapGetters({
 			totalFiles: 'images/getTotalFiles',
 			shouldPaginate: 'images/shouldPaginate',
-			limit: 'images/getLimit'
+			limit: 'images/getLimit',
 		}),
-		...mapState(['images'])
+		...mapState(['images']),
 	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
 	watch: {
-		current: 'fetchPaginate'
+		current: 'fetchPaginate',
 	},
 	methods: {
 		...mapActions({
-			fetch: 'images/fetch'
+			fetch: 'images/fetch',
 		}),
-		fetchPaginate() {
-			this.fetch(this.current);
-		}
-	}
+		async fetchPaginate() {
+			this.isLoading = true;
+			await this.fetch(this.current);
+			this.isLoading = false;
+		},
+		handleFileDelete(file) {
+			console.log('yep!', file.id);
+		},
+	},
 };
 </script>
 
-- 
cgit v1.2.3


From b519b6ccb469e874c783b995ddf0ab6fabdb5a0e Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Wed, 8 Jul 2020 03:37:50 +0300
Subject: refactor: refactor grid to use vuex for every action

---
 src/site/pages/dashboard/albums/_id.vue | 1 +
 src/site/pages/dashboard/index.vue      | 9 +++------
 2 files changed, 4 insertions(+), 6 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 33b0319..b25762e 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -83,6 +83,7 @@ export default {
 		Grid,
 	},
 	middleware: ['auth', ({ route, store }) => {
+		store.commit('images/resetState');
 		store.dispatch('images/fetchByAlbumId', { id: route.params.id });
 	}],
 	data() {
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 71df7eb..2f06c7e 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -33,14 +33,13 @@
 					</nav>
 					<hr>
 
-					<b-loading :active="images.isLoading" />
+					<!-- <b-loading :active="images.isLoading" /> -->
 
 					<Grid
 						v-if="totalFiles && !isLoading"
 						:files="images.files"
 						:enableSearch="false"
-						class="grid"
-						@delete="handleFileDelete">
+						class="grid">
 						<template v-slot:pagination>
 							<b-pagination
 								v-if="shouldPaginate"
@@ -77,6 +76,7 @@ export default {
 		Grid,
 	},
 	middleware: ['auth', ({ store }) => {
+		store.commit('images/resetState');
 		store.dispatch('images/fetch');
 	}],
 	data() {
@@ -108,9 +108,6 @@ export default {
 			await this.fetch(this.current);
 			this.isLoading = false;
 		},
-		handleFileDelete(file) {
-			console.log('yep!', file.id);
-		},
 	},
 };
 </script>
-- 
cgit v1.2.3


From ad852de51a0d2dd5d29c08838d5a430c58849e74 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Wed, 8 Jul 2020 04:00:12 +0300
Subject: chore: linter the entire project using the new rules

---
 src/site/pages/dashboard/admin/file/_id.vue | 82 ++++++++++++++++++----------
 src/site/pages/dashboard/admin/settings.vue | 85 +++++++++++++++++++----------
 src/site/pages/dashboard/tags/index.vue     | 43 +++++++++------
 3 files changed, 133 insertions(+), 77 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index 5853770..34fcd01 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -9,74 +9,90 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">File details</h2>
+					<h2 class="subtitle">
+						File details
+					</h2>
 					<hr>
 
 					<div class="columns">
 						<div class="column is-6">
-							<b-field label="ID"
+							<b-field
+								label="ID"
 								horizontal>
 								<span>{{ file.id }}</span>
 							</b-field>
 
-							<b-field label="Name"
+							<b-field
+								label="Name"
 								horizontal>
 								<span>{{ file.name }}</span>
 							</b-field>
 
-							<b-field label="Original Name"
+							<b-field
+								label="Original Name"
 								horizontal>
 								<span>{{ file.original }}</span>
 							</b-field>
 
-							<b-field label="IP"
+							<b-field
+								label="IP"
 								horizontal>
 								<span class="underline">{{ file.ip }}</span>
 							</b-field>
 
-							<b-field label="Link"
+							<b-field
+								label="Link"
 								horizontal>
-								<a :href="file.url"
+								<a
+									:href="file.url"
 									target="_blank">{{ file.url }}</a>
 							</b-field>
 
-							<b-field label="Size"
+							<b-field
+								label="Size"
 								horizontal>
 								<span>{{ formatBytes(file.size) }}</span>
 							</b-field>
 
-							<b-field label="Hash"
+							<b-field
+								label="Hash"
 								horizontal>
 								<span>{{ file.hash }}</span>
 							</b-field>
 
-							<b-field label="Uploaded"
+							<b-field
+								label="Uploaded"
 								horizontal>
 								<span><timeago :since="file.createdAt" /></span>
 							</b-field>
 						</div>
 						<div class="column is-6">
-							<b-field label="User Id"
+							<b-field
+								label="User Id"
 								horizontal>
 								<span>{{ user.id }}</span>
 							</b-field>
 
-							<b-field label="Username"
+							<b-field
+								label="Username"
 								horizontal>
 								<span>{{ user.username }}</span>
 							</b-field>
 
-							<b-field label="Enabled"
+							<b-field
+								label="Enabled"
 								horizontal>
 								<span>{{ user.enabled }}</span>
 							</b-field>
 
-							<b-field label="Registered"
+							<b-field
+								label="Registered"
 								horizontal>
 								<span><timeago :since="user.createdAt" /></span>
 							</b-field>
 
-							<b-field label="Files"
+							<b-field
+								label="Files"
 								horizontal>
 								<span>
 									<nuxt-link :to="`/dashboard/admin/user/${user.id}`">{{ user.fileCount }}</nuxt-link>
@@ -86,10 +102,16 @@
 					</div>
 
 					<div class="mb2 mt2 text-center">
-						<button class="button is-danger"
-							@click="promptBanIP">Ban IP</button>
-						<button class="button is-danger"
-							@click="promptDisableUser">Disable user</button>
+						<button
+							class="button is-danger"
+							@click="promptBanIP">
+							Ban IP
+						</button>
+						<button
+							class="button is-danger"
+							@click="promptDisableUser">
+							Disable user
+						</button>
 					</div>
 				</div>
 			</div>
@@ -102,14 +124,14 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar
+		Sidebar,
 	},
 	middleware: ['auth', 'admin'],
 	data() {
 		return {
 			options: {},
 			file: null,
-			user: null
+			user: null,
 		};
 	},
 	async asyncData({ $axios, route }) {
@@ -117,13 +139,13 @@ export default {
 			const response = await $axios.$get(`file/${route.params.id}`);
 			return {
 				file: response.file ? response.file : null,
-				user: response.user ? response.user : null
+				user: response.user ? response.user : null,
 			};
 		} catch (error) {
 			console.error(error);
 			return {
 				file: null,
-				user: null
+				user: null,
 			};
 		}
 	},
@@ -132,12 +154,12 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
-				onConfirm: () => this.disableUser()
+				onConfirm: () => this.disableUser(),
 			});
 		},
 		async disableUser() {
 			const response = await this.$axios.$post('admin/users/disable', {
-				id: this.user.id
+				id: this.user.id,
 			});
 			this.$buefy.toast.open(response.message);
 		},
@@ -145,12 +167,12 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to ban the IP this file was uploaded from?',
-				onConfirm: () => this.banIP()
+				onConfirm: () => this.banIP(),
 			});
 		},
 		async banIP() {
 			const response = await this.$axios.$post('admin/ban/ip', {
-				ip: this.file.ip
+				ip: this.file.ip,
 			});
 			this.$buefy.toast.open(response.message);
 		},
@@ -163,8 +185,8 @@ export default {
 
 			const i = Math.floor(Math.log(bytes) / Math.log(k));
 
-			return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
-		}
-	}
+			return `${parseFloat((bytes / k ** i).toFixed(dm))} ${sizes[i]}`;
+		},
+	},
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 2d59fff..9e63a7c 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -6,87 +6,112 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">Service settings</h2>
+					<h2 class="subtitle">
+						Service settings
+					</h2>
 					<hr>
 
-					<b-field label="Service name"
+					<b-field
+						label="Service name"
 						message="Please enter the name which this service is gonna be identified as"
 						horizontal>
-						<b-input v-model="options.serviceName"
+						<b-input
+							v-model="options.serviceName"
 							expanded />
 					</b-field>
 
-					<b-field label="Upload folder"
+					<b-field
+						label="Upload folder"
 						message="Where to store the files relative to the working directory"
 						horizontal>
-						<b-input v-model="options.uploadFolder"
+						<b-input
+							v-model="options.uploadFolder"
 							expanded />
 					</b-field>
 
-					<b-field label="Links per album"
+					<b-field
+						label="Links per album"
 						message="Maximum links allowed per album"
 						horizontal>
-						<b-input v-model="options.linksPerAlbum"
+						<b-input
+							v-model="options.linksPerAlbum"
 							type="number"
 							expanded />
 					</b-field>
 
-					<b-field label="Max upload size"
+					<b-field
+						label="Max upload size"
 						message="Maximum allowed file size in MB"
 						horizontal>
-						<b-input v-model="options.maxUploadSize"
+						<b-input
+							v-model="options.maxUploadSize"
 							expanded />
 					</b-field>
 
-					<b-field label="Filename length"
+					<b-field
+						label="Filename length"
 						message="How many characters long should the generated filenames be"
 						horizontal>
-						<b-input v-model="options.filenameLength"
+						<b-input
+							v-model="options.filenameLength"
 							expanded />
 					</b-field>
 
-					<b-field label="Album link length"
+					<b-field
+						label="Album link length"
 						message="How many characters a link for an album should have"
 						horizontal>
-						<b-input v-model="options.albumLinkLength"
+						<b-input
+							v-model="options.albumLinkLength"
 							expanded />
 					</b-field>
 
-					<b-field label="Generate thumbnails"
+					<b-field
+						label="Generate thumbnails"
 						message="Generate thumbnails when uploading a file if possible"
 						horizontal>
-						<b-switch v-model="options.generateThumbnails"
+						<b-switch
+							v-model="options.generateThumbnails"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
 
-					<b-field label="Generate zips"
+					<b-field
+						label="Generate zips"
 						message="Allow generating zips to download entire albums"
 						horizontal>
-						<b-switch v-model="options.generateZips"
+						<b-switch
+							v-model="options.generateZips"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
 
-					<b-field label="Public mode"
+					<b-field
+						label="Public mode"
 						message="Enable anonymous uploades"
 						horizontal>
-						<b-switch v-model="options.publicMode"
+						<b-switch
+							v-model="options.publicMode"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
 
-					<b-field label="Enable creating account"
+					<b-field
+						label="Enable creating account"
 						message="Enable creating new accounts in the platform"
 						horizontal>
-						<b-switch v-model="options.enableAccounts"
+						<b-switch
+							v-model="options.enableAccounts"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button class="button is-primary"
-							@click="promptRestartService">Save and restart service</button>
+						<button
+							class="button is-primary"
+							@click="promptRestartService">
+							Save and restart service
+						</button>
 					</div>
 				</div>
 			</div>
@@ -99,12 +124,12 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar
+		Sidebar,
 	},
 	middleware: ['auth', 'admin'],
 	data() {
 		return {
-			options: {}
+			options: {},
 		};
 	},
 	metaInfo() {
@@ -115,19 +140,19 @@ export default {
 	},
 	methods: {
 		async getSettings() {
-			const response = await this.$axios.$get(`service/config`);
+			const response = await this.$axios.$get('service/config');
 			this.options = response.config;
 		},
 		promptRestartService() {
 			this.$buefy.dialog.confirm({
 				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
-				onConfirm: () => this.restartService()
+				onConfirm: () => this.restartService(),
 			});
 		},
 		async restartService() {
-			const response = await this.$axios.$post(`service/restart`);
+			const response = await this.$axios.$post('service/restart');
 			this.$buefy.toast.open(response.message);
-		}
-	}
+		},
+	},
 };
 </script>
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index a9476da..10193a8 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -123,7 +123,6 @@
 	}
 </style>
 
-
 <template>
 	<section class="section is-fullheight dashboard">
 		<div class="container">
@@ -132,27 +131,35 @@
 					<Sidebar />
 				</div>
 				<div class="column">
-					<h2 class="subtitle">Manage your tags</h2>
+					<h2 class="subtitle">
+						Manage your tags
+					</h2>
 					<hr>
 
 					<div class="search-container">
 						<b-field>
-							<b-input v-model="newTagName"
+							<b-input
+								v-model="newTagName"
 								placeholder="Tag name..."
 								type="text"
 								@keyup.enter.native="createTag" />
 							<p class="control">
-								<button class="button is-primary"
-									@click="createTag">Create tags</button>
+								<button
+									class="button is-primary"
+									@click="createTag">
+									Create tags
+								</button>
 							</p>
 						</b-field>
 					</div>
 
 					<div class="view-container">
-						<div v-for="tag in tags"
+						<div
+							v-for="tag in tags"
 							:key="tag.id"
 							class="album">
-							<div class="arrow-container"
+							<div
+								class="arrow-container"
 								@click="promptDeleteTag">
 								<i class="icon-arrow" />
 							</div>
@@ -165,7 +172,9 @@
 							-->
 							<div class="info">
 								<h4>
-									<router-link :to="`/dashboard/tags/${tag.id}`">{{ tag.name }}</router-link>
+									<router-link :to="`/dashboard/tags/${tag.id}`">
+										{{ tag.name }}
+									</router-link>
 								</h4>
 								<span>{{ tag.count || 0 }} files</span>
 							</div>
@@ -205,19 +214,19 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar
+		Sidebar,
 	},
 	middleware: 'auth',
 	data() {
 		return {
 			tags: [],
-			newTagName: null
+			newTagName: null,
 		};
 	},
 	computed: {
 		config() {
 			return this.$store.state.config;
-		}
+		},
 	},
 	metaInfo() {
 		return { title: 'Tags' };
@@ -230,7 +239,7 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to delete this tag?',
-				onConfirm: () => this.promptPurgeTag(id)
+				onConfirm: () => this.promptPurgeTag(id),
 			});
 		},
 		promptPurgeTag(id) {
@@ -240,7 +249,7 @@ export default {
 				cancelText: 'No',
 				confirmText: 'Yes',
 				onConfirm: () => this.deleteTag(id, true),
-				onCancel: () => this.deleteTag(id, false)
+				onCancel: () => this.deleteTag(id, false),
 			});
 		},
 		async deleteTag(id, purge) {
@@ -250,19 +259,19 @@ export default {
 		},
 		async createTag() {
 			if (!this.newTagName || this.newTagName === '') return;
-			const response = await this.$axios.$post(`tag/new`,
+			const response = await this.$axios.$post('tag/new',
 				{ name: this.newTagName });
 			this.newTagName = null;
 			this.$buefy.toast.open(response.message);
 			this.getTags();
 		},
 		async getTags() {
-			const response = await this.$axios.$get(`tags`);
+			const response = await this.$axios.$get('tags');
 			for (const tag of response.tags) {
 				tag.isDetailsOpen = false;
 			}
 			this.tags = response.tags;
-		}
-	}
+		},
+	},
 };
 </script>
-- 
cgit v1.2.3


From fd3f6de51a082dcd72c2ef557747e031ef7b9c4a Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 9 Jul 2020 02:24:40 +0300
Subject: refactor: refactor most of the admin pages to use the store instead
 of internal states

---
 src/site/pages/dashboard/account.vue        | 22 ++++++----
 src/site/pages/dashboard/admin/user/_id.vue | 66 ++++++++++++++++-------------
 src/site/pages/dashboard/admin/users.vue    | 66 +++++++++++++----------------
 src/site/pages/dashboard/albums/_id.vue     |  6 +--
 src/site/pages/dashboard/index.vue          |  6 +--
 src/site/pages/dashboard/tags/index.vue     |  6 +--
 6 files changed, 88 insertions(+), 84 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index fb8b273..31ec8af 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -52,11 +52,11 @@
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button
-							class="button is-primary"
+						<b-button
+							type="is-lolisafe"
 							@click="changePassword">
 							Change password
-						</button>
+						</b-button>
 					</div>
 
 					<b-field
@@ -69,19 +69,21 @@
 								expanded
 								disabled />
 							<p class="control">
-								<button class="button is-primary">
+								<b-button
+									type="is-lolisafe"
+									@click="copyKey">
 									Copy
-								</button>
+								</b-button>
 							</p>
 						</b-field>
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button
-							class="button is-primary"
+						<b-button
+							type="is-lolisafe"
 							@click="promptNewAPIKey">
 							Request new API key
-						</button>
+						</b-button>
 					</div>
 				</div>
 			</div>
@@ -154,6 +156,10 @@ export default {
 				onConfirm: () => this.requestNewAPIKey(),
 			});
 		},
+		copyKey() {
+			this.$clipboard(this.apiKey);
+			this.$notifier.success('API key copied to clipboard');
+		},
 		async requestNewAPIKey() {
 			const response = await this.$store.dispatch('auth/requestAPIKey');
 			this.$buefy.toast.open(response.message);
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 1755b89..7814468 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -41,20 +41,27 @@
 					<b-field
 						label="Files"
 						horizontal>
-						<span>{{ files.length }}</span>
+						<span>{{ user.files.length }}</span>
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
-						<button
-							class="button is-danger"
+						<b-button
+							v-if="user.enabled"
+							type="is-danger"
 							@click="promptDisableUser">
 							Disable user
-						</button>
+						</b-button>
+						<b-button
+							v-if="!user.enabled"
+							type="is-success"
+							@click="promptEnableUser">
+							Enable user
+						</b-button>
 					</div>
 
 					<Grid
-						v-if="files.length"
-						:files="files" />
+						v-if="user.files.length"
+						:files="user.files" />
 				</div>
 			</div>
 		</div>
@@ -62,6 +69,7 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import Grid from '~/components/grid/Grid.vue';
 
@@ -70,42 +78,42 @@ export default {
 		Sidebar,
 		Grid,
 	},
-	middleware: ['auth', 'admin'],
+	middleware: ['auth', 'admin', ({ route, store }) => {
+		try {
+			store.dispatch('admin/fetchUser', route.params.id);
+		} catch (e) {
+			// eslint-disable-next-line no-console
+			console.error(e);
+		}
+	}],
 	data() {
 		return {
 			options: {},
-			files: null,
-			user: null,
 		};
 	},
-	async asyncData({ $axios, route }) {
-		try {
-			const response = await $axios.$get(`/admin/users/${route.params.id}`);
-			return {
-				files: response.files ? response.files : null,
-				user: response.user ? response.user : null,
-			};
-		} catch (error) {
-			console.error(error);
-			return {
-				files: null,
-				user: null,
-			};
-		}
-	},
+	computed: mapState({
+		user: (state) => state.admin.user,
+	}),
 	methods: {
 		promptDisableUser() {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
-				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
+				message: 'Are you sure you want to disable the account of this user?',
 				onConfirm: () => this.disableUser(),
 			});
 		},
-		async disableUser() {
-			const response = await this.$axios.$post('admin/users/disable', {
-				id: this.user.id,
+		promptEnableUser() {
+			this.$buefy.dialog.confirm({
+				type: 'is-danger',
+				message: 'Are you sure you want to enable the account of this user?',
+				onConfirm: () => this.enableUser(),
 			});
-			this.$buefy.toast.open(response.message);
+		},
+		disableUser() {
+			this.$handler.executeAction('admin/disableUser', this.user.id);
+		},
+		enableUser() {
+			this.$handler.executeAction('admin/enableUser', this.user.id);
 		},
 	},
 };
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index 269946c..bed4c2b 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -13,7 +13,7 @@
 
 					<div class="view-container">
 						<b-table
-							:data="users || []"
+							:data="users"
 							:mobile-cards="true">
 							<template slot-scope="props">
 								<b-table-column
@@ -37,7 +37,7 @@
 									label="Enabled"
 									centered>
 									<b-switch
-										v-model="props.row.enabled"
+										:value="props.row.enabled"
 										@input="changeEnabledStatus(props.row)" />
 								</b-table-column>
 
@@ -46,18 +46,18 @@
 									label="Admin"
 									centered>
 									<b-switch
-										v-model="props.row.isAdmin"
+										:value="props.row.isAdmin"
 										@input="changeIsAdmin(props.row)" />
 								</b-table-column>
 
 								<b-table-column
 									field="purge"
 									centered>
-									<button
-										class="button is-primary"
+									<b-button
+										type="is-danger"
 										@click="promptPurgeFiles(props.row)">
 										Purge files
-									</button>
+									</b-button>
 								</b-table-column>
 							</template>
 							<template slot="empty">
@@ -82,45 +82,42 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
 		Sidebar,
 	},
-	middleware: ['auth', 'admin'],
-	data() {
-		return {
-			users: [],
-		};
-	},
-	computed: {
-		config() {
-			return this.$store.state.config;
-		},
-	},
+	middleware: ['auth', 'admin', ({ route, store }) => {
+		try {
+			store.dispatch('admin/fetchUsers', route.params.id);
+		} catch (e) {
+			// eslint-disable-next-line no-console
+			console.error(e);
+		}
+	}],
+	computed: mapState({
+		users: (state) => state.admin.users,
+		config: (state) => state.config,
+	}),
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
-	mounted() {
-		this.getUsers();
-	},
 	methods: {
-		async getUsers() {
-			const response = await this.$axios.$get('admin/users');
-			this.users = response.users;
-		},
 		async changeEnabledStatus(row) {
-			const response = await this.$axios.$post(`admin/users/${row.enabled ? 'enable' : 'disable'}`, {
-				id: row.id,
-			});
-			this.$buefy.toast.open(response.message);
+			if (row.enabled) {
+				this.$handler.executeAction('admin/disableUser', row.id);
+			} else {
+				this.$handler.executeAction('admin/enableUser', row.id);
+			}
 		},
 		async changeIsAdmin(row) {
-			const response = await this.$axios.$post(`admin/users/${row.isAdmin ? 'promote' : 'demote'}`, {
-				id: row.id,
-			});
-			this.$buefy.toast.open(response.message);
+			if (row.isAdmin) {
+				this.$handler.executeAction('admin/demoteUser', row.id);
+			} else {
+				this.$handler.executeAction('admin/promoteUser', row.id);
+			}
 		},
 		promptPurgeFiles(row) {
 			this.$buefy.dialog.confirm({
@@ -129,10 +126,7 @@ export default {
 			});
 		},
 		async purgeFiles(row) {
-			const response = await this.$axios.$post('admin/users/purge', {
-				id: row.id,
-			});
-			this.$buefy.toast.open(response.message);
+			this.$handler.executeAction('admin/purgeUserFiles', row.id);
 		},
 	},
 };
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index b25762e..a909e75 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -30,11 +30,9 @@
 										placeholder="Search"
 										type="search" />
 									<p class="control">
-										<button
-											outlined
-											class="button is-primary">
+										<b-button type="is-lolisafe">
 											Search
-										</button>
+										</b-button>
 									</p>
 								</b-field>
 							</div>
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 2f06c7e..08c5166 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -21,11 +21,9 @@
 										placeholder="Search"
 										type="search" />
 									<p class="control">
-										<button
-											outlined
-											class="button is-primary">
+										<b-button type="is-lolisafe">
 											Search
-										</button>
+										</b-button>
 									</p>
 								</b-field>
 							</div>
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 10193a8..a9c5756 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -144,11 +144,11 @@
 								type="text"
 								@keyup.enter.native="createTag" />
 							<p class="control">
-								<button
-									class="button is-primary"
+								<b-button
+									type="is-lolisafe"
 									@click="createTag">
 									Create tags
-								</button>
+								</b-button>
 							</p>
 						</b-field>
 					</div>
-- 
cgit v1.2.3


From 0f66d807035d3e32a66c7dc9bf55fb3be99aedac Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Fri, 10 Jul 2020 01:13:51 +0300
Subject: refactor: finish refactoring all the components to use vuex

---
 src/site/pages/dashboard/admin/file/_id.vue | 85 ++++++++++++-----------------
 src/site/pages/dashboard/admin/settings.vue | 50 ++++++++---------
 2 files changed, 58 insertions(+), 77 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index 34fcd01..89afa47 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -19,99 +19,101 @@
 							<b-field
 								label="ID"
 								horizontal>
-								<span>{{ file.id }}</span>
+								<span>{{ admin.file.id }}</span>
 							</b-field>
 
 							<b-field
 								label="Name"
 								horizontal>
-								<span>{{ file.name }}</span>
+								<span>{{ admin.file.name }}</span>
 							</b-field>
 
 							<b-field
 								label="Original Name"
 								horizontal>
-								<span>{{ file.original }}</span>
+								<span>{{ admin.file.original }}</span>
 							</b-field>
 
 							<b-field
 								label="IP"
 								horizontal>
-								<span class="underline">{{ file.ip }}</span>
+								<span class="underline">{{ admin.file.ip }}</span>
 							</b-field>
 
 							<b-field
 								label="Link"
 								horizontal>
 								<a
-									:href="file.url"
-									target="_blank">{{ file.url }}</a>
+									:href="admin.file.url"
+									target="_blank">{{ admin.file.url }}</a>
 							</b-field>
 
 							<b-field
 								label="Size"
 								horizontal>
-								<span>{{ formatBytes(file.size) }}</span>
+								<span>{{ formatBytes(admin.file.size) }}</span>
 							</b-field>
 
 							<b-field
 								label="Hash"
 								horizontal>
-								<span>{{ file.hash }}</span>
+								<span>{{ admin.file.hash }}</span>
 							</b-field>
 
 							<b-field
 								label="Uploaded"
 								horizontal>
-								<span><timeago :since="file.createdAt" /></span>
+								<span><timeago :since="admin.file.createdAt" /></span>
 							</b-field>
 						</div>
 						<div class="column is-6">
 							<b-field
 								label="User Id"
 								horizontal>
-								<span>{{ user.id }}</span>
+								<span>{{ admin.user.id }}</span>
 							</b-field>
 
 							<b-field
 								label="Username"
 								horizontal>
-								<span>{{ user.username }}</span>
+								<span>{{ admin.user.username }}</span>
 							</b-field>
 
 							<b-field
 								label="Enabled"
 								horizontal>
-								<span>{{ user.enabled }}</span>
+								<span>{{ admin.user.enabled }}</span>
 							</b-field>
 
 							<b-field
 								label="Registered"
 								horizontal>
-								<span><timeago :since="user.createdAt" /></span>
+								<span><timeago :since="admin.user.createdAt" /></span>
 							</b-field>
 
 							<b-field
 								label="Files"
 								horizontal>
 								<span>
-									<nuxt-link :to="`/dashboard/admin/user/${user.id}`">{{ user.fileCount }}</nuxt-link>
+									<nuxt-link :to="`/dashboard/admin/user/${admin.user.id}`">{{ admin.user.fileCount }}</nuxt-link>
 								</span>
 							</b-field>
 						</div>
 					</div>
 
 					<div class="mb2 mt2 text-center">
-						<button
-							class="button is-danger"
+						<b-button
+							v-if="admin.user.id !== auth.user.id"
+							type="is-danger"
 							@click="promptBanIP">
 							Ban IP
-						</button>
-						<button
-							class="button is-danger"
+						</b-button>
+						<b-button
+							v-if="admin.user.id !== auth.user.id"
+							type="is-danger"
 							@click="promptDisableUser">
 							Disable user
-						</button>
+						</b-button>
 					</div>
 				</div>
 			</div>
@@ -120,35 +122,22 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
 		Sidebar,
 	},
-	middleware: ['auth', 'admin'],
-	data() {
-		return {
-			options: {},
-			file: null,
-			user: null,
-		};
-	},
-	async asyncData({ $axios, route }) {
+	middleware: ['auth', 'admin', ({ route, store }) => {
 		try {
-			const response = await $axios.$get(`file/${route.params.id}`);
-			return {
-				file: response.file ? response.file : null,
-				user: response.user ? response.user : null,
-			};
-		} catch (error) {
-			console.error(error);
-			return {
-				file: null,
-				user: null,
-			};
+			store.dispatch('admin/fetchFile', route.params.id);
+		} catch (e) {
+			// eslint-disable-next-line no-console
+			console.error(e);
 		}
-	},
+	}],
+	computed: mapState(['admin', 'auth']),
 	methods: {
 		promptDisableUser() {
 			this.$buefy.dialog.confirm({
@@ -157,11 +146,8 @@ export default {
 				onConfirm: () => this.disableUser(),
 			});
 		},
-		async disableUser() {
-			const response = await this.$axios.$post('admin/users/disable', {
-				id: this.user.id,
-			});
-			this.$buefy.toast.open(response.message);
+		disableUser() {
+			this.$handler.executeAction('admin/disableUser', this.user.id);
 		},
 		promptBanIP() {
 			this.$buefy.dialog.confirm({
@@ -170,11 +156,8 @@ export default {
 				onConfirm: () => this.banIP(),
 			});
 		},
-		async banIP() {
-			const response = await this.$axios.$post('admin/ban/ip', {
-				ip: this.file.ip,
-			});
-			this.$buefy.toast.open(response.message);
+		banIP() {
+			this.$handler.executeAction('admin/banIP', this.file.ip);
 		},
 		formatBytes(bytes, decimals = 2) {
 			if (bytes === 0) return '0 Bytes';
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 9e63a7c..7f6a0fe 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -16,7 +16,7 @@
 						message="Please enter the name which this service is gonna be identified as"
 						horizontal>
 						<b-input
-							v-model="options.serviceName"
+							v-model="settings.serviceName"
 							expanded />
 					</b-field>
 
@@ -25,7 +25,7 @@
 						message="Where to store the files relative to the working directory"
 						horizontal>
 						<b-input
-							v-model="options.uploadFolder"
+							v-model="settings.uploadFolder"
 							expanded />
 					</b-field>
 
@@ -34,7 +34,7 @@
 						message="Maximum links allowed per album"
 						horizontal>
 						<b-input
-							v-model="options.linksPerAlbum"
+							v-model="settings.linksPerAlbum"
 							type="number"
 							expanded />
 					</b-field>
@@ -44,7 +44,7 @@
 						message="Maximum allowed file size in MB"
 						horizontal>
 						<b-input
-							v-model="options.maxUploadSize"
+							v-model="settings.maxUploadSize"
 							expanded />
 					</b-field>
 
@@ -53,7 +53,7 @@
 						message="How many characters long should the generated filenames be"
 						horizontal>
 						<b-input
-							v-model="options.filenameLength"
+							v-model="settings.filenameLength"
 							expanded />
 					</b-field>
 
@@ -62,7 +62,7 @@
 						message="How many characters a link for an album should have"
 						horizontal>
 						<b-input
-							v-model="options.albumLinkLength"
+							v-model="settings.albumLinkLength"
 							expanded />
 					</b-field>
 
@@ -71,7 +71,7 @@
 						message="Generate thumbnails when uploading a file if possible"
 						horizontal>
 						<b-switch
-							v-model="options.generateThumbnails"
+							v-model="settings.generateThumbnails"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
@@ -81,7 +81,7 @@
 						message="Allow generating zips to download entire albums"
 						horizontal>
 						<b-switch
-							v-model="options.generateZips"
+							v-model="settings.generateZips"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
@@ -91,7 +91,7 @@
 						message="Enable anonymous uploades"
 						horizontal>
 						<b-switch
-							v-model="options.publicMode"
+							v-model="settings.publicMode"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
@@ -101,7 +101,7 @@
 						message="Enable creating new accounts in the platform"
 						horizontal>
 						<b-switch
-							v-model="options.enableAccounts"
+							v-model="settings.enableAccounts"
 							:true-value="true"
 							:false-value="false" />
 					</b-field>
@@ -120,38 +120,36 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
 		Sidebar,
 	},
-	middleware: ['auth', 'admin'],
-	data() {
-		return {
-			options: {},
-		};
-	},
+	middleware: ['auth', 'admin', ({ store }) => {
+		try {
+			store.dispatch('admin/fetchSettings');
+		} catch (e) {
+			// eslint-disable-next-line no-console
+			console.error(e);
+		}
+	}],
 	metaInfo() {
 		return { title: 'Settings' };
 	},
-	mounted() {
-		this.getSettings();
-	},
+	computed: mapState({
+		settings: (state) => state.admin.settings,
+	}),
 	methods: {
-		async getSettings() {
-			const response = await this.$axios.$get('service/config');
-			this.options = response.config;
-		},
 		promptRestartService() {
 			this.$buefy.dialog.confirm({
 				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
 				onConfirm: () => this.restartService(),
 			});
 		},
-		async restartService() {
-			const response = await this.$axios.$post('service/restart');
-			this.$buefy.toast.open(response.message);
+		restartService() {
+			this.$handler.executeAction('admin/restartService');
 		},
 	},
 };
-- 
cgit v1.2.3


From b49017aafd8dd3206dc7f490f54e31474527e5b7 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Sun, 19 Jul 2020 22:26:55 +0300
Subject: chore: add custom class to inputs until fix is released on buefy's
 master

---
 src/site/pages/dashboard/account.vue        | 5 +++++
 src/site/pages/dashboard/admin/settings.vue | 6 ++++++
 src/site/pages/dashboard/albums/_id.vue     | 3 ++-
 src/site/pages/dashboard/albums/index.vue   | 1 +
 src/site/pages/dashboard/index.vue          | 3 ++-
 src/site/pages/dashboard/tags/index.vue     | 1 +
 6 files changed, 17 insertions(+), 2 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 31ec8af..5d2f064 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -16,6 +16,7 @@
 						message="Nothing to do here"
 						horizontal>
 						<b-input
+							class="lolisafe-input"
 							:value="user.username"
 							expanded
 							disabled />
@@ -27,6 +28,7 @@
 						horizontal>
 						<b-input
 							v-model="password"
+							class="lolisafe-input"
 							type="password"
 							expanded />
 					</b-field>
@@ -37,6 +39,7 @@
 						horizontal>
 						<b-input
 							v-model="newPassword"
+							class="lolisafe-input"
 							type="password"
 							expanded />
 					</b-field>
@@ -47,6 +50,7 @@
 						horizontal>
 						<b-input
 							v-model="reNewPassword"
+							class="lolisafe-input"
 							type="password"
 							expanded />
 					</b-field>
@@ -65,6 +69,7 @@
 						horizontal>
 						<b-field expanded>
 							<b-input
+								class="lolisafe-input"
 								:value="apiKey"
 								expanded
 								disabled />
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 7f6a0fe..56331b5 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -17,6 +17,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.serviceName"
+							class="lolisafe-input"
 							expanded />
 					</b-field>
 
@@ -26,6 +27,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.uploadFolder"
+							class="lolisafe-input"
 							expanded />
 					</b-field>
 
@@ -35,6 +37,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.linksPerAlbum"
+							class="lolisafe-input"
 							type="number"
 							expanded />
 					</b-field>
@@ -45,6 +48,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.maxUploadSize"
+							class="lolisafe-input"
 							expanded />
 					</b-field>
 
@@ -54,6 +58,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.filenameLength"
+							class="lolisafe-input"
 							expanded />
 					</b-field>
 
@@ -63,6 +68,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.albumLinkLength"
+							class="lolisafe-input"
 							expanded />
 					</b-field>
 
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index a909e75..a4aa440 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -14,7 +14,7 @@
 						<div class="level-left">
 							<div class="level-item">
 								<h1 class="title is-3">
-									{{ images.name }}
+									{{ images.albumName }}
 								</h1>
 							</div>
 							<div class="level-item">
@@ -27,6 +27,7 @@
 							<div class="level-item">
 								<b-field>
 									<b-input
+										class="lolisafe-input"
 										placeholder="Search"
 										type="search" />
 									<p class="control">
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index a2ba522..c5acb2e 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -16,6 +16,7 @@
 							<b-field>
 								<b-input
 									v-model="newAlbumName"
+									class="lolisafe-input"
 									placeholder="Album name..."
 									type="text"
 									@keyup.enter.native="createAlbum" />
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 08c5166..d623b5c 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -1,7 +1,7 @@
 <template>
 	<section class="section is-fullheight dashboard">
 		<div class="container">
-			<div class="columns is-variable is-0-mobile">
+			<div class="columns ">
 				<div class="column is-narrow">
 					<Sidebar />
 				</div>
@@ -18,6 +18,7 @@
 							<div class="level-item">
 								<b-field>
 									<b-input
+										class="lolisafe-input"
 										placeholder="Search"
 										type="search" />
 									<p class="control">
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index a9c5756..fe92087 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -140,6 +140,7 @@
 						<b-field>
 							<b-input
 								v-model="newTagName"
+								class="lolisafe-input"
 								placeholder="Tag name..."
 								type="text"
 								@keyup.enter.native="createTag" />
-- 
cgit v1.2.3


From 279234a081e5ea772978732ae5d2e45d8adcd741 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Wed, 22 Jul 2020 02:14:06 +0300
Subject: feat: add new search input

For now, it clones the autocomplete from buefy, untill a PR or resolution to the opened issue about not being able to manipulate how the suggestions are applied is found
---
 src/site/pages/dashboard/index.vue | 21 ++++++++++-----------
 1 file changed, 10 insertions(+), 11 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index d623b5c..cfd68ba 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -16,17 +16,7 @@
 						</div>
 						<div class="level-right">
 							<div class="level-item">
-								<b-field>
-									<b-input
-										class="lolisafe-input"
-										placeholder="Search"
-										type="search" />
-									<p class="control">
-										<b-button type="is-lolisafe">
-											Search
-										</b-button>
-									</p>
-								</b-field>
+								<Search @search="onSearch" />
 							</div>
 						</div>
 					</nav>
@@ -68,11 +58,13 @@ import { mapState, mapGetters, mapActions } from 'vuex';
 
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import Grid from '~/components/grid/Grid.vue';
+import Search from '~/components/search/Search.vue';
 
 export default {
 	components: {
 		Sidebar,
 		Grid,
+		Search,
 	},
 	middleware: ['auth', ({ store }) => {
 		store.commit('images/resetState');
@@ -82,6 +74,7 @@ export default {
 		return {
 			current: 1,
 			isLoading: false,
+			search: '',
 		};
 	},
 	computed: {
@@ -98,6 +91,9 @@ export default {
 	watch: {
 		current: 'fetchPaginate',
 	},
+	created() {
+		this.filteredHints = this.hints; // fixes the issue where on pageload, suggestions wont load
+	},
 	methods: {
 		...mapActions({
 			fetch: 'images/fetch',
@@ -107,6 +103,9 @@ export default {
 			await this.fetch(this.current);
 			this.isLoading = false;
 		},
+		onSearch(query) {
+			this.searc = query;
+		},
 	},
 };
 </script>
-- 
cgit v1.2.3


From 39e9941ded8de4e41048781daa80de0838c01c19 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 23 Jul 2020 04:08:31 +0300
Subject: feat: Add hiding to recommendations as a prop

fix: change some of the regexes to remove , and ; as separator support because the query parser doesn't understad them and I don't feel like dealing with all the edge cases introduces by it
---
 src/site/pages/dashboard/albums/_id.vue | 21 +++++++++------------
 src/site/pages/dashboard/index.vue      | 10 +++++++++-
 2 files changed, 18 insertions(+), 13 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index a4aa440..7e96b33 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -25,17 +25,7 @@
 						</div>
 						<div class="level-right">
 							<div class="level-item">
-								<b-field>
-									<b-input
-										class="lolisafe-input"
-										placeholder="Search"
-										type="search" />
-									<p class="control">
-										<b-button type="is-lolisafe">
-											Search
-										</b-button>
-									</p>
-								</b-field>
+								<Search :hidden-hints="['album']" />
 							</div>
 						</div>
 					</nav>
@@ -43,7 +33,8 @@
 					<hr>
 
 					<Grid
-						v-if="totalFiles"
+						v-if="
+							totalFiles"
 						:files="images.files"
 						:total="totalFiles">
 						<template v-slot:pagination>
@@ -64,8 +55,12 @@
 								aria-current-label="Current page" />
 						</template>
 					</Grid>
+					</search>
 				</div>
 			</div>
+			</nav>
+		</div>
+		</div>
 		</div>
 	</section>
 </template>
@@ -75,11 +70,13 @@ import { mapState, mapGetters, mapActions } from 'vuex';
 
 import Sidebar from '~/components/sidebar/Sidebar.vue';
 import Grid from '~/components/grid/Grid.vue';
+import Search from '~/components/search/Search.vue';
 
 export default {
 	components: {
 		Sidebar,
 		Grid,
+		Search,
 	},
 	middleware: ['auth', ({ route, store }) => {
 		store.commit('images/resetState');
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index cfd68ba..096f4e3 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -103,8 +103,16 @@ export default {
 			await this.fetch(this.current);
 			this.isLoading = false;
 		},
+		sanitizeQuery(qry) {
+			// remove spaces between a search type selector `album:`
+			// and the value (ex `tag: 123` -> `tag:123`)
+			return (qry || '').replace(/(\w+):\s+/gi, '$1:');
+		},
 		onSearch(query) {
-			this.searc = query;
+			this.search = query;
+			this.$handler.executeAction('images/search', {
+				q: this.sanitizeQuery(query),
+			});
 		},
 	},
 };
-- 
cgit v1.2.3


From c88d08330f239a897e9f24cb32b25759680619b8 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 23 Jul 2020 04:09:01 +0300
Subject: feat: add experimental query to sql generator for searching

---
 src/site/pages/dashboard/albums/_id.vue | 4 ----
 1 file changed, 4 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 7e96b33..0b67ec3 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -55,12 +55,8 @@
 								aria-current-label="Current page" />
 						</template>
 					</Grid>
-					</search>
 				</div>
 			</div>
-			</nav>
-		</div>
-		</div>
 		</div>
 	</section>
 </template>
-- 
cgit v1.2.3


From 4a3fef2b9931266d40c1d9e88748fd2aa623dc79 Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 12 Nov 2020 22:58:34 +0200
Subject: chore: update buefy to 0.9

---
 src/site/pages/dashboard/admin/users.vue | 94 +++++++++++++++++---------------
 1 file changed, 49 insertions(+), 45 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index bed4c2b..60d030a 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -15,51 +15,55 @@
 						<b-table
 							:data="users"
 							:mobile-cards="true">
-							<template slot-scope="props">
-								<b-table-column
-									field="id"
-									label="Id"
-									centered>
-									{{ props.row.id }}
-								</b-table-column>
-
-								<b-table-column
-									field="username"
-									label="Username"
-									centered>
-									<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">
-										{{ props.row.username }}
-									</nuxt-link>
-								</b-table-column>
-
-								<b-table-column
-									field="enabled"
-									label="Enabled"
-									centered>
-									<b-switch
-										:value="props.row.enabled"
-										@input="changeEnabledStatus(props.row)" />
-								</b-table-column>
-
-								<b-table-column
-									field="isAdmin"
-									label="Admin"
-									centered>
-									<b-switch
-										:value="props.row.isAdmin"
-										@input="changeIsAdmin(props.row)" />
-								</b-table-column>
-
-								<b-table-column
-									field="purge"
-									centered>
-									<b-button
-										type="is-danger"
-										@click="promptPurgeFiles(props.row)">
-										Purge files
-									</b-button>
-								</b-table-column>
-							</template>
+							<b-table-column
+								v-slot="props"
+								field="id"
+								label="Id"
+								centered>
+								{{ props.row.id }}
+							</b-table-column>
+
+							<b-table-column
+								v-slot="props"
+								field="username"
+								label="Username"
+								centered>
+								<nuxt-link :to="`/dashboard/admin/user/${props.row.id}`">
+									{{ props.row.username }}
+								</nuxt-link>
+							</b-table-column>
+
+							<b-table-column
+								v-slot="props"
+								field="enabled"
+								label="Enabled"
+								centered>
+								<b-switch
+									:value="props.row.enabled"
+									@input="changeEnabledStatus(props.row)" />
+							</b-table-column>
+
+							<b-table-column
+								v-slot="props"
+								field="isAdmin"
+								label="Admin"
+								centered>
+								<b-switch
+									:value="props.row.isAdmin"
+									@input="changeIsAdmin(props.row)" />
+							</b-table-column>
+
+							<b-table-column
+								v-slot="props"
+								field="purge"
+								centered>
+								<b-button
+									type="is-danger"
+									@click="promptPurgeFiles(props.row)">
+									Purge files
+								</b-button>
+							</b-table-column>
+
 							<template slot="empty">
 								<div class="has-text-centered">
 									<i class="icon-misc-mood-sad" />
-- 
cgit v1.2.3


From 90001c2df56d58e69fd199a518ae7f3e4ed327fc Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 24 Dec 2020 10:40:50 +0200
Subject: chore: remove trailing commas

---
 src/site/pages/dashboard/account.vue        | 22 +++++++++++-----------
 src/site/pages/dashboard/admin/file/_id.vue | 10 +++++-----
 src/site/pages/dashboard/admin/settings.vue | 10 +++++-----
 src/site/pages/dashboard/admin/user/_id.vue | 14 +++++++-------
 src/site/pages/dashboard/admin/users.vue    | 10 +++++-----
 src/site/pages/dashboard/albums/_id.vue     | 16 ++++++++--------
 src/site/pages/dashboard/albums/index.vue   | 10 +++++-----
 src/site/pages/dashboard/index.vue          | 18 +++++++++---------
 src/site/pages/dashboard/tags/index.vue     | 14 +++++++-------
 9 files changed, 62 insertions(+), 62 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 5d2f064..5610495 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -102,7 +102,7 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar,
+		Sidebar
 	},
 	middleware: ['auth', ({ store }) => {
 		store.dispatch('auth/fetchCurrentUser');
@@ -111,21 +111,21 @@ export default {
 		return {
 			password: '',
 			newPassword: '',
-			reNewPassword: '',
+			reNewPassword: ''
 		};
 	},
 	computed: {
 		...mapGetters({ 'apiKey': 'auth/getApiKey' }),
 		...mapState({
-			user: (state) => state.auth.user,
-		}),
+			user: (state) => state.auth.user
+		})
 	},
 	metaInfo() {
 		return { title: 'Account' };
 	},
 	methods: {
 		...mapActions({
-			getUserSetttings: 'auth/fetchCurrentUser',
+			getUserSetttings: 'auth/fetchCurrentUser'
 		}),
 		async changePassword() {
 			const { password, newPassword, reNewPassword } = this;
@@ -133,21 +133,21 @@ export default {
 			if (!password || !newPassword || !reNewPassword) {
 				this.$store.dispatch('alert/set', {
 					text: 'One or more fields are missing',
-					error: true,
+					error: true
 				});
 				return;
 			}
 			if (newPassword !== reNewPassword) {
 				this.$store.dispatch('alert/set', {
 					text: 'Passwords don\'t match',
-					error: true,
+					error: true
 				});
 				return;
 			}
 
 			const response = await this.$store.dispatch('auth/changePassword', {
 				password,
-				newPassword,
+				newPassword
 			});
 
 			if (response) {
@@ -158,7 +158,7 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to regenerate your API key? Previously generated API keys will stop working. Make sure to write the new key down as this is the only time it will be displayed to you.',
-				onConfirm: () => this.requestNewAPIKey(),
+				onConfirm: () => this.requestNewAPIKey()
 			});
 		},
 		copyKey() {
@@ -168,7 +168,7 @@ export default {
 		async requestNewAPIKey() {
 			const response = await this.$store.dispatch('auth/requestAPIKey');
 			this.$buefy.toast.open(response.message);
-		},
-	},
+		}
+	}
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index 89afa47..d54bf54 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -127,7 +127,7 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar,
+		Sidebar
 	},
 	middleware: ['auth', 'admin', ({ route, store }) => {
 		try {
@@ -143,7 +143,7 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of the user that uploaded this file?',
-				onConfirm: () => this.disableUser(),
+				onConfirm: () => this.disableUser()
 			});
 		},
 		disableUser() {
@@ -153,7 +153,7 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to ban the IP this file was uploaded from?',
-				onConfirm: () => this.banIP(),
+				onConfirm: () => this.banIP()
 			});
 		},
 		banIP() {
@@ -169,7 +169,7 @@ export default {
 			const i = Math.floor(Math.log(bytes) / Math.log(k));
 
 			return `${parseFloat((bytes / k ** i).toFixed(dm))} ${sizes[i]}`;
-		},
-	},
+		}
+	}
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 56331b5..c6a9ade 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -131,7 +131,7 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar,
+		Sidebar
 	},
 	middleware: ['auth', 'admin', ({ store }) => {
 		try {
@@ -145,18 +145,18 @@ export default {
 		return { title: 'Settings' };
 	},
 	computed: mapState({
-		settings: (state) => state.admin.settings,
+		settings: (state) => state.admin.settings
 	}),
 	methods: {
 		promptRestartService() {
 			this.$buefy.dialog.confirm({
 				message: 'Keep in mind that restarting only works if you have PM2 or something similar set up. Continue?',
-				onConfirm: () => this.restartService(),
+				onConfirm: () => this.restartService()
 			});
 		},
 		restartService() {
 			this.$handler.executeAction('admin/restartService');
-		},
-	},
+		}
+	}
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 7814468..484d986 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -76,7 +76,7 @@ import Grid from '~/components/grid/Grid.vue';
 export default {
 	components: {
 		Sidebar,
-		Grid,
+		Grid
 	},
 	middleware: ['auth', 'admin', ({ route, store }) => {
 		try {
@@ -88,25 +88,25 @@ export default {
 	}],
 	data() {
 		return {
-			options: {},
+			options: {}
 		};
 	},
 	computed: mapState({
-		user: (state) => state.admin.user,
+		user: (state) => state.admin.user
 	}),
 	methods: {
 		promptDisableUser() {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to disable the account of this user?',
-				onConfirm: () => this.disableUser(),
+				onConfirm: () => this.disableUser()
 			});
 		},
 		promptEnableUser() {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to enable the account of this user?',
-				onConfirm: () => this.enableUser(),
+				onConfirm: () => this.enableUser()
 			});
 		},
 		disableUser() {
@@ -114,7 +114,7 @@ export default {
 		},
 		enableUser() {
 			this.$handler.executeAction('admin/enableUser', this.user.id);
-		},
-	},
+		}
+	}
 };
 </script>
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index 60d030a..a13564c 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -91,7 +91,7 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar,
+		Sidebar
 	},
 	middleware: ['auth', 'admin', ({ route, store }) => {
 		try {
@@ -103,7 +103,7 @@ export default {
 	}],
 	computed: mapState({
 		users: (state) => state.admin.users,
-		config: (state) => state.config,
+		config: (state) => state.config
 	}),
 	metaInfo() {
 		return { title: 'Uploads' };
@@ -126,13 +126,13 @@ export default {
 		promptPurgeFiles(row) {
 			this.$buefy.dialog.confirm({
 				message: 'Are you sure you want to delete this user\'s files?',
-				onConfirm: () => this.purgeFiles(row),
+				onConfirm: () => this.purgeFiles(row)
 			});
 		},
 		async purgeFiles(row) {
 			this.$handler.executeAction('admin/purgeUserFiles', row.id);
-		},
-	},
+		}
+	}
 };
 </script>
 
diff --git a/src/site/pages/dashboard/albums/_id.vue b/src/site/pages/dashboard/albums/_id.vue
index 0b67ec3..cf27a15 100644
--- a/src/site/pages/dashboard/albums/_id.vue
+++ b/src/site/pages/dashboard/albums/_id.vue
@@ -72,7 +72,7 @@ export default {
 	components: {
 		Sidebar,
 		Grid,
-		Search,
+		Search
 	},
 	middleware: ['auth', ({ route, store }) => {
 		store.commit('images/resetState');
@@ -80,34 +80,34 @@ export default {
 	}],
 	data() {
 		return {
-			current: 1,
+			current: 1
 		};
 	},
 	computed: {
 		...mapGetters({
 			totalFiles: 'images/getTotalFiles',
 			shouldPaginate: 'images/shouldPaginate',
-			limit: 'images/getLimit',
+			limit: 'images/getLimit'
 		}),
 		...mapState(['images']),
 		id() {
 			return this.$route.params.id;
-		},
+		}
 	},
 	metaInfo() {
 		return { title: 'Album' };
 	},
 	watch: {
-		current: 'fetchPaginate',
+		current: 'fetchPaginate'
 	},
 	methods: {
 		...mapActions({
-			fetch: 'images/fetchByAlbumId',
+			fetch: 'images/fetchByAlbumId'
 		}),
 		fetchPaginate() {
 			this.fetch({ id: this.id, page: this.current });
-		},
-	},
+		}
+	}
 };
 </script>
 
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index c5acb2e..896d134 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -53,7 +53,7 @@ import AlbumEntry from '~/components/album/AlbumEntry.vue';
 export default {
 	components: {
 		Sidebar,
-		AlbumEntry,
+		AlbumEntry
 	},
 	middleware: ['auth', ({ store }) => {
 		try {
@@ -65,7 +65,7 @@ export default {
 	data() {
 		return {
 			newAlbumName: null,
-			isCreatingAlbum: false,
+			isCreatingAlbum: false
 		};
 	},
 	computed: mapState(['config', 'albums']),
@@ -74,7 +74,7 @@ export default {
 	},
 	methods: {
 		...mapActions({
-			'alert': 'alert/set',
+			'alert': 'alert/set'
 		}),
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
@@ -90,8 +90,8 @@ export default {
 				this.isCreatingAlbum = false;
 				this.newAlbumName = null;
 			}
-		},
-	},
+		}
+	}
 };
 </script>
 
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 096f4e3..f94ca0d 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -64,7 +64,7 @@ export default {
 	components: {
 		Sidebar,
 		Grid,
-		Search,
+		Search
 	},
 	middleware: ['auth', ({ store }) => {
 		store.commit('images/resetState');
@@ -74,29 +74,29 @@ export default {
 		return {
 			current: 1,
 			isLoading: false,
-			search: '',
+			search: ''
 		};
 	},
 	computed: {
 		...mapGetters({
 			totalFiles: 'images/getTotalFiles',
 			shouldPaginate: 'images/shouldPaginate',
-			limit: 'images/getLimit',
+			limit: 'images/getLimit'
 		}),
-		...mapState(['images']),
+		...mapState(['images'])
 	},
 	metaInfo() {
 		return { title: 'Uploads' };
 	},
 	watch: {
-		current: 'fetchPaginate',
+		current: 'fetchPaginate'
 	},
 	created() {
 		this.filteredHints = this.hints; // fixes the issue where on pageload, suggestions wont load
 	},
 	methods: {
 		...mapActions({
-			fetch: 'images/fetch',
+			fetch: 'images/fetch'
 		}),
 		async fetchPaginate() {
 			this.isLoading = true;
@@ -111,10 +111,10 @@ export default {
 		onSearch(query) {
 			this.search = query;
 			this.$handler.executeAction('images/search', {
-				q: this.sanitizeQuery(query),
+				q: this.sanitizeQuery(query)
 			});
-		},
-	},
+		}
+	}
 };
 </script>
 
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index fe92087..dca8304 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -215,19 +215,19 @@ import Sidebar from '~/components/sidebar/Sidebar.vue';
 
 export default {
 	components: {
-		Sidebar,
+		Sidebar
 	},
 	middleware: 'auth',
 	data() {
 		return {
 			tags: [],
-			newTagName: null,
+			newTagName: null
 		};
 	},
 	computed: {
 		config() {
 			return this.$store.state.config;
-		},
+		}
 	},
 	metaInfo() {
 		return { title: 'Tags' };
@@ -240,7 +240,7 @@ export default {
 			this.$buefy.dialog.confirm({
 				type: 'is-danger',
 				message: 'Are you sure you want to delete this tag?',
-				onConfirm: () => this.promptPurgeTag(id),
+				onConfirm: () => this.promptPurgeTag(id)
 			});
 		},
 		promptPurgeTag(id) {
@@ -250,7 +250,7 @@ export default {
 				cancelText: 'No',
 				confirmText: 'Yes',
 				onConfirm: () => this.deleteTag(id, true),
-				onCancel: () => this.deleteTag(id, false),
+				onCancel: () => this.deleteTag(id, false)
 			});
 		},
 		async deleteTag(id, purge) {
@@ -272,7 +272,7 @@ export default {
 				tag.isDetailsOpen = false;
 			}
 			this.tags = response.tags;
-		},
-	},
+		}
+	}
 };
 </script>
-- 
cgit v1.2.3


From 587f7d69e80cfa1d94cc4730dc26834c389f574d Mon Sep 17 00:00:00 2001
From: Zephyrrus <krisztian1997@gmail.com>
Date: Thu, 24 Dec 2020 13:57:09 +0200
Subject: bug: fix showlist resetting itself every time the page is changed
 bug: fix store not commiting search results

---
 src/site/pages/dashboard/index.vue | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index f94ca0d..41605f9 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -108,11 +108,19 @@ export default {
 			// and the value (ex `tag: 123` -> `tag:123`)
 			return (qry || '').replace(/(\w+):\s+/gi, '$1:');
 		},
-		onSearch(query) {
+		async onSearch(query) {
 			this.search = query;
-			this.$handler.executeAction('images/search', {
-				q: this.sanitizeQuery(query)
-			});
+
+			const sanitizedQ = this.sanitizeQuery(query);
+			if (!sanitizedQ.length) {
+				this.current = 1;
+				await this.fetch(this.current);
+			} else {
+				this.$handler.executeAction('images/search', {
+					q: this.sanitizeQuery(query),
+					page: this.current
+				});
+			}
 		}
 	}
 };
-- 
cgit v1.2.3


From fb2c27086f570fec60f4d52dcc9ca80e53186293 Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Thu, 24 Dec 2020 23:45:16 +0900
Subject: Fix ESLint rules once and for all

---
 src/site/pages/dashboard/account.vue        | 4 ++--
 src/site/pages/dashboard/admin/file/_id.vue | 1 +
 src/site/pages/dashboard/admin/settings.vue | 2 +-
 src/site/pages/dashboard/admin/user/_id.vue | 2 +-
 src/site/pages/dashboard/admin/users.vue    | 4 ++--
 src/site/pages/dashboard/albums/index.vue   | 2 +-
 src/site/pages/dashboard/index.vue          | 3 ++-
 7 files changed, 10 insertions(+), 8 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 5610495..8a8249d 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -115,9 +115,9 @@ export default {
 		};
 	},
 	computed: {
-		...mapGetters({ 'apiKey': 'auth/getApiKey' }),
+		...mapGetters({ apiKey: 'auth/getApiKey' }),
 		...mapState({
-			user: (state) => state.auth.user
+			user: state => state.auth.user
 		})
 	},
 	metaInfo() {
diff --git a/src/site/pages/dashboard/admin/file/_id.vue b/src/site/pages/dashboard/admin/file/_id.vue
index d54bf54..135d066 100644
--- a/src/site/pages/dashboard/admin/file/_id.vue
+++ b/src/site/pages/dashboard/admin/file/_id.vue
@@ -168,6 +168,7 @@ export default {
 
 			const i = Math.floor(Math.log(bytes) / Math.log(k));
 
+			// eslint-disable-next-line no-mixed-operators
 			return `${parseFloat((bytes / k ** i).toFixed(dm))} ${sizes[i]}`;
 		}
 	}
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index c6a9ade..0ec235c 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -145,7 +145,7 @@ export default {
 		return { title: 'Settings' };
 	},
 	computed: mapState({
-		settings: (state) => state.admin.settings
+		settings: state => state.admin.settings
 	}),
 	methods: {
 		promptRestartService() {
diff --git a/src/site/pages/dashboard/admin/user/_id.vue b/src/site/pages/dashboard/admin/user/_id.vue
index 484d986..0ed3e86 100644
--- a/src/site/pages/dashboard/admin/user/_id.vue
+++ b/src/site/pages/dashboard/admin/user/_id.vue
@@ -92,7 +92,7 @@ export default {
 		};
 	},
 	computed: mapState({
-		user: (state) => state.admin.user
+		user: state => state.admin.user
 	}),
 	methods: {
 		promptDisableUser() {
diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index a13564c..e52476a 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -102,8 +102,8 @@ export default {
 		}
 	}],
 	computed: mapState({
-		users: (state) => state.admin.users,
-		config: (state) => state.config
+		users: state => state.admin.users,
+		config: state => state.config
 	}),
 	metaInfo() {
 		return { title: 'Uploads' };
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 896d134..4f2f3e1 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -74,7 +74,7 @@ export default {
 	},
 	methods: {
 		...mapActions({
-			'alert': 'alert/set'
+			alert: 'alert/set'
 		}),
 		async createAlbum() {
 			if (!this.newAlbumName || this.newAlbumName === '') return;
diff --git a/src/site/pages/dashboard/index.vue b/src/site/pages/dashboard/index.vue
index 41605f9..0b60cdc 100644
--- a/src/site/pages/dashboard/index.vue
+++ b/src/site/pages/dashboard/index.vue
@@ -27,7 +27,7 @@
 					<Grid
 						v-if="totalFiles && !isLoading"
 						:files="images.files"
-						:enableSearch="false"
+						:enable-search="false"
 						class="grid">
 						<template v-slot:pagination>
 							<b-pagination
@@ -112,6 +112,7 @@ export default {
 			this.search = query;
 
 			const sanitizedQ = this.sanitizeQuery(query);
+			// eslint-disable-next-line no-negated-condition
 			if (!sanitizedQ.length) {
 				this.current = 1;
 				await this.fetch(this.current);
-- 
cgit v1.2.3


From 09d8d02e6c11bb4aea9cd129bf195868bab0738f Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Fri, 25 Dec 2020 02:08:54 +0900
Subject: Cleanup

---
 src/site/pages/dashboard/admin/users.vue | 14 +++-----------
 src/site/pages/dashboard/tags/index.vue  | 14 +++-----------
 2 files changed, 6 insertions(+), 22 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/admin/users.vue b/src/site/pages/dashboard/admin/users.vue
index e52476a..d86bffd 100644
--- a/src/site/pages/dashboard/admin/users.vue
+++ b/src/site/pages/dashboard/admin/users.vue
@@ -164,11 +164,6 @@ export default {
 				width: 1em;
 				z-index: 4;
 				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
 				transition: transform 0.1s linear;
 
 				&.active {
@@ -179,8 +174,7 @@ export default {
 		div.thumb {
 			width: 64px;
 			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
+			box-shadow: $boxShadowLight;
 		}
 
 		div.info {
@@ -237,8 +231,7 @@ export default {
 				padding: 2em 0em;
 
 				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
 				}
 			}
 		}
@@ -248,8 +241,7 @@ export default {
 
 	.b-table {
 		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
+			box-shadow: $boxShadowLight;
 		}
 	}
 </style>
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index dca8304..5835b77 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -26,11 +26,6 @@
 				width: 1em;
 				z-index: 4;
 				top: 22px;
-
-				-webkit-transition: transform 0.1s linear;
-				-moz-transition: transform 0.1s linear;
-				-ms-transition: transform 0.1s linear;
-				-o-transition: transform 0.1s linear;
 				transition: transform 0.1s linear;
 
 				&.active {
@@ -41,8 +36,7 @@
 		div.thumb {
 			width: 64px;
 			height: 64px;
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
+			box-shadow: $boxShadowLight;
 		}
 
 		div.info {
@@ -99,8 +93,7 @@
 				padding: 2em 0em;
 
 				.table-wrapper {
-					-webkit-box-shadow: $boxShadowLight;
-							box-shadow: $boxShadowLight;
+					box-shadow: $boxShadowLight;
 				}
 			}
 		}
@@ -117,8 +110,7 @@
 
 	.b-table {
 		.table-wrapper {
-			-webkit-box-shadow: $boxShadowLight;
-					box-shadow: $boxShadowLight;
+			box-shadow: $boxShadowLight;
 		}
 	}
 </style>
-- 
cgit v1.2.3


From ec2f9e0d989792c1760b48e063467cf6e59c580a Mon Sep 17 00:00:00 2001
From: Pitu <heyitspitu@gmail.com>
Date: Fri, 25 Dec 2020 20:45:22 +0900
Subject: Rebrand

---
 src/site/pages/dashboard/account.vue        | 16 ++++++++--------
 src/site/pages/dashboard/admin/settings.vue | 12 ++++++------
 src/site/pages/dashboard/albums/index.vue   |  2 +-
 src/site/pages/dashboard/tags/index.vue     |  4 ++--
 4 files changed, 17 insertions(+), 17 deletions(-)

(limited to 'src/site/pages/dashboard')

diff --git a/src/site/pages/dashboard/account.vue b/src/site/pages/dashboard/account.vue
index 8a8249d..3a9d37c 100644
--- a/src/site/pages/dashboard/account.vue
+++ b/src/site/pages/dashboard/account.vue
@@ -16,7 +16,7 @@
 						message="Nothing to do here"
 						horizontal>
 						<b-input
-							class="lolisafe-input"
+							class="chibisafe-input"
 							:value="user.username"
 							expanded
 							disabled />
@@ -28,7 +28,7 @@
 						horizontal>
 						<b-input
 							v-model="password"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							type="password"
 							expanded />
 					</b-field>
@@ -39,7 +39,7 @@
 						horizontal>
 						<b-input
 							v-model="newPassword"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							type="password"
 							expanded />
 					</b-field>
@@ -50,14 +50,14 @@
 						horizontal>
 						<b-input
 							v-model="reNewPassword"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							type="password"
 							expanded />
 					</b-field>
 
 					<div class="mb2 mt2 text-center">
 						<b-button
-							type="is-lolisafe"
+							type="is-chibisafe"
 							@click="changePassword">
 							Change password
 						</b-button>
@@ -69,13 +69,13 @@
 						horizontal>
 						<b-field expanded>
 							<b-input
-								class="lolisafe-input"
+								class="chibisafe-input"
 								:value="apiKey"
 								expanded
 								disabled />
 							<p class="control">
 								<b-button
-									type="is-lolisafe"
+									type="is-chibisafe"
 									@click="copyKey">
 									Copy
 								</b-button>
@@ -85,7 +85,7 @@
 
 					<div class="mb2 mt2 text-center">
 						<b-button
-							type="is-lolisafe"
+							type="is-chibisafe"
 							@click="promptNewAPIKey">
 							Request new API key
 						</b-button>
diff --git a/src/site/pages/dashboard/admin/settings.vue b/src/site/pages/dashboard/admin/settings.vue
index 0ec235c..71df2a6 100644
--- a/src/site/pages/dashboard/admin/settings.vue
+++ b/src/site/pages/dashboard/admin/settings.vue
@@ -17,7 +17,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.serviceName"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							expanded />
 					</b-field>
 
@@ -27,7 +27,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.uploadFolder"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							expanded />
 					</b-field>
 
@@ -37,7 +37,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.linksPerAlbum"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							type="number"
 							expanded />
 					</b-field>
@@ -48,7 +48,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.maxUploadSize"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							expanded />
 					</b-field>
 
@@ -58,7 +58,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.filenameLength"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							expanded />
 					</b-field>
 
@@ -68,7 +68,7 @@
 						horizontal>
 						<b-input
 							v-model="settings.albumLinkLength"
-							class="lolisafe-input"
+							class="chibisafe-input"
 							expanded />
 					</b-field>
 
diff --git a/src/site/pages/dashboard/albums/index.vue b/src/site/pages/dashboard/albums/index.vue
index 4f2f3e1..d2b424b 100644
--- a/src/site/pages/dashboard/albums/index.vue
+++ b/src/site/pages/dashboard/albums/index.vue
@@ -16,7 +16,7 @@
 							<b-field>
 								<b-input
 									v-model="newAlbumName"
-									class="lolisafe-input"
+									class="chibisafe-input"
 									placeholder="Album name..."
 									type="text"
 									@keyup.enter.native="createAlbum" />
diff --git a/src/site/pages/dashboard/tags/index.vue b/src/site/pages/dashboard/tags/index.vue
index 5835b77..8790f47 100644
--- a/src/site/pages/dashboard/tags/index.vue
+++ b/src/site/pages/dashboard/tags/index.vue
@@ -132,13 +132,13 @@
 						<b-field>
 							<b-input
 								v-model="newTagName"
-								class="lolisafe-input"
+								class="chibisafe-input"
 								placeholder="Tag name..."
 								type="text"
 								@keyup.enter.native="createTag" />
 							<p class="control">
 								<b-button
-									type="is-lolisafe"
+									type="is-chibisafe"
 									@click="createTag">
 									Create tags
 								</b-button>
-- 
cgit v1.2.3