aboutsummaryrefslogtreecommitdiffstats
path: root/apps
diff options
context:
space:
mode:
Diffstat (limited to 'apps')
-rw-r--r--apps/Notes/components/Export.js58
-rw-r--r--apps/Notes/components/Import.js4
-rw-r--r--apps/Notes/components/List.js12
-rw-r--r--apps/Notes/helpers/import.js2
-rw-r--r--apps/Notes/styles/_export.scss14
-rw-r--r--apps/Notes/styles/_import.scss1
-rw-r--r--apps/Notes/styles/_noteView.scss3
-rw-r--r--apps/Notes/styles/_notesList.scss4
-rw-r--r--apps/Youtube/styles/_results.scss1
9 files changed, 69 insertions, 30 deletions
diff --git a/apps/Notes/components/Export.js b/apps/Notes/components/Export.js
index 4ab1d64..516c0ec 100644
--- a/apps/Notes/components/Export.js
+++ b/apps/Notes/components/Export.js
@@ -3,6 +3,8 @@ import React, { useState } from 'react'
import useSettings from 'hooks/useSettings'
import useNotes from '../hooks/useNotes'
import { handleSelect, handleSelectAll, handleExport } from '../helpers/export'
+import { faCheck, faTimes } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
const Export = ({ setAction }) => {
const { notes } = useNotes()
@@ -29,29 +31,43 @@ const Export = ({ setAction }) => {
/>
<p>{t('notes_to_export')}</p>
<div className={styles.export__select}>
- <input
- type='checkbox'
- name='selectAll'
- onChange={e => handleSelectAll(e, notes, setIds)}
- checked={notes.length === ids.length}
- />
- <label htmlFor='selectAll'>{t('select_all')}</label>
+ <label>
+ <input
+ type='checkbox'
+ name='selectAll'
+ onChange={e => handleSelectAll(e, notes, setIds)}
+ checked={notes.length === ids.length}
+ className='hidden'
+ />
+ <span style={{ color: notes.length === ids.length ? 'green' : 'brown' }}>
+ <FontAwesomeIcon icon={notes.length === ids.length ? faCheck : faTimes} />
+ </span>
+ {t('select_all')}
+ </label>
</div>
<ul>
- {notes.sort(sortFn).map(note => (
- <li key={note.noteId}>
- <input
- type='checkbox'
- name={note.noteId}
- value={note.noteId}
- checked={ids.includes(note.noteId)}
- onChange={() => handleSelect(note.noteId, ids, setIds)}
- />
- <label htlmfor={note.noteId}>
- {note.title}
- </label><br />
- </li>
- ))}
+ {notes.sort(sortFn).map(note => {
+ const checked = ids.includes(note.noteId)
+
+ return (
+ <li key={note.noteId}>
+ <label>
+ <input
+ type='checkbox'
+ name={note.noteId}
+ value={note.noteId}
+ checked={ids.includes(note.noteId)}
+ onChange={() => handleSelect(note.noteId, ids, setIds)}
+ className='hidden'
+ />
+ <span style={{ color: checked ? 'green' : 'brown' }}>
+ <FontAwesomeIcon icon={checked ? faCheck : faTimes} />
+ </span>
+ {note.title}
+ </label>
+ </li>
+ )
+ })}
</ul>
</div>
</section>
diff --git a/apps/Notes/components/Import.js b/apps/Notes/components/Import.js
index 5827310..fa1fa48 100644
--- a/apps/Notes/components/Import.js
+++ b/apps/Notes/components/Import.js
@@ -13,7 +13,9 @@ const Import = ({ setAction }) => {
return (
<section className={styles.import}>
<div className='window__submenu'>
- <div onClick={() => { setAction('') }}>{t('back')}</div>
+ <div>
+ <div onClick={() => { setAction('') }}>{t('back')}</div>
+ </div>
</div>
<div className='window__scroll'>
<form onSubmit={e => handleImport(e, files, mutateNotes, setDone)}>
diff --git a/apps/Notes/components/List.js b/apps/Notes/components/List.js
index 0e6c8fa..7d88c8d 100644
--- a/apps/Notes/components/List.js
+++ b/apps/Notes/components/List.js
@@ -1,4 +1,5 @@
import styles from '../styles/Notes.module.scss'
+import { useRouter } from 'next/router'
import React, { useState, useEffect } from 'react'
import useUser from 'hooks/useUser'
import useSettings from 'hooks/useSettings'
@@ -7,8 +8,9 @@ import useSort from '../hooks/useSort'
import ListItem from './ListItem'
import Actions from './Actions'
import { Splash } from 'components'
+import handleLogout from 'helpers/logout'
-const List = () => {
+const List = ({ logout }) => {
const [fetchedNote, setFetchedNote] = useState()
const [action, setAction] = useState('')
const [loading, setLoading] = useState(false)
@@ -16,7 +18,8 @@ const List = () => {
const { notes, error } = useNotes()
const [sortedBy, sortBy, sortFn] = useSort(3)
const { t } = useSettings()
- const { user } = useUser({
+ const router = useRouter()
+ const { user, mutateUser } = useUser({
redirectToLogin: true,
redirectToVerify: true
})
@@ -41,6 +44,11 @@ const List = () => {
<div className='mobile-only' onClick={() => { setShowSort(s => !s) }}>{t('sort')}</div>
<div onClick={() => setAction('importNotes')}>{t('import')}</div>
<div onClick={() => setAction('exportNotes')}>{t('export')}</div>
+ {logout && (
+ <div onClick={e => handleLogout(e, router, mutateUser)}>
+ {t('logout')}
+ </div>
+ )}
</div>
</div>
<div className='window__scroll'>
diff --git a/apps/Notes/helpers/import.js b/apps/Notes/helpers/import.js
index bbdceaa..01ad00e 100644
--- a/apps/Notes/helpers/import.js
+++ b/apps/Notes/helpers/import.js
@@ -24,7 +24,7 @@ export const handleImport = async (e, files, mutateNotes, setDone) => {
try {
const notes = await fetchJson('/api/notes', {
method: 'POST',
- headers: { 'Content-Type': 'application/json' },
+ headers: { 'Content-Type': 'plain/text; charset=utf-8' },
body: JSON.stringify({ title, content })
})
if (i === files.length - 1) await mutateNotes(notes)
diff --git a/apps/Notes/styles/_export.scss b/apps/Notes/styles/_export.scss
index d5951f3..40aae89 100644
--- a/apps/Notes/styles/_export.scss
+++ b/apps/Notes/styles/_export.scss
@@ -6,6 +6,20 @@
padding-bottom: 1em;
}
+ label {
+ padding-top: .125em;
+ display: flex;
+ line-height: 1.25;
+
+ span {
+ flex-shrink: 0;
+ display: inline-block;
+ width: 1.5em;
+ margin-right: .5em;
+ text-align: center;
+ }
+ }
+
&__select {
display: inline-block;
border-bottom: 1px dashed var(--color-decor);
diff --git a/apps/Notes/styles/_import.scss b/apps/Notes/styles/_import.scss
index 5d167a8..efdd047 100644
--- a/apps/Notes/styles/_import.scss
+++ b/apps/Notes/styles/_import.scss
@@ -4,7 +4,6 @@
to {opacity: 1;}
}
- padding: 1rem;
position: absolute;
top: 0;
right: 0;
diff --git a/apps/Notes/styles/_noteView.scss b/apps/Notes/styles/_noteView.scss
index 63e3fa3..51e7edd 100644
--- a/apps/Notes/styles/_noteView.scss
+++ b/apps/Notes/styles/_noteView.scss
@@ -12,13 +12,14 @@
animation: fade-in .3s;
h2 {
+ padding: .75em;
font-size: 1.25em;
font-weight: 600;
user-select: text;
}
p {
- padding-top: 1em;
+ padding: .75em;
line-height: 1.33;
white-space: pre-line;
user-select: text;
diff --git a/apps/Notes/styles/_notesList.scss b/apps/Notes/styles/_notesList.scss
index 4580d62..57c606a 100644
--- a/apps/Notes/styles/_notesList.scss
+++ b/apps/Notes/styles/_notesList.scss
@@ -5,13 +5,11 @@
}
display: block;
- overflow: auto;
width: 100%;
table-layout: fixed;
word-wrap: break-word;
height: 100%;
- margin-top: -1em;
- padding-top: 1em;
+ padding: .5em;
& > tbody,
& > thead {
diff --git a/apps/Youtube/styles/_results.scss b/apps/Youtube/styles/_results.scss
index 854d1e5..b7d8e9e 100644
--- a/apps/Youtube/styles/_results.scss
+++ b/apps/Youtube/styles/_results.scss
@@ -19,6 +19,7 @@
border: 1px dashed var(--color-window-buttons);
flex-shrink: 1;
flex-grow: 1;
+ width: 1em;
&:placeholder {
font: inherit;