Add authenticating with a link share password

src/store/modules/auth.js

@@ -151,10 +151,11 @@ export default {
 					ctx.commit(LOADING, false, {root: true})
 				})
 		},
-
-		linkShareAuth(ctx, hash) {
+		linkShareAuth(ctx, {hash, password}) {
 			const HTTP = HTTPFactory()
-			return HTTP.post('/shares/' + hash + '/auth')
+			return HTTP.post('/shares/' + hash + '/auth', {
+				password: password,
+			})
 				.then(r => {
 					localStorage.setItem('token', r.data.token)
 					ctx.dispatch('checkAuth')

src/views/sharing/LinkSharingAuth.vue

@@ -1,9 +1,33 @@
 <template>
-	<div class="message is-centered is-info">
-		<div class="message-header">
-			<p class="has-text-centered">
-				Authenticating...
+	<div>
+		<div class="notification is-info is-light has-text-centered" v-if="loading">
+			Authenticating...
+		</div>
+		<div v-if="authenticateWithPassword" class="box">
+			<p class="pb-2">
+				This shared list requires a password. Please enter it below:
 			</p>
+			<div class="field">
+				<div class="control">
+					<input
+						id="linkSharePassword"
+						type="password"
+						class="input"
+						placeholder="e.g. ••••••••••••"
+						v-model="password"
+						v-focus
+						@keyup.enter.prevent="auth"
+					/>
+				</div>
+			</div>
+
+			<x-button @click="auth" :loading="loading">
+				Login
+			</x-button>
+
+			<div class="notification is-danger mt-4" v-if="error !== ''">
+				{{ error }}
+			</div>
 		</div>
 	</div>
 </template>
@@ -16,7 +40,12 @@ export default {
 	name: 'LinkSharingAuth',
 	data() {
 		return {
+			loading: true,
+			authenticateWithPassword: false,
+			error: '',
+
 			hash: '',
+			password: '',
 		}
 	},
 	created() {
@@ -30,17 +59,35 @@ export default {
 	}),
 	methods: {
 		auth() {
+			this.error = ''
+
 			if (this.authLinkShare) {
 				return
 			}
 
-			this.$store.dispatch('auth/linkShareAuth', this.$route.params.share)
+			this.loading = true
+
+			this.$store.dispatch('auth/linkShareAuth', {hash: this.$route.params.share, password: this.password})
 				.then((r) => {
-					console.log('after link share auth')
 					this.$router.push({name: 'list.list', params: {listId: r.list_id}})
 				})
 				.catch(e => {
-					this.error(e, this)
+					if (typeof e.response.data.code !== 'undefined' && e.response.data.code === 13001) {
+						this.authenticateWithPassword = true
+						return
+					}
+
+					let error = 'An error occured.'
+					if (e.response && e.response.data && e.response.data.message) {
+						error = e.response.data.message
+					}
+					if (typeof e.response.data.code !== 'undefined' && e.response.data.code === 13002) {
+						error = 'The password is invalid.'
+					}
+					this.error = error
+				})
+				.finally(() => {
+					this.loading = false
 				})
 		},
 	},