diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index d9a477c..7308af9 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -14,7 +14,7 @@ jobs:
- name: Use Node.js
uses: actions/setup-node@v3.6.0
with:
- node-version: 18.x
+ node-version: 20.x
- name: webfactory/ssh-agent
uses: webfactory/ssh-agent@v0.7.0
@@ -50,7 +50,7 @@ jobs:
- name: Use Node.js
uses: actions/setup-node@v3
with:
- node-version: 18.x
+ node-version: 20.x
- name: Build app
run: |
diff --git a/build.js b/build.js
index 9abfe7f..373913e 100644
--- a/build.js
+++ b/build.js
@@ -21,6 +21,7 @@ async function copy (target) {
await cp('src/template', target)
await cp('src/fonts', target)
await cp('src/lib', target)
+ await cp('src/pages', target)
await cp('src/css', target)
}
diff --git a/socket.ini b/socket.ini
index c760e58..8172c2b 100644
--- a/socket.ini
+++ b/socket.ini
@@ -48,6 +48,10 @@ output = "build"
; The build script. It runs before the `[build] copy` phase.
script = "node build.js"
+; Key value pairs added to the envrionment.
+[env]
+DEV = true
+
[build.script]
; If true, it will pass build arguments to the build script. WARNING: this could be deprecated in the future.
; default value: false
diff --git a/src/components/editor.js b/src/components/editor.js
index a04a24f..bd252bc 100644
--- a/src/components/editor.js
+++ b/src/components/editor.js
@@ -47,6 +47,7 @@ globalThis.MonacoEnvironment = {
class EditorTabs extends Tonic {
selectedTabId = null
scrollLeft = 0
+ index = 0
constructor () {
super()
@@ -67,7 +68,6 @@ class EditorTabs extends Tonic {
add (node) {
const parent = this.props.parent
- const count = this.state.tabs.size
const tab = {
label: node.label,
@@ -78,7 +78,7 @@ class EditorTabs extends Tonic {
state: null,
hash: null,
unsaved: false,
- index: count + 1
+ index: this.index++
}
tab.model.onDidChangeContent((...args) => editor.changes(tab, ...args))
@@ -179,7 +179,7 @@ class EditorTabs extends Tonic {
// check if there are any other tabs
if (this.state.tabs.size > 0) {
const tabs = [...this.state.tabs.values()]
- const previousSibling = tabs.find(t => t.index < tab.index)
+ const previousSibling = tabs.findLast(t => t.index < tab.index)
const nextSibling = tabs.find(t => t.index > tab.index)
const sibling = previousSibling || nextSibling
diff --git a/src/components/properties.js b/src/components/properties.js
index e88447c..fe99822 100644
--- a/src/components/properties.js
+++ b/src/components/properties.js
@@ -246,15 +246,17 @@ class AppProperties extends Tonic {
No changes.
`
- if (!gitStatus.stderr && gitStatus.stdout.length) {
+ const notInitialized = gitStatus.stderr.includes('not a git repo')
+
+ if (notInitialized || (!gitStatus.stderr && gitStatus.stdout.length)) {
projectUpdates = this.html`
- ${gitStatus.stdout}
+ ${gitStatus.stdout || 'No Changes.'}
Publish Changes
+ >Publish
`
}
}
diff --git a/src/components/publish.js b/src/components/publish.js
index 8449b1d..42228ad 100644
--- a/src/components/publish.js
+++ b/src/components/publish.js
@@ -44,7 +44,13 @@ export class DialogPublish extends TonicDialog {
// TODO(@heapwolf): probably chain with previousId
}
- const subcluster = app.socket.subclusters.get(dataProject.subclusterId)
+ let subcluster = app.socket.subclusters.get(dataProject.subclusterId)
+
+ // user created a new subcluster but it's not yet been activated.
+ if (!subcluster) {
+ subcluster = await app.socket.subcluster({ sharedKey: dataProject.sharedKey })
+ }
+
const packets = await subcluster.emit(type, value, opts)
}
diff --git a/src/components/subscribe.js b/src/components/subscribe.js
index dd9df61..a5f6e0f 100644
--- a/src/components/subscribe.js
+++ b/src/components/subscribe.js
@@ -49,6 +49,7 @@ export class DialogSubscribe extends TonicDialog {
const project = {
bundleId,
+ waiting: true,
clusterId,
subclusterId,
sharedKey,
@@ -73,7 +74,8 @@ export class DialogSubscribe extends TonicDialog {
diff --git a/src/css/component-editor.css b/src/css/component-editor.css
index 6764eb8..a5913d3 100644
--- a/src/css/component-editor.css
+++ b/src/css/component-editor.css
@@ -35,14 +35,16 @@ editor-tabs .tab.selected {
opacity: 1;
}
-editor-tabs .tab.unsaved .label {
- border-bottom: 1px solid var(--tonic-warning);
-}
-
editor-tabs .tab .label {
justify-content: center;
align-content: center;
margin: 0 4px;
+ border-bottom: 1px solid transparent;
+ white-space: nowrap;
+}
+
+editor-tabs .tab.unsaved .label {
+ border-bottom: 1px solid var(--tonic-warning);
}
editor-tabs .tab tonic-button {
diff --git a/src/css/theme.css b/src/css/theme.css
index 0c86e19..1bf85dd 100644
--- a/src/css/theme.css
+++ b/src/css/theme.css
@@ -3,6 +3,12 @@ body {
--tonic-header: 'Inter Black', sans-serif;
--tonic-subheader: 'Inter Medium', sans-serif;
--tonic-monospace: 'FiraMono', monospace;
+ --tonic-error: rgba(240, 102, 83, 1);
+ --tonic-notification: rgba(240, 102, 83, 1);
+ --tonic-danger: rgba(240, 102, 83, 1);
+ --tonic-success: rgba(133, 178, 116, 1);
+ --tonic-warning: rgba(249, 169, 103, 1);
+ --tonic-info: rgba(153, 157, 160, 1);
}
@media (prefers-color-scheme: light) {
@@ -19,9 +25,9 @@ body {
--tonic-disabled: rgba(152, 161, 175, 1);
--tonic-button-text: rgba(54, 57, 61, 1);
--tonic-button-shadow: rgba(0, 0, 0, 33%);
- --tonic-button-background: rgba(245, 245, 245, 1);
- --tonic-button-background-hover: rgba(230, 230, 230, 1);
- --tonic-button-background-focus: rgba(237, 237, 237, 1);
+ --tonic-button-background: rgba(224, 224, 224, 1);
+ --tonic-button-background-hover: rgba(214, 214, 214, 1);
+ --tonic-button-background-focus: rgba(200, 200, 200, 1);
--tonic-input-text: rgba(54, 57, 61, 1);
--tonic-input-text-hover: rgba(228, 228, 228, 1);
--tonic-input-border: rgba(201, 201, 201, 1);
@@ -30,12 +36,6 @@ body {
--tonic-input-background-focus: rgba(238, 238, 238, 1);
--tonic-border: rgba(224, 224, 224, 1);
--tonic-border-accent: rgba(206, 206, 206, 1);
- --tonic-error: rgba(240, 102, 83, 1);
- --tonic-notification: rgba(240, 102, 83, 1);
- --tonic-danger: rgba(240, 102, 83, 1);
- --tonic-success: rgba(133, 178, 116, 1);
- --tonic-warning: rgba(249, 169, 103, 1);
- --tonic-info: rgba(153, 157, 160, 1);
--tonic-overlay: rgba(255, 255, 255, 0.75);
--tonic-selection: #eceff4;
}
@@ -65,12 +65,6 @@ body {
--tonic-input-border-hover: rgba(105, 105, 105, 1);
--tonic-border: rgba(72, 72, 72, 1);
--tonic-border-accent: rgba(90, 90, 90, 1);
- --tonic-error: rgba(240, 102, 83, 1);
- --tonic-notification: rgba(240, 102, 83, 1);
- --tonic-caution: rgba(240, 102, 83, 1);
- --tonic-success: rgba(133, 178, 116, 1);
- --tonic-warn: rgba(249, 169, 103, 1);
- --tonic-info: rgba(134, 134, 134, 1);
--tonic-overlay: rgba(0, 0, 0, 0.40);
--tonic-selection: #000000;
}
diff --git a/src/css/view-home.css b/src/css/view-home.css
index 70a382a..6297326 100644
--- a/src/css/view-home.css
+++ b/src/css/view-home.css
@@ -19,6 +19,12 @@ view-home.show {
opacity: 1;
}
+view-home iframe {
+ border: none;
+ height: 280px;
+ width: 100%;
+}
+
view-home .content {
position: absolute;
top: 50px;
diff --git a/src/index.js b/src/index.js
index f589930..c028e89 100644
--- a/src/index.js
+++ b/src/index.js
@@ -713,6 +713,8 @@ class AppView extends Tonic {
await this.initNetwork()
await this.initApplication()
+ const previewMode = this.state.settings?.previewMode === true ? 'selected' : ''
+
return this.html`
@@ -753,7 +755,7 @@ class AppView extends Tonic {
-
+
diff --git a/src/template/demo-project/socket.ini b/src/template/demo-project/socket.ini
index 98e2208..478f5a8 100644
--- a/src/template/demo-project/socket.ini
+++ b/src/template/demo-project/socket.ini
@@ -142,7 +142,7 @@ flags = "-g"
; A unique ID that identifies the bundle (used by all app stores).
; It's required when `[meta] type` is not `"extension"`.
; It should be in a reverse DNS notation https://developer.apple.com/documentation/bundleresources/information_property_list/cfbundleidentifier#discussion
-bundle_identifier = "com.demo-project"
+bundle_identifier = "com.demo.project"
; A unique application protocol scheme to support deep linking
; If this value is not defined, then it is derived from the `[meta] bundle_identifier` value
diff --git a/src/views/home.js b/src/views/home.js
index 02eb9d5..87f7a6f 100644
--- a/src/views/home.js
+++ b/src/views/home.js
@@ -1,3 +1,4 @@
+import application from 'socket:application'
import fs from 'socket:fs'
import path from 'socket:path'
@@ -12,6 +13,40 @@ class ViewHome extends Tonic {
this.classList.remove('show')
}
+ async click (e) {
+ const el = Tonic.match(e.target, '[data-event]')
+ if (!el) return
+
+ const { event } = el.dataset
+
+ if (event === 'upgrade') {
+ const opts = {
+ config: {
+ webview_auto_register_service_workers: false,
+ webview_service_worker_frame: false
+ },
+ path: 'pages/account.html',
+ index: 14,
+ closable: true,
+ maximizable: false,
+ title: 'Signup',
+ titleBarStyle: 'hiddenInset',
+ trafficLightPosition: '10x26',
+ backgroundColorDark: 'rgba(46, 46, 46, 1)',
+ backgroundColorLight: 'rgba(255, 255, 255, 1)',
+ resizable: false,
+ width: 450,
+ height: 300
+ }
+
+ const w = await application.createWindow(opts)
+
+ w.channel.addEventListener('message', e => {
+ console.log(e.data)
+ })
+ }
+ }
+
async change (e) {
const el = Tonic.match(e.target, '[data-event]')
if (!el) return
@@ -53,7 +88,7 @@ class ViewHome extends Tonic {
const { data: dataUser } = await app.db.state.get('user')
const publicKey = Buffer.from(dataUser.publicKey).toString('base64')
- const bio = dataUser.bio || ''
+ const bio = dataUser.bio || undefined
return this.html`
@@ -80,16 +115,12 @@ class ViewHome extends Tonic {
- What's New!
-
- Platform Documentation
-
- User Profile
-
- Regenerate Keys
+
+ Regenerate Keys
+
+