aboutsummaryrefslogtreecommitdiffstats
path: root/frontend/src/main.js
blob: 79ed47e9cf3586ce78a67df42704a4e4f5c94e4d (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import 'regenerator-runtime/runtime';
import axios from 'axios';
import $ from 'jquery';
import cookie from 'js-cookie';

const LOGIN_API_URL = 'http://localhost:4000';
const POSTGREST_API_URL = 'http://localhost:3000';

$('a#logout').click(function(event) {
  event.preventDefault();
  cookie.remove('jwt');
  alert('Logged out.');
});

// fetch data from postgrest
$('button#fetchTodosBtn').click(async function() {
  $('div#todos').html('');
  const jwt = cookie.get('jwt');
  try {
    const resp = await axios.get(`${POSTGREST_API_URL}/todos`, {
      headers: { Authorization: `Bearer ${jwt}` },
    });
    const todos = resp.data;
    if (todos.length === 0) {
      $('div#todos').html('No TODOs.');
    } else {
      todos.forEach(todo => {
        $('div#todos').append(`<div>id: ${todo.id}, task: ${todo.task}</div>`);
      });
    }
  } catch (err) {
    $('div#todos').html(String(err));
    alert(err);
  }
});

$('form#loginForm').submit(async function(event) {
  event.preventDefault();
  const username = $(this).find('input#username').val();
  const password = $(this).find('input#password').val();
  try {
    const resp = await axios.post(`${LOGIN_API_URL}/login`, { username, password });
    const payload = resp.data;
    const jwt = payload.jwt;
    cookie.set('jwt', jwt);
    alert(`Logged in as ${username}.`);
  } catch (err) {
    cookie.remove('jwt');
    alert(err);
  }
});