fixes

src/components/Editor/components/Editor.module.scss

@@ -0,0 +1,7 @@
+.error {
+  display: none;
+}
+
+.markdown {
+  white-space: pre-wrap;
+}

src/components/Editor/components/Editor.tsx

@@ -3,18 +3,21 @@ import type { EditorState } from 'prosemirror-state'
 import { useState } from '../store/context'
 import { ProseMirror } from './ProseMirror'
 import '../styles/Editor.scss'
+import styles from './Editor.module.scss'
+import { clsx } from 'clsx'
 
 export const Editor = () => {
   const [store, ctrl] = useState()
   const onInit = (text: EditorState, editorView: EditorView) => ctrl.setState({ editorView, text })
   const onReconfigure = (text: EditorState) => ctrl.setState({ text })
   const onChange = (text: EditorState) => ctrl.setState({ text, lastModified: new Date() })
-  // const editorCss = (config) => css``
+
-  const style = () => (store.error ? `display: none;` : store.markdown ? `white-space: pre-wrap;` : '')
   return (
     <ProseMirror
-      className="editor col-md-6 shift-content"
+      cssClass={clsx('editor', 'col-md-6', 'shift-content', {
-      style={style()}
+        [styles.error]: store.error,
+        [styles.markdown]: store.markdown
+      })}
       editorView={store.editorView}
       text={store.text}
       extensions={store.extensions}

src/components/Editor/components/ProseMirror.tsx

@@ -6,8 +6,7 @@ import { Schema } from 'prosemirror-model'
 import type { NodeViewFn, ProseMirrorExtension, ProseMirrorState } from '../prosemirror/helpers'
 
 interface ProseMirrorProps {
-  style?: string
+  cssClass?: string
-  className?: string
   text?: Store<ProseMirrorState>
   editorView?: Store<EditorView>
   extensions?: Store<ProseMirrorExtension[]>
@@ -60,7 +59,7 @@ export const ProseMirror = (props: ProseMirrorProps) => {
     [props.text, props.extensions]
   )
 
-  return <div style={props.style} ref={editorRef} class={props.className} spell-check={false} />
+  return <div ref={editorRef} class={props.cssClass} spell-check={false} />
 }
 
 const createEditorState = (

src/components/Editor/components/Sidebar.tsx

@@ -34,7 +34,30 @@ export const Sidebar = () => {
     document.body.classList.toggle('dark')
     ctrl.updateConfig({ theme: document.body.className })
   }
-  const collabText = () => (store.collab?.started ? 'Stop' : store.collab?.error ? 'Restart 🚨' : 'Start')
+  const collabText = () => {
+    if (store.collab?.started) {
+      return 'Stop'
+    }
+
+    if (store.collab?.error) {
+      return 'Restart 🚨'
+    }
+
+    return 'Start'
+  }
+
+  const discardText = () => {
+    if (store.path) {
+      return 'Close'
+    }
+
+    if (store.drafts.length > 0 && isEmpty(store.text)) {
+      return 'Delete ⚠️'
+    }
+
+    return 'Clear'
+  }
+
   const editorView = () => unwrap(store.editorView)
   const onToggleMarkdown = () => ctrl.toggleMarkdown()
   const onOpenDraft = (draft: Draft) => ctrl.openDraft(unwrap(draft))
@@ -144,12 +167,7 @@ export const Sidebar = () => {
               disabled={!store.path && store.drafts.length === 0 && isEmpty(store.text)}
               data-testid="discard"
             >
-              {store.path
+              {discardText()} <Keys keys={[mod, 'w']} />
-                ? 'Close'
-                : store.drafts.length > 0 && isEmpty(store.text)
-                ? 'Delete ⚠️'
-                : 'Clear'}{' '}
-              <Keys keys={[mod, 'w']} />
             </Link>
             <Link onClick={onUndo}>
               Undo <Keys keys={[mod, 'z']} />

src/components/Editor/styles/ArticlesList.scss

@@ -10,6 +10,7 @@
 
 .article__title {
   @include font-size(2.4rem);
+
   line-height: 1.25;
 }
 
@@ -31,10 +32,11 @@
 }
 
 .article__controls {
+  @include font-size(1.4rem);
+
   align-content: baseline;
   display: flex;
   flex-wrap: wrap;
-  @include font-size(1.4rem);
   padding-top: 2em;
 }
 

src/components/Editor/styles/Button.scss

@@ -8,14 +8,14 @@ button {
   align-items: center;
   outline: none;
   text-decoration: none;
-  font-family: 'JetBrains Mono';
+  background: none;
+  font-family: Muller, Arial, Helvetica, sans-serif;
+  color: var(--foreground);
+  border: 1px solid var(--foreground);
+
   &:hover {
     opacity: 0.8;
   }
-  background: none;
-  font-family: 'Muller';
-  color: var(--foreground);
-  border: 1px solid var(--foreground);
 }
 
 button.primary {

src/components/Editor/styles/Error.scss

@@ -3,7 +3,6 @@
   overflow: y-auto;
   padding: 50px;
   display: flex;
-  font-family: 'JetBrains Mono';
   justify-content: center;
   ::-webkit-scrollbar {
     display: none;

src/components/Editor/styles/Layout.scss

@@ -1,6 +1,5 @@
 .layout {
   display: flex;
-  font-family: 'Muller';
   font-size: 18px;
   background: var(--background);
   color: var(--foreground);

src/stores/auth.ts

@@ -69,12 +69,6 @@ export const confirmEmail = async (token: string) => {
   setSession(authResult)
 }
 
-export const confirmEmail = async (token: string) => {
-  const authResult = await apiClient.confirmEmail({ token })
-  setToken(authResult.token)
-  setSession(authResult)
-}
-
 export const useAuthStore = () => {
   return { session, emailChecks }
 }