feat(editor): blocked editor

Novout · Sep 22, 2021 · aa7d1e4 · aa7d1e4
1 parent 9a38f9c
commit aa7d1e4
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 5 deletions.
diff --git a/components.d.ts b/components.d.ts
@@ -13,7 +13,8 @@ declare module 'vue' {
     Disclosure: typeof import('@headlessui/vue')['Disclosure']
     DisclosureButton: typeof import('@headlessui/vue')['DisclosureButton']
     DisclosurePanel: typeof import('@headlessui/vue')['DisclosurePanel']
-    EditorBase: typeof import('E:/dev/projects/write-better/src/components/editor/EditorBase.vue')['default']
+    EditorBase: typeof import('E:/dev/projects/write-better/src/components/editor/main/EditorBase.vue')['default']
+    EditorBaseBlocked: typeof import('E:/dev/projects/write-better/src/components/editor/main/EditorBaseBlocked.vue')['default']
     EditorHeader: typeof import('E:/dev/projects/write-better/src/components/editor/EditorHeader.vue')['default']
     HeroIcon: typeof import('E:/dev/projects/write-better/src/components/utils/HeroIcon.vue')['default']
     LangSwitcher: typeof import('E:/dev/projects/write-better/src/components/utils/LangSwitcher.vue')['default']

diff --git a/src/components/editor/EditorBase.vue → src/components/editor/main/EditorBase.vue b/src/components/editor/EditorBase.vue → src/components/editor/main/EditorBase.vue
@@ -7,6 +7,9 @@
           rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;
       "
     >
+      <EditorBaseBlocked
+        v-if="store.state.project.name === '__NOT_CREATED__'"
+      />
       <section
         id="edit"
         class="flex flex-col w-full overflow-y-auto max-h-editor px-14"
@@ -18,7 +21,11 @@
           :page="page"
         />
       </section>
-      <TextInput v-model="entry" @enter="enterListener" />
+      <TextInput
+        v-if="store.state.project.name !== '__NOT_CREATED__'"
+        v-model="entry"
+        @enter="enterListener"
+      />
     </div>
   </div>
 </template>

diff --git a/src/components/editor/main/EditorBaseBlocked.vue b/src/components/editor/main/EditorBaseBlocked.vue
@@ -0,0 +1,11 @@
+<template>
+  <div class="z-50 flex justify-center items-center w-full h-editor border">
+    <p class="wb-text font-bold">{{ t('editor.aside.project.blocked') }}</p>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { useI18n } from 'vue-i18n'
+
+  const { t } = useI18n()
+</script>
diff --git a/src/lang/br.ts b/src/lang/br.ts
@@ -17,6 +17,7 @@ export default {
       },
       project: {
         title: 'Projeto',
+        blocked: 'Crie ou carregue um projeto!!!',
         new: {
           title: 'Novo Projeto',
           name: 'Nome',

diff --git a/src/lang/en.ts b/src/lang/en.ts
@@ -17,6 +17,7 @@ export default {
       },
       project: {
         title: 'Project',
+        blocked: 'Create or load a project!!!',
         new: {
           title: 'New Project',
           name: 'Name',

diff --git a/src/store/module/project.ts b/src/store/module/project.ts
@@ -1,12 +1,13 @@
 import { ProjectState } from '@/types/project'
 import { useText } from '@/use/text'
+import { version } from 'vue-demi'
 import { useFormat } from '../../use/format'
 
 export default {
   namespaced: true,
   state: () =>
     ({
-      name: 'foo',
+      name: '__NOT_CREATED__',
       version: '0.1.0',
       totalPagesCreated: 0,
       main: {},
@@ -26,14 +27,14 @@ export default {
           {
             id: 0,
             type: 'heading-one',
-            raw: 'Untitled',
+            raw: payload.name,
             createdAt: useFormat().actually(),
             updatedAt: useFormat().actually(),
           },
           {
             id: 1,
             type: 'paragraph',
-            raw: 'Untitled',
+            raw: 'v' + payload.version,
             createdAt: useFormat().actually(),
             updatedAt: useFormat().actually(),
           },