Merge branch 'develop' into popup
# Conflicts: # frontend/svelte/src/routes/+page.svelte
This commit is contained in:
dhain
commit
c85fbe915f
14 changed files with 326 additions and 127 deletions
|
|
@ -1,7 +1,8 @@
|
|||
<script lang="ts">
|
||||
import type {Note} from "../models/types";
|
||||
import {onMount} from "svelte";
|
||||
import {StrapiNoteRepository} from "../models/StrapiNoteRepository";
|
||||
import {StrapiNoteRepository} from "../models/repos/note/StrapiNoteRepository";
|
||||
import {StrapiUserRepo} from "../models/repos/user/StrapiUserRepo";
|
||||
import {Content, Modal, Trigger} from "sv-popup";
|
||||
|
||||
const sleep = (ms) => new Promise(r => setTimeout(r, ms));
|
||||
|
|
@ -9,6 +10,7 @@
|
|||
let notes: Note[];
|
||||
|
||||
onMount(async () => {
|
||||
StrapiUserRepo.getInstance();
|
||||
notes = await noteRepo.getNotes();
|
||||
notes.forEach(note => {
|
||||
note.lastViewed = new Date(note.lastViewed);
|
||||
|
|
@ -84,11 +86,11 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport">
|
||||
<title>PomeloNote | Home</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
|
||||
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
@ -103,8 +105,8 @@
|
|||
|
||||
<div class="row">
|
||||
<div class="offset-md-4 col-md-4">
|
||||
{#if notes?.length > 0}
|
||||
<!-- Notes compact listing -->
|
||||
{#if notes}
|
||||
<!-- Notes listing -->
|
||||
<ul>
|
||||
{#each notes as note}
|
||||
<li on:mouseover={() => handleMouseOverLi(note.id)}
|
||||
|
|
|
|||
|
|
@ -1,20 +1,6 @@
|
|||
import {bearerFetch, jwt} from "../models/PomeloUtils";
|
||||
import {StrapiUserRepo} from "../models/repos/user/StrapiUserRepo";
|
||||
|
||||
/** @type {import('./$types').PageLoad} */
|
||||
export async function load() {
|
||||
let invalid = !jwt;
|
||||
|
||||
if (!invalid) {
|
||||
const request = await bearerFetch("/users/me", jwt);
|
||||
const response = await request.json();
|
||||
|
||||
invalid = "error" in response;
|
||||
}
|
||||
|
||||
if (invalid) {
|
||||
if (typeof window !== 'undefined') {
|
||||
// @ts-ignore
|
||||
window.location = "/login";
|
||||
}
|
||||
}
|
||||
// StrapiUserRepo.getInstance();
|
||||
}
|
||||
|
|
@ -1,24 +1,71 @@
|
|||
<script lang="ts">
|
||||
import type {Note} from "../../models/types";
|
||||
import {StrapiNoteRepository} from "../../models/repos/note/StrapiNoteRepository";
|
||||
import {onMount} from "svelte";
|
||||
|
||||
let notes: Note[] = JSON.parse(window.localStorage.getItem("notes"));
|
||||
const clickedNoteId = window.localStorage.getItem("clickedNoteId");
|
||||
let noteRepo: StrapiNoteRepository;
|
||||
let currentNote: Note;
|
||||
onMount(async () => {
|
||||
noteRepo = StrapiNoteRepository.getInstance();
|
||||
try {
|
||||
currentNote = await noteRepo.getNote(noteRepo.currentNoteId);
|
||||
} catch {
|
||||
returnToListing();
|
||||
}
|
||||
title = (<Note>currentNote).title;
|
||||
content = (<Note>currentNote).content;
|
||||
})
|
||||
|
||||
function save() {
|
||||
noteRepo.updateNote(currentNote.id, {
|
||||
"title": title,
|
||||
"content": content
|
||||
})
|
||||
returnToListing();
|
||||
}
|
||||
|
||||
function returnToListing() {
|
||||
window.location = "/";
|
||||
}
|
||||
|
||||
|
||||
export let title: string, content: string;
|
||||
|
||||
const currNote = notes.find((note)=>{
|
||||
return note.id === parseInt(clickedNoteId);
|
||||
});
|
||||
</script>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{"Pomelonote | Edit " + currNote.title}</title>
|
||||
<title>Editor</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
|
||||
</head>
|
||||
|
||||
<html lang="en">
|
||||
<div class="offset-3 col-6">
|
||||
{currNote.content}
|
||||
<div class="offset-3 col-6 wrapper">
|
||||
<h1 class="">{title}</h1>
|
||||
<input bind:value={title} class="input"> <br />
|
||||
<textarea bind:value={content} class="input textarea"></textarea>
|
||||
<div class="button-container">
|
||||
<button on:click={() => save()} class="btn btn-primary">Save</button>
|
||||
<button on:click={() => returnToListing()} class="btn btn-outline-danger">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
@import "../../customBootstrap.css";
|
||||
.wrapper {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.input {
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
.button-container {
|
||||
float: right;
|
||||
}
|
||||
.textarea {
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<script lang="ts">
|
||||
import {setCookie} from "nookies";
|
||||
import type {Authentication} from "./models/authentication";
|
||||
import { SvelteToast } from '@zerodevx/svelte-toast'
|
||||
import {createErrorToast} from "../../models/customToasts";
|
||||
import {SvelteToast} from '@zerodevx/svelte-toast'
|
||||
import logo from "../../resources/images/logo2.svg";
|
||||
import {handleErrorsFromResponseWithToast} from "../../models/PomeloUtils";
|
||||
import {StrapiUserRepo} from "../../models/repos/user/StrapiUserRepo";
|
||||
|
||||
let user: string;
|
||||
let password: string;
|
||||
|
|
@ -14,31 +14,12 @@
|
|||
* Handles the button click.
|
||||
*/
|
||||
async function handleSubmit() {
|
||||
const endpoint = "http://localhost:1337/api/auth/local";
|
||||
const payload = {
|
||||
identifier: user,
|
||||
password: password
|
||||
};
|
||||
const userRepo: StrapiUserRepo = StrapiUserRepo.getInstance(false);
|
||||
|
||||
const login = await fetch(endpoint, {
|
||||
method: 'post',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
})
|
||||
const response = await userRepo.loginUser(user, password);
|
||||
|
||||
const response: Authentication = await login.json();
|
||||
|
||||
if (response.error != null){
|
||||
if (response.error.details.errors){
|
||||
for (const error of response.error.details.errors) {
|
||||
createErrorToast(error.message);
|
||||
}
|
||||
} else{
|
||||
createErrorToast(response.error.message);
|
||||
}
|
||||
if (response.error != null) {
|
||||
handleErrorsFromResponseWithToast(response);
|
||||
} else {
|
||||
if (rememberMe) {
|
||||
setCookie(null, 'jwt', response.jwt, {
|
||||
|
|
@ -56,34 +37,34 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport">
|
||||
<title>PomeloNote | Login</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
|
||||
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main class="form-signin w-100 m-auto">
|
||||
|
||||
<img class="img-fluid" src="{logo}" alt="Logo">
|
||||
<img alt="Logo" class="img-fluid" src="{logo}">
|
||||
<h1 class="h3 mb-3 fw-normal">Please sign in</h1>
|
||||
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" id="floatingInput" placeholder="name@example.com" bind:value={user}>
|
||||
<input bind:value={user} class="form-control" id="floatingInput" placeholder="name@example.com" type="text">
|
||||
<label for="floatingInput">Email address or username</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" bind:value={password}>
|
||||
<input bind:value={password} class="form-control" id="floatingPassword" placeholder="Password" type="password">
|
||||
<label for="floatingPassword">Password</label>
|
||||
</div>
|
||||
|
||||
<div class="checkbox mb-3">
|
||||
<label>
|
||||
<input type="checkbox" value="rememberMe" bind:checked={rememberMe}> Remember me
|
||||
<input bind:checked={rememberMe} type="checkbox" value="rememberMe"> Remember me
|
||||
</label>
|
||||
</div>
|
||||
<button class="w-100 btn btn-lg btn-primary" on:click={handleSubmit}>Sign in</button>
|
||||
<a href="/register" class="opacity-75 d-flex justify-content-center text-center fs-6">No user yet? Register.</a>
|
||||
<a class="opacity-75 d-flex justify-content-center text-center fs-6" href="/register">No user yet? Register.</a>
|
||||
<p class="mt-5 mb-3 text-muted">©2022</p>
|
||||
|
||||
</main>
|
||||
|
|
@ -94,10 +75,4 @@
|
|||
<style>
|
||||
@import "../../userInput.css";
|
||||
@import "../../customBootstrap.css";
|
||||
|
||||
.form-signin input[type="email"] {
|
||||
margin-bottom: -1px !important;
|
||||
border-bottom-right-radius: 0 !important;
|
||||
border-bottom-left-radius: 0 !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import type {User} from "../../../models/user";
|
||||
|
||||
/**
|
||||
* User Login Auth.
|
||||
*/
|
||||
export interface Authentication {
|
||||
jwt: string;
|
||||
user: User;
|
||||
error: any;
|
||||
}
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
<script lang="ts">
|
||||
import logo from "../../resources/images/logo2.svg";
|
||||
import {SvelteToast} from "@zerodevx/svelte-toast";
|
||||
import type {Authentication} from "../login/models/authentication";
|
||||
import {createErrorToast} from "../../models/customToasts";
|
||||
import {StrapiUserRepo} from "../../models/repos/user/StrapiUserRepo";
|
||||
import {handleErrorsFromResponseWithToast} from "../../models/PomeloUtils";
|
||||
|
||||
let user: string;
|
||||
let password: string;
|
||||
|
|
@ -13,32 +13,12 @@
|
|||
* Handles the button click.
|
||||
*/
|
||||
async function handleSubmit() {
|
||||
const endpoint = "http://localhost:1337/api/auth/local/register";
|
||||
const payload = {
|
||||
email: email,
|
||||
password: password,
|
||||
username: user
|
||||
};
|
||||
const userRepo: StrapiUserRepo = StrapiUserRepo.getInstance(false);
|
||||
|
||||
const login = await fetch(endpoint, {
|
||||
method: 'post',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
})
|
||||
|
||||
const response: Authentication = await login.json();
|
||||
const response = await userRepo.registerUser(email, user, password);
|
||||
|
||||
if (response.error != null) {
|
||||
if (response.error.details.errors) {
|
||||
for (const error of response.error.details.errors) {
|
||||
createErrorToast(error.message);
|
||||
}
|
||||
} else {
|
||||
createErrorToast(response.error.message);
|
||||
}
|
||||
handleErrorsFromResponseWithToast(response);
|
||||
} else {
|
||||
window.location = "/login";
|
||||
}
|
||||
|
|
@ -49,29 +29,29 @@
|
|||
lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport">
|
||||
<title>PomeloNote | Register</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
|
||||
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main class="form-signin w-100 m-auto">
|
||||
|
||||
<img class="img-fluid" src="{logo}" alt="Logo">
|
||||
<img alt="Logo" class="img-fluid" src="{logo}">
|
||||
<h1 class="h3 mb-3 fw-normal">Register a new user</h1>
|
||||
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" id="floatingUsr" placeholder="exampleUsername" bind:value={user}>
|
||||
<input bind:value={user} class="form-control" id="floatingUsr" placeholder="exampleUsername" type="text">
|
||||
<label for="floatingUsr">Username</label>
|
||||
</div>
|
||||
|
||||
<div class="form-floating">
|
||||
<input type="email" class="form-control" id="floatingInput" placeholder="name@example.com" bind:value={email}>
|
||||
<input bind:value={email} class="form-control" id="floatingInput" placeholder="name@example.com" type="email">
|
||||
<label for="floatingInput">Email address</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" bind:value={password}>
|
||||
<input bind:value={password} class="form-control" id="floatingPassword" placeholder="Password" type="password">
|
||||
<label for="floatingPassword">Password</label>
|
||||
</div>
|
||||
|
||||
|
|
@ -79,7 +59,7 @@
|
|||
Register user
|
||||
{#if user}: {user} {/if}
|
||||
</button>
|
||||
<a href="/login" class="opacity-75 d-flex justify-content-center text-center fs-6">Already registered? Login.</a>
|
||||
<a class="opacity-75 d-flex justify-content-center text-center fs-6" href="/login">Already registered? Login.</a>
|
||||
<p class="mt-5 mb-3 text-muted">©2022</p>
|
||||
|
||||
</main>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue