#418 #477 Refactor Todo settings, add predefined Todo apps list

* add condition if on todo options

* add drop down for  todo server

* fix error TODOS_FRONTEND

* add todo list apps'

* update name of dropdown menu to Todo Service

* add other service to dropdown menu and subsetting field for user to input url

* add Other Service to drop down

* fixed typos

* reverted wording

* fix custom field

* fix linting

* fix linting

* Delete tsconfig.tsbuildinfo

* Delete tsconfig.tsbuildinfo

* Delete tsconfig.tsbuildinfo

* Add regex to validate custom todo url

* Add note with source of regex function

* Move regex function declaration to function body root

* Apply code style

* Add migration for todo settings

* Apply code style

Co-authored-by: romain <romain@jumboprivacy.com>
Co-authored-by: Roman <46404814+yourcontact@users.noreply.github.com>
Co-authored-by: romain <rpsa@pm.me>

1 files changed, 25 insertions, 2 deletions

diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js
index e9b1963f7..2626186e9 100644
--- a/src/features/todos/components/TodosWebview.js
+++ b/src/features/todos/components/TodosWebview.js
@@ -9,10 +9,20 @@ import { defineMessages, intlShape } from 'react-intl';
 import { mdiCheckAll } from '@mdi/js';
 import SettingsStore from '../../../stores/SettingsStore';
 
-import * as environment from '../../../environment';
 import Appear from '../../../components/ui/effects/Appear';
 import UpgradeButton from '../../../components/ui/UpgradeButton';
 
+// NOTE: https://stackoverflow.com/questions/5717093/check-if-a-javascript-string-is-a-url
+function validURL(str) {
+  const pattern = new RegExp('^(https?:\\/\\/)?' // protocol
+      + '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' // domain name
+      + '((\\d{1,3}\\.){3}\\d{1,3}))' // OR ip (v4) address
+      + '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*' // port and path
+      + '(\\?[;&a-z\\d%_.~+=-]*)?' // query string
+      + '(\\#[-a-z\\d_]*)?$', 'i'); // fragment locator
+  return !!pattern.test(str);
+}
+
 const messages = defineMessages({
   premiumInfo: {
     id: 'feature.todos.premium.info',
@@ -194,6 +204,16 @@ class TodosWebview extends Component {
 
     const { intl } = this.context;
 
+    const isUsingPredefinedTodoServer = stores.settings.all.app.predefinedTodoServer !== 'isUsingCustomTodoService';
+    const todoUrl = isUsingPredefinedTodoServer
+      ? stores.settings.all.app.predefinedTodoServer
+      : stores.settings.all.app.customTodoServer;
+    let isTodoUrlValid = true;
+    if (isUsingPredefinedTodoServer === false) {
+      isTodoUrlValid = validURL(todoUrl);
+    }
+
+
     return (
       <div
         className={classes.root}
@@ -213,6 +233,8 @@ class TodosWebview extends Component {
           />
         )}
         {isTodosIncludedInCurrentPlan ? (
+          isTodoUrlValid
+          && (
           <Webview
             className={classes.webview}
             onDidAttach={() => {
@@ -223,8 +245,9 @@ class TodosWebview extends Component {
             partition="persist:todos"
             preload="./features/todos/preload.js"
             ref={(webview) => { this.webview = webview ? webview.view : null; }}
-            src={stores.settings.all.app.todoServer || environment.TODOS_FRONTEND}
+            src={todoUrl}
           />
+          )
         ) : (
           <Appear>
             <div className={classes.premiumContainer}>