diff --git a/package-lock.json b/package-lock.json
index bd04261..f0071be 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2538,6 +2538,45 @@
"defer-to-connect": "^1.0.1"
}
},
+ "@tiny-components/confirm": {
+ "version": "0.1.1",
+ "resolved": "https://registry.npmjs.org/@tiny-components/confirm/-/confirm-0.1.1.tgz",
+ "integrity": "sha512-YxJWGEkqa7s+4m3IZwyw3WZfuwSMERgkaeDnAXgOypC7t3hMPus0+GzSgqFSCA0boe5zl0T8NFAAN1AJJ4zZpg==",
+ "requires": {
+ "@riotjs/observable": "^4.1.1",
+ "@tiny-components/plain-ui": "^0.6.0",
+ "riot": "^7.0.6"
+ },
+ "dependencies": {
+ "@riotjs/dom-bindings": {
+ "version": "6.0.7",
+ "resolved": "https://registry.npmjs.org/@riotjs/dom-bindings/-/dom-bindings-6.0.7.tgz",
+ "integrity": "sha512-BcXFOf3QslM6CAXYQwY04iP7Kzy3WSEOo0oDZQzPC26GYa7pYAPzc2TytlmZQQIG2vuUHkHJPxfVWwOk2rmKjA==",
+ "requires": {
+ "@riotjs/util": "^2.1.2"
+ }
+ },
+ "@riotjs/util": {
+ "version": "2.1.3",
+ "resolved": "https://registry.npmjs.org/@riotjs/util/-/util-2.1.3.tgz",
+ "integrity": "sha512-ZQYhNCIurpPcJ6yv4Hr42PIhCGwDvtPeHeSHeICnMRvwogr5Zknd2f6X29OyXv7eeZTki2TzhYNeIkhwSfxL0w=="
+ },
+ "riot": {
+ "version": "7.0.6",
+ "resolved": "https://registry.npmjs.org/riot/-/riot-7.0.6.tgz",
+ "integrity": "sha512-waIurYZ3oWFcO89Sd14fvrD3euuglJZxiD3li5CxmzL51JB8nWpaHLdK8qHxGkO6+YjLiVol8GLxB03yh/HoLg==",
+ "requires": {
+ "@riotjs/compiler": "^6.3.2",
+ "@riotjs/dom-bindings": "^6.0.7",
+ "@riotjs/util": "^2.1.3",
+ "bianco.attr": "^1.1.1",
+ "bianco.query": "^1.1.4",
+ "cumpa": "^1.0.1",
+ "curri": "^1.0.1"
+ }
+ }
+ }
+ },
"@tiny-components/loading": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/@tiny-components/loading/-/loading-0.1.0.tgz",
diff --git a/package.json b/package.json
index b031a88..b6c67c0 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
},
"dependencies": {
"@riotjs/observable": "^4.1.1",
+ "@tiny-components/confirm": "^0.1.1",
"@tiny-components/notification": "^0.1.0",
"@tiny-components/plain-ui": "^0.6.0",
"@tiny-components/sidebar-form": "^0.1.0",
diff --git a/resources/index.html b/resources/index.html
index f73995b..8d4090f 100644
--- a/resources/index.html
+++ b/resources/index.html
@@ -10,6 +10,7 @@
diff --git a/src/js/app.js b/src/js/app.js
index 145ca92..029f7fa 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -4,6 +4,7 @@ import TinyLoading from '@tiny-components/loading/src/loading.riot'
import TinySidebarFormHeader from './forms/header.riot'
import TinySidebarFormFooter from './forms/footer.riot'
import TinyNotification from '@tiny-components/notification/src/notification.riot'
+import TinyConfirm from '@tiny-components/confirm/src/confirm.riot'
import FieldError from '@tiny-components/validator/src/fieldError.riot'
@@ -18,6 +19,7 @@ riot.register('tiny-loading', TinyLoading)
riot.register('tiny-sidebar-form-header', TinySidebarFormHeader)
riot.register('tiny-sidebar-form-footer', TinySidebarFormFooter)
riot.register('tiny-notification', TinyNotification)
+riot.register('tiny-confirm', TinyConfirm)
riot.register('potato-field-tags', potatoFieldTags)
riot.register('potato-apps-view', potatoAppsView)
@@ -25,6 +27,7 @@ riot.register('potato-close-button', potatoCloseButton)
riot.mount('potato-apps-view')
riot.mount('tiny-notification')
+riot.mount('tiny-confirm')
// workaround to prevent a stack overflow
window._arrayBufferToBase64 = function _arrayBufferToBase64(buffer) {
diff --git a/src/js/forms/apps.riot b/src/js/forms/apps.riot
index 39d1147..c8b23f7 100644
--- a/src/js/forms/apps.riot
+++ b/src/js/forms/apps.riot
@@ -115,6 +115,9 @@
// validator
import FormValidator from '@tiny-components/validator/src/formValidator.js'
+ // confirm
+ import confirmStore from '@tiny-components/confirm/src/store.js'
+
/**
* handler for apps
*
@@ -243,7 +246,7 @@
if (event.target.files[0]) {
if (!this.state.current) {
this.state.current = {
-
+
}
}
@@ -323,8 +326,18 @@
this.update()
},
+ /**
+ *
+ *
+ */
handleDelete() {
- appsStore.remove(this.state.current)
+ confirmStore.trigger('open', {
+ 'content': 'Delete "' + this.state.current.name + '" ?'
+ })
+
+ confirmStore.confirm(() => {
+ appsStore.remove(this.state.current)
+ })
},
/**
diff --git a/src/scss/components/_confirm.scss b/src/scss/components/_confirm.scss
new file mode 100644
index 0000000..e82f865
--- /dev/null
+++ b/src/scss/components/_confirm.scss
@@ -0,0 +1,6 @@
+.tiny-modal {
+ .modal__footer {
+ display: flex;
+ justify-content: space-between;
+ }
+}
\ No newline at end of file
diff --git a/src/scss/styles.scss b/src/scss/styles.scss
index f03c41f..7023786 100644
--- a/src/scss/styles.scss
+++ b/src/scss/styles.scss
@@ -11,5 +11,6 @@
'components/loading',
'components/buttons',
'components/filter',
+ 'components/confirm',
'components/icons';