From d1e55b72c20573d3d7878e51fa7ca0a7b6c9fa89 Mon Sep 17 00:00:00 2001 From: Ammar Ahmed <40239442+ammarahm-ed@users.noreply.github.com> Date: Thu, 2 Dec 2021 10:39:06 +0500 Subject: [PATCH] Revert "Feat notebook header" --- apps/mobile/App.js | 1 + .../android/app/src/main/assets/index.css | 67 ++++-- apps/mobile/html/Web.bundle/site/constants.js | 13 +- apps/mobile/html/Web.bundle/site/index.css | 168 ++++++++------ apps/mobile/html/Web.bundle/site/index.html | 12 +- apps/mobile/html/Web.bundle/site/init.js | 207 +++++++++--------- apps/mobile/html/Web.bundle/site/listeners.js | 134 +++++------- .../ActionSheetComponent/BouncingView.js | 9 +- .../src/components/AddNotebookDialog/index.js | 5 - .../components/Announcements/announcement.js | 2 +- .../src/components/Announcements/cta.js | 43 ++-- .../src/components/Announcements/functions.js | 5 +- .../src/components/Announcements/index.js | 13 +- apps/mobile/src/components/AppLoader/index.js | 19 +- .../src/components/Dialog/BaseDialog.js | 3 +- apps/mobile/src/components/Dialog/index.js | 19 +- apps/mobile/src/components/Header/index.js | 3 +- apps/mobile/src/components/Header/title.js | 81 ++----- apps/mobile/src/components/NoteItem/index.js | 99 ++++----- .../src/components/NotebookItem/index.js | 32 +-- .../src/components/Premium/component.js | 36 ++- .../src/components/Premium/pricingplans.js | 168 +++++--------- .../components/SelectionWrapper/backfill.js | 9 +- .../src/components/SelectionWrapper/index.js | 19 +- .../src/components/SimpleList/header.js | 30 ++- .../mobile/src/components/SimpleList/index.js | 29 +-- .../components/SimpleList/notebookheader.js | 147 ------------- apps/mobile/src/provider/stores.ts | 21 +- apps/mobile/src/services/PremiumService.js | 28 +-- apps/mobile/src/utils/database.js | 18 +- apps/mobile/src/utils/useAppEvents.js | 6 +- apps/mobile/src/views/Editor/EditorHeader.js | 34 +-- apps/mobile/src/views/Editor/EditorOverlay.js | 1 + apps/mobile/src/views/Editor/Functions.js | 111 +++++----- apps/mobile/src/views/Editor/tiny/tiny.js | 3 - .../src/views/Editor/tiny/toolbar/config.js | 5 +- apps/mobile/src/views/Notebook/index.js | 20 +- apps/mobile/src/views/Notes/index.js | 10 +- 38 files changed, 670 insertions(+), 960 deletions(-) delete mode 100644 apps/mobile/src/components/SimpleList/notebookheader.js diff --git a/apps/mobile/App.js b/apps/mobile/App.js index eab4d10ea..49d729960 100644 --- a/apps/mobile/App.js +++ b/apps/mobile/App.js @@ -112,6 +112,7 @@ const App = () => { useEffect(() => { databaseHasLoaded = false; + useMessageStore.getState().setAnnouncement(); (async () => { try { await SettingsService.init(); diff --git a/apps/mobile/android/app/src/main/assets/index.css b/apps/mobile/android/app/src/main/assets/index.css index 779b91ce0..8886696f5 100644 --- a/apps/mobile/android/app/src/main/assets/index.css +++ b/apps/mobile/android/app/src/main/assets/index.css @@ -1,22 +1,21 @@ body { margin: 0px !important; - font-family: 'Open Sans'; + font-family:"Open Sans"; } .app-main { overflow: visible; } -#formBox input { - font-family: 'Open Sans'; +#formBox textarea { + font-family: "Open Sans"; font-weight: 600 !important; background-color: transparent; border: none; width: 100%; outline: none; resize: none; - font-size: 25px; - height: 45x; + font-size: 32px; } #formBox { @@ -28,30 +27,47 @@ body { background-color: transparent; padding-left: 12px; padding-right: 12px; + min-height: 45px; display: flex; flex-direction: column; justify-content: flex-end; } #formBox > div, -#formBox > input { +#formBox > textarea { word-wrap: break-word; /* make sure the div and the textarea wrap words in the same way */ box-sizing: border-box; width: 100%; } -#titlebar input:focus { - outline: none; +#formBox > textarea { + overflow: hidden; + position: absolute; + height: 100%; + padding-top: 4px; + padding-bottom: 5px; +} + +#textCopy { + font-family: "Open Sans"; + visibility: hidden; + font-weight: 600 !important; + font-size: 32px; + padding-top: 4px; + padding-bottom: 5px; +} + +#formBox > div { + min-height: 45px; } .info-bar { - font-family: 'Open Sans'; + font-family: "Open Sans"; color: gray; - font-size: 11.5px; - height: 13px; + font-size: 11px; + height: 15px; display: flex; padding-left: 4px !important; justify-content: space-between; - margin-top:5px; } .info-bar a { @@ -59,16 +75,29 @@ body { color: gray; } -#infowords,#infodate,#infosaved { - font-family: 'Open Sans'; +#titlebar textarea:focus { + outline: none; +} +#infowords { + font-family: "Open Sans"; margin-right: 5px; margin-left: 0px; - border-radius: 5px; + border-radius: 5; margin-top: 0; - height:16px; - padding-top:2.5px; } -.visible { - display: inline-flex !important; +#infodate { + font-family: "Open Sans"; + margin-right: 5px; + margin-left: 5px; + margin-top: 0; + border-radius: 5; +} + +#infosaved { + font-family: "Open Sans"; + margin-right: 5px; + margin-left: 5px; + border-radius: 5; + margin-top: 0; } diff --git a/apps/mobile/html/Web.bundle/site/constants.js b/apps/mobile/html/Web.bundle/site/constants.js index d6ac5522e..1e41732cf 100755 --- a/apps/mobile/html/Web.bundle/site/constants.js +++ b/apps/mobile/html/Web.bundle/site/constants.js @@ -126,9 +126,13 @@ function setTheme() { let node = ` #titleInput { color:${pageTheme.colors.heading}; - font-size:${25 * pageTheme.colors.factor}; + font-size:${32 * pageTheme.colors.factor}; } + #textCopy { + color:${pageTheme.colors.pri}; + font-size:${32 * pageTheme.colors.factor}; + } #titleInput::-webkit-input-placeholder { color:${pageTheme.colors.icon} } @@ -136,7 +140,6 @@ function setTheme() { .info-bar { color:${pageTheme.colors.icon}; } - #titlebar { display:flex !important; } @@ -222,6 +225,7 @@ function setTheme() { background: none !important; border-bottom: 1px solid ${pageTheme.colors.nav} !important; }`; + let node2 = ` .mce-content-body table[data-mce-selected], { @@ -338,8 +342,9 @@ code { `; - let editorHead = - tinymce.activeEditor.contentDocument.getElementsByTagName('head')[0]; + let editorHead = tinymce.activeEditor.contentDocument.getElementsByTagName( + 'head' + )[0]; let css2 = document.createElement('style'); css2.appendChild(document.createTextNode(node2)); editorHead.appendChild(css2); diff --git a/apps/mobile/html/Web.bundle/site/index.css b/apps/mobile/html/Web.bundle/site/index.css index 1061feb58..e3be60f8f 100644 --- a/apps/mobile/html/Web.bundle/site/index.css +++ b/apps/mobile/html/Web.bundle/site/index.css @@ -1,76 +1,102 @@ body { - margin: 0px !important; - font-family: 'Open Sans'; + margin:0px !important; + overflow: visible; + font-family:"Open Sans"; } -.app-main { - overflow: visible; -} +#formBox textarea { + font-family: "Open Sans"; + font-weight: 600 !important; + background-color: transparent; + border: none; + width: 100%; + outline: none; + resize: none; + font-size: 32px; + } + + #formBox { + margin-block-end: 0px; + position: relative; + } + + #titlebar { + background-color: transparent; + padding-left: 0px; + padding-right: 12px; + min-height: 45px; + display: flex; + flex-direction: column; + justify-content: flex-end; + } + #formBox > div, + #formBox > textarea { + word-wrap: break-word; /* make sure the div and the textarea wrap words in the same way */ + box-sizing: border-box; + width: 100%; + } + + #formBox > textarea { + overflow: hidden; + position: absolute; + height: 100%; -#formBox input { - font-family: 'Open Sans'; - font-weight: 600 !important; - background-color: transparent; - border: none; - width: 100%; - outline: none; - resize: none; - font-size: 25px; - height: 45x; -} + padding-top: 4px; + padding-bottom: 5px; + } + + #textCopy { + font-family: "Open Sans"; + font-weight: 600 !important; + font-size: 32px; + padding-top: 4px; + padding-bottom: 5px; + padding-right: 0.5em; + padding-left: 0.5em; + } + + #formBox > div { + min-height: 45px; + } + + .info-bar { + font-family: "Open Sans"; + color: gray; + font-size: 11px; + height: 15px; + display: flex; + padding-left: 14px !important; + justify-content: space-between; + } -#formBox { - margin-block-end: 0px; - position: relative; -} - -#titlebar { - background-color: transparent; - padding-left: 0px; - padding-right: 12px; - display: flex; - flex-direction: column; - justify-content: flex-end; -} -#formBox > div, -#formBox > input { - word-wrap: break-word; /* make sure the div and the textarea wrap words in the same way */ - box-sizing: border-box; - width: 100%; -} - -#titlebar input:focus { - outline: none; -} - -.info-bar { - font-family: 'Open Sans'; - color: gray; - font-size: 11.5px; - height: 13px; - display: flex; - padding-left: 4px !important; - justify-content: space-between; - margin-top: 5px; -} - -.info-bar a { - text-decoration: none; - color: gray; -} - -#infowords, -#infodate, -#infosaved { - font-family: 'Open Sans'; - margin-right: 5px; - margin-left: 0px; - border-radius: 5px; - margin-top: 0; - height: 16px; - padding-top: 2.5px; -} - -.visible { - display: inline-flex !important; -} + .info-bar a { + text-decoration: none; + color: gray + } + + #titlebar textarea:focus { + outline: none; + } + #infowords { + font-family: "Open Sans"; + margin-right: 5px; + margin-left: 0px; + border-radius: 5; + margin-top: 0; + } + + #infodate { + font-family: "Open Sans"; + margin-right: 5px; + margin-left: 5px; + margin-top: 0; + border-radius: 5; + } + + #infosaved { + font-family: "Open Sans"; + margin-right: 5px; + margin-left: 5px; + border-radius: 5; + margin-top: 0; + } diff --git a/apps/mobile/html/Web.bundle/site/index.html b/apps/mobile/html/Web.bundle/site/index.html index 436fb719f..16facc194 100644 --- a/apps/mobile/html/Web.bundle/site/index.html +++ b/apps/mobile/html/Web.bundle/site/index.html @@ -14,15 +14,15 @@
-
- -
+
+ +
+

- - +

+

diff --git a/apps/mobile/html/Web.bundle/site/init.js b/apps/mobile/html/Web.bundle/site/init.js index 8a49b3667..a81e7c7a6 100755 --- a/apps/mobile/html/Web.bundle/site/init.js +++ b/apps/mobile/html/Web.bundle/site/init.js @@ -263,109 +263,6 @@ function init_tiny(size) { console.error(e); } }, - init_instance_callback: function (_editor) { - editor = _editor; - setTheme(); - - editor.on('SelectionChange', function (e) { - selectchange(); - }); - - editor.on('ClearUndos', onUndoChange); - editor.on('Undo', onUndoChange); - editor.on('Redo', onUndoChange); - editor.on('TypingUndos', onUndoChange); - editor.on('BeforeAddUndo', onUndoChange); - editor.on('AddUndo', onUndoChange); - editor.on('cut', function () { - onChange({type: 'cut'}); - onUndoChange(); - }); - editor.on('copy', onUndoChange); - editor.on('paste', function () { - onChange({type: 'paste'}); - }); - - editor.on('focus', function () { - reactNativeEventHandler('focus', 'editor'); - }); - - editor.on('SetContent', function (event) { - console.log('content set', event.paste, globalThis.isClearingNoteData); - if (globalThis.isClearingNoteData) { - globalThis.isClearingNoteData = false; - return; - } - setTimeout(function () { - editor.undoManager.transact(function () {}); - }, 1000); - if (!event.paste) { - reactNativeEventHandler('noteLoaded', true); - } - if (event.paste) { - isLoading = false; - onChange(event); - } - }); - - editor.on('NewBlock', function (e) { - console.log('New Block'); - const {newBlock} = e; - let target; - if (newBlock) { - target = newBlock.previousElementSibling; - } - if (target && target.classList.contains(COLLAPSED_KEY)) { - target.classList.remove(COLLAPSED_KEY); - collapseElement(target); - } - }); - - editor.on('touchstart mousedown', function (e) { - const {target} = e; - if ( - e.offsetX < 6 && - collapsibleTags[target.tagName] && - target.parentElement && - target.parentElement.tagName === 'BODY' - ) { - e.preventDefault(); - e.stopImmediatePropagation(); - e.stopPropagation(); - editor.undoManager.transact(function () { - if (target.classList.contains(COLLAPSED_KEY)) { - target.classList.remove(COLLAPSED_KEY); - } else { - target.classList.add(COLLAPSED_KEY); - } - collapseElement(target); - editor.getHTML().then(function (html) { - reactNativeEventHandler('tiny', html); - }); - }); - } - }); - - editor.on('tap', function (e) { - if ( - e.target.classList.contains('mce-content-body') && - !e.target.innerText.length > 0 - ) { - e.preventDefault(); - } - }); - editor.on('ScrollIntoView', function (e) { - e.preventDefault(); - e.elm.scrollIntoView({ - behavior: 'smooth', - block: 'nearest' - }); - }); - editor.on('input', onChange); - editor.on('keyup', onChange); - editor.on('NodeChange', onChange); - editor.on('compositionend', onChange); - }, setup: function (_editor) { editor = _editor; editor.ui.registry.addButton('deleteimage', { @@ -384,7 +281,9 @@ function init_tiny(size) { }); editor.on('init', function (e) { - reactNativeEventHandler('status', true); + setTimeout(function () { + reactNativeEventHandler('status', true); + }, 300); }); editor.ui.registry.addButton('deletevideo', { @@ -467,6 +366,106 @@ function init_tiny(size) { }, onclick: function () {} }); + }, + init_instance_callback: function (_editor) { + editor = _editor; + setTheme(); + + editor.on('SelectionChange', function (e) { + selectchange(); + }); + + editor.on('ClearUndos', onUndoChange); + editor.on('Undo', onUndoChange); + editor.on('Redo', onUndoChange); + editor.on('TypingUndos', onUndoChange); + editor.on('BeforeAddUndo', onUndoChange); + editor.on('AddUndo', onUndoChange); + editor.on('cut', function () { + onChange({type: 'cut'}); + onUndoChange(); + }); + editor.on('copy', onUndoChange); + editor.on('paste', function () { + onChange({type: 'paste'}); + }); + + editor.on('tap', e => { + if (e.target.classList.contains('mce-content-body')) { + e.preventDefault(); + } + }); + + editor.on('focus', function () { + reactNativeEventHandler('focus', 'editor'); + }); + + editor.on('SetContent', function (event) { + if (globalThis.isClearingNoteData) { + globalThis.isClearingNoteData = false; + return; + } + setTimeout(function() { + editor.undoManager.transact(function () {}); + },1000); + if (!event.paste) { + reactNativeEventHandler('noteLoaded', true); + } + if (event.paste) { + isLoading = false; + onChange(event); + } + }); + + editor.on('NewBlock', function (e) { + console.log('New Block'); + const {newBlock} = e; + let target; + if (newBlock) { + target = newBlock.previousElementSibling; + } + if (target && target.classList.contains(COLLAPSED_KEY)) { + target.classList.remove(COLLAPSED_KEY); + collapseElement(target); + } + }); + + editor.on('touchstart mousedown', function (e) { + const {target} = e; + if ( + e.offsetX < 6 && + collapsibleTags[target.tagName] && + target.parentElement && + target.parentElement.tagName === 'BODY' + ) { + e.preventDefault(); + e.stopImmediatePropagation(); + e.stopPropagation(); + editor.undoManager.transact(function () { + if (target.classList.contains(COLLAPSED_KEY)) { + target.classList.remove(COLLAPSED_KEY); + } else { + target.classList.add(COLLAPSED_KEY); + } + collapseElement(target); + editor.getHTML().then(function (html) { + reactNativeEventHandler('tiny', html); + }); + }); + } + }); + + editor.on('ScrollIntoView', function (e) { + e.preventDefault(); + e.elm.scrollIntoView({ + behavior: 'smooth', + block: 'nearest' + }); + }); + editor.on('input', onChange); + editor.on('keyup', onChange); + editor.on('NodeChange', onChange); + editor.on('compositionend', onChange); } }); } diff --git a/apps/mobile/html/Web.bundle/site/listeners.js b/apps/mobile/html/Web.bundle/site/listeners.js index 6a792ece0..28cfbebcb 100755 --- a/apps/mobile/html/Web.bundle/site/listeners.js +++ b/apps/mobile/html/Web.bundle/site/listeners.js @@ -2,31 +2,38 @@ let titleInput = document.getElementById('titleInput'); let infoBar = '.info-bar'; let info = null; let scrollTimer = null; - -function onDomContentLoaded() { - document.body.onscroll = function (event) { - if (scrollTimer) { - clearTimeout(scrollTimer); - scrollTimer = null; - } - updateInfoBar(); - scrollTimer = setTimeout(function () { - - window.ReactNativeWebView.postMessage( - JSON.stringify({ - visible: event.target.documentElement.scrollTop, - title: document.getElementById('titleInput').value, - type: 'scroll' - }) - - ); - }, 100); - }; -} - function attachTitleInputListeners() { infoBar = '.info-bar'; - document.addEventListener('DOMContentLoaded', onDomContentLoaded, false); + document.addEventListener( + 'DOMContentLoaded', + function () { + autosize(); + document.body.onscroll = function (event) { + if (scrollTimer) { + clearTimeout(scrollTimer); + scrollTimer = null; + } + scrollTimer = setTimeout(function () { + window.ReactNativeWebView.postMessage( + JSON.stringify({ + visible: event.target.documentElement.scrollTop, + title: document.getElementById('titleInput').value, + type: 'scroll' + }) + ); + }, 100); + }; + }, + false + ); + + document.getElementById('formBox').onsubmit = function (evt) { + evt.preventDefault(); + if (tinymce.activeEditor) { + tinymce.activeEditor && tinymce.activeEditor.focus(); + } + onTitleChange(); + }; document.getElementById('titleInput').onkeypress = function (evt) { if (evt.keyCode === 13 || evt.which === 13) { @@ -42,6 +49,7 @@ function attachTitleInputListeners() { document .getElementById('titleInput') .addEventListener('focus', function (evt) { + autosize(); if (window.ReactNativeWebView) { window.ReactNativeWebView.postMessage( JSON.stringify({ @@ -61,10 +69,10 @@ function attachTitleInputListeners() { onTitleChange(); }; } -let titleTimeout = 0; + function onTitleChange() { - clearTimeout(titleTimeout); - titleTimeout = setTimeout(() => { + setTimeout(() => { + autosize(); if (isLoading) { return; } @@ -76,8 +84,7 @@ function onTitleChange() { info = document.querySelector(infoBar); if (tinymce.activeEditor) { info.querySelector('#infowords').innerText = - editor.countWords() + ' words'; - updateInfoBar() + editor.countWords() + ' words'; } if (titleMessage && typeof titleMessage.value === 'string') { @@ -85,51 +92,24 @@ function onTitleChange() { window.ReactNativeWebView.postMessage(JSON.stringify(titleMessage)); } } - }, 300); + }, 500); } function autosize() { - // let ele = document.getElementById('textCopy'); - // ele.innerHTML = document - // .getElementById('titleInput') - // .value.replace(/\n/g, '
'); - // let newHeight = document.getElementById('titlebar').scrollHeight; - // let css = document.createElement('style'); - // css.type = 'text/css'; - // let node = ` - // .tox-tinymce { - // min-height:calc(100vh - ${newHeight}px) !important; - // }; - // `; - // css.appendChild(document.createTextNode(node)); - // document.getElementsByTagName('head')[0].appendChild(css); -} - -function isInvalidValue(value) { - return ( - value === '' || - value === '

' || - value === '


' || - value === '

 

' - ); -} - -function updateInfoBar() { - let ids = ['infodate', 'infosaved']; - ids.forEach(id => { - let element = document.getElementById(id); - if (!element) return; - if (element.textContent && element.textContent !== '') { - if (!element.classList.contains("visible")) { - element.classList.add('visible'); - } - } else { - if (element.classList.contains("visible")) { - element.classList.remove('visible'); - } - - } - }); + let ele = document.getElementById('textCopy'); + ele.innerHTML = document + .getElementById('titleInput') + .value.replace(/\n/g, '
'); + let newHeight = document.getElementById('titlebar').scrollHeight; + let css = document.createElement('style'); + css.type = 'text/css'; + let node = ` + .tox-tinymce { + min-height:calc(100vh - ${newHeight}px) !important; + }; + `; + css.appendChild(document.createTextNode(node)); + document.getElementsByTagName('head')[0].appendChild(css); } function attachMessageListener() { @@ -138,7 +118,6 @@ function attachMessageListener() { if (isSafari) { listenerHandler = window; } - listenerHandler.addEventListener('message', function (data) { let message = JSON.parse(data.data); let type = message.type; @@ -152,12 +131,7 @@ function attachMessageListener() { isLoading = true; globalThis.isClearingNoteData = false; tinymce.activeEditor.mode.set('readonly'); - if (isInvalidValue(value)) { - tinymce.activeEditor.setContent(''); - } else { - tinymce.activeEditor.setContent(value); - } - + tinymce.activeEditor.setContent(value); setTimeout(function () { document.activeElement.blur(); window.blur(); @@ -167,8 +141,7 @@ function attachMessageListener() { }, 300); info = document.querySelector(infoBar); info.querySelector('#infowords').innerText = - editor.countWords() + ' words'; - updateInfoBar() + editor.countWords() + ' words'; break; case 'htmldiff': document.getElementsByClassName('htmldiff_div')[0].innerHTML = value; @@ -182,6 +155,9 @@ function attachMessageListener() { break; case 'title': document.getElementById('titleInput').value = value; + setTimeout(function () { + autosize(); + }, 100); break; default: break; diff --git a/apps/mobile/src/components/ActionSheetComponent/BouncingView.js b/apps/mobile/src/components/ActionSheetComponent/BouncingView.js index 08fbf5994..d2cddfc81 100644 --- a/apps/mobile/src/components/ActionSheetComponent/BouncingView.js +++ b/apps/mobile/src/components/ActionSheetComponent/BouncingView.js @@ -5,14 +5,13 @@ export const BouncingView = ({ children, style, duration = 600, - animated = true, - initialScale = 0.9 + animated = true }) => { - const scale = Animated.useValue(!animated ? 1 : initialScale); + const scale = Animated.useValue(!animated ? 1 : 0.9); useEffect(() => { if (!animated) return; - scale.setValue(initialScale); + scale.setValue(0.9); timing(scale, { toValue: 1, duration: duration, @@ -20,7 +19,7 @@ export const BouncingView = ({ }).start(); return () => { if (!animated) return; - scale.setValue(initialScale); + scale.setValue(0.9); }; }, []); diff --git a/apps/mobile/src/components/AddNotebookDialog/index.js b/apps/mobile/src/components/AddNotebookDialog/index.js index 127ec3443..4d7ba17aa 100644 --- a/apps/mobile/src/components/AddNotebookDialog/index.js +++ b/apps/mobile/src/components/AddNotebookDialog/index.js @@ -400,11 +400,6 @@ export class AddNotebookDialog extends React.Component { type="accent" onPress={this.addNewNotebook} /> - diff --git a/apps/mobile/src/components/Announcements/announcement.js b/apps/mobile/src/components/Announcements/announcement.js index b86fb0950..378597431 100644 --- a/apps/mobile/src/components/Announcements/announcement.js +++ b/apps/mobile/src/components/Announcements/announcement.js @@ -49,7 +49,7 @@ export const Announcement = ({color}) => { marginTop: 15 }} data={announcement?.body.filter(item => - allowedOnPlatform(item.platforms) + allowedOnPlatform(item.platform) )} renderItem={({item, index}) => renderItem({item: item, index: index, color: colors[color],inline:true}) diff --git a/apps/mobile/src/components/Announcements/cta.js b/apps/mobile/src/components/Announcements/cta.js index d7fa4e8d2..bd2a10900 100644 --- a/apps/mobile/src/components/Announcements/cta.js +++ b/apps/mobile/src/components/Announcements/cta.js @@ -1,21 +1,22 @@ import React from 'react'; -import {View} from 'react-native'; -import {useTracked} from '../../provider'; -import {eSendEvent, presentSheet} from '../../services/EventManager'; -import {eCloseAnnouncementDialog} from '../../utils/Events'; -import {openLinkInBrowser} from '../../utils/functions'; -import {SIZE} from '../../utils/SizeUtils'; -import {sleep} from '../../utils/TimeUtils'; +import { View } from 'react-native'; +import { useTracked } from '../../provider'; +import { eSendEvent, presentSheet } from '../../services/EventManager'; +import { eCloseAnnouncementDialog, eOpenPremiumDialog } from '../../utils/Events'; +import { openLinkInBrowser } from '../../utils/functions'; +import { SIZE } from '../../utils/SizeUtils'; +import { sleep } from '../../utils/TimeUtils'; import SettingsBackupAndRestore from '../../views/Settings/backup-restore'; -import {Button} from '../Button'; -import GeneralSheet from '../GeneralSheet'; -import {PricingPlans} from '../Premium/pricing-plans'; -import {allowedOnPlatform, getStyle} from './functions'; +import { Button } from '../Button'; +import { allowedOnPlatform, getStyle } from './functions'; -export const Cta = ({actions, style = {}, color, inline}) => { +export const Cta = ({actions, style = {}, color,inline}) => { const [state] = useTracked(); const colors = state.colors; - let buttons = actions.filter(item => allowedOnPlatform(item.platforms)) || []; + let buttons = + actions.filter(item => + allowedOnPlatform(item.platforms) + ) || []; const onPress = async item => { if (!inline) { @@ -27,18 +28,9 @@ export const Cta = ({actions, style = {}, color, inline}) => { await openLinkInBrowser(item.data, colors); } catch (e) {} } else if (item.type === 'promo') { - presentSheet({ - component: ( - - ), - noIcon: true, - noProgress: true + eSendEvent(eOpenPremiumDialog, { + promoCode: item.data, + text: item.title }); } else if (item.type === 'backup') { presentSheet({ @@ -56,7 +48,6 @@ export const Cta = ({actions, style = {}, color, inline}) => { paddingHorizontal: 12, ...getStyle(style) }}> - {buttons.length > 0 && buttons.slice(0, 1).map(item => (