From 10b27376c3cff8c32c5df750d6d71660b2cde42c Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 10:20:07 +0200 Subject: [PATCH 1/9] Introduces dashboard that switches content dep on authentication state --- dashboard/dashboardPane.ts | 59 ++++++++++++++++++++++++++++++++++++++ index.js | 1 + types.ts | 31 ++++++++++++++++++++ 3 files changed, 91 insertions(+) create mode 100644 dashboard/dashboardPane.ts diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts new file mode 100644 index 00000000..663ddc5b --- /dev/null +++ b/dashboard/dashboardPane.ts @@ -0,0 +1,59 @@ +import { PaneDefinition, SolidSession } from "../types" +import solidUi, { SolidUi } from "solid-ui" +import paneRegistry from "pane-registry" +import { NamedNode, sym } from "rdflib" + +let panes +let UI: SolidUi + +const nodeMode = (typeof module !== "undefined") + +if (nodeMode) { + UI = solidUi + panes = paneRegistry +} else { // Add to existing mashlib + panes = (window as any).panes + UI = panes.UI +} + +export const dashboardPane: PaneDefinition = { + icon: UI.icons.iconBase + "noun_547570.svg", + name: "dashboard", + label: () => { + return "Dashboard" + }, + render: (subject, dom) => { + const container = dom.createElement("div") + const webId = UI.authn.currentUser() + buildPage(container, webId) + + UI.authn.solidAuthClient.trackSession(async (session: SolidSession) => { + container.innerHTML = '' + buildPage(container, session ? sym(session.webId) : null) + }) + + return container + } +} + +function buildPage(container: HTMLElement, webId: NamedNode | null) { + if (!webId) { + return buildHomePage(container) + } + const webIdDefaultPod = new URL(webId.uri).origin + if (webIdDefaultPod === location.origin) { + return buildDashboard(container) + } + return buildHomePage(container) +} + +function buildDashboard(container: HTMLElement) { + container.innerText = 'DASHBOARD' +} + +function buildHomePage(container: HTMLElement) { + container.innerText = 'HOMEPAGE' +} + + +export default dashboardPane diff --git a/index.js b/index.js index eae3a56c..8692b537 100644 --- a/index.js +++ b/index.js @@ -47,6 +47,7 @@ if (typeof window !== 'undefined') { let register = panes.register +register(require('./dashboard/dashboardPane').default) register(require('issue-pane')) register(require('contacts-pane')) diff --git a/types.ts b/types.ts index af65b484..1cfebf23 100644 --- a/types.ts +++ b/types.ts @@ -54,3 +54,34 @@ interface NewPaneOptions { pane: PaneDefinition; refreshTarget: HTMLTableElement; } + +export interface SolidSession { + authorization: SolidAuthorization; + credentialType: string; + idClaims: SolidClaim; + idp: string; + issuer: string; + sessionKey: string; + webId: string; +} + +interface SolidAuthorization { + access_token: string; + client_id: string; + id_token: string; +} + +interface SolidClaim { + at_hash: string; + aud: string; + azp: string; + cnf: { + jwk: string; + }; + exp: number; + iat: number; + iss: string; + jti: string; + nonce: string; + sub: string; +} From 2469d3c7dd4efa7b95dd1d87f124c209156ab490 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 11:28:17 +0200 Subject: [PATCH 2/9] Managed to insert the dashboard, albeit it is presented wrongly --- dashboard/dashboardPane.ts | 24 ++++++++++++------------ outline/manager.js | 25 ++++++++++++++++++------- 2 files changed, 30 insertions(+), 19 deletions(-) diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts index 663ddc5b..29a377f9 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.ts @@ -3,7 +3,7 @@ import solidUi, { SolidUi } from "solid-ui" import paneRegistry from "pane-registry" import { NamedNode, sym } from "rdflib" -let panes +let panes: any let UI: SolidUi const nodeMode = (typeof module !== "undefined") @@ -25,34 +25,34 @@ export const dashboardPane: PaneDefinition = { render: (subject, dom) => { const container = dom.createElement("div") const webId = UI.authn.currentUser() - buildPage(container, webId) - + buildPage(container, webId, dom) UI.authn.solidAuthClient.trackSession(async (session: SolidSession) => { - container.innerHTML = '' - buildPage(container, session ? sym(session.webId) : null) + container.innerHTML = "" + buildPage(container, session ? sym(session.webId) : null, dom) }) - + return container } } -function buildPage(container: HTMLElement, webId: NamedNode | null) { +function buildPage (container: HTMLElement, webId: NamedNode | null, dom: HTMLDocument) { if (!webId) { return buildHomePage(container) } const webIdDefaultPod = new URL(webId.uri).origin if (webIdDefaultPod === location.origin) { - return buildDashboard(container) + return buildDashboard(container, dom) } return buildHomePage(container) } -function buildDashboard(container: HTMLElement) { - container.innerText = 'DASHBOARD' +function buildDashboard (container: HTMLElement, dom: HTMLDocument) { + const outliner = panes.getOutliner(dom) + outliner.showDashboard(false, container) } -function buildHomePage(container: HTMLElement) { - container.innerText = 'HOMEPAGE' +function buildHomePage (container: HTMLElement) { + container.innerText = "HOMEPAGE" } diff --git a/outline/manager.js b/outline/manager.js index d10d0272..8e1210bd 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -330,13 +330,7 @@ module.exports = function (doc) { menuButton.setAttribute('src', UI.icons.iconBase + 'noun_547570.svg') // Lines (could also use dots or home or hamburger menuButton.style = 'padding: 0.2em;' menuButton.addEventListener('click', event => { - if (expanded) { - expandedControl.parentNode.removeChild(expandedControl) - } else { - if (tr.nextSibling) tr.parentElement.removeChild(tr.nextSibling) // @@ hack - should use pane code - expandedControl = tr.parentElement.appendChild(globalAppTabs()) - } - expanded = !expanded + [expanded, expandedControl] = showDashboard(expanded, expandedControl) }) menuButton.style = buttonStyle menuButton.style.maxHeight = iconHeight @@ -344,6 +338,23 @@ module.exports = function (doc) { return globalNav } + function showDashboard (expanded = false, expandedControl) { + const container = document.getElementById('outline').querySelector('table tr:last-child').firstChild + if (expanded) { + expandedControl.parentNode.removeChild(expandedControl) + } else { + if (container.nextSibling) container.parentElement.removeChild(container.nextSibling) // @@ hack - should use pane code + expandedControl = container.parentElement.appendChild(globalAppTabs()) + } + expanded = !expanded + return [expanded, expandedControl] + menuButton.style = buttonStyle + menuButton.style.maxHeight = iconHeight + globalNav.appendChild(menuButton) + return globalNav + } + this.showDashboard = showDashboard + function expandedHeaderTR (subject, requiredPane, options) { function renderPaneIconTray (td) { const paneShownStyle = 'width: 24px; border-radius: 0.5em; border-top: solid #222 1px; border-left: solid #222 0.1em; border-bottom: solid #eee 0.1em; border-right: solid #eee 0.1em; margin-left: 1em; padding: 3px; background-color: #ffd;' From f33259a220817e386a6670c69cea6d7a21af1681 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 11:41:46 +0200 Subject: [PATCH 3/9] Managed to insert dashboard as pane But broken global dashboard as a consequence --- dashboard/dashboardPane.ts | 2 +- outline/manager.js | 40 ++++++++++++++++++++------------------ 2 files changed, 22 insertions(+), 20 deletions(-) diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts index 29a377f9..1cbe3971 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.ts @@ -48,7 +48,7 @@ function buildPage (container: HTMLElement, webId: NamedNode | null, dom: HTMLDo function buildDashboard (container: HTMLElement, dom: HTMLDocument) { const outliner = panes.getOutliner(dom) - outliner.showDashboard(false, container) + outliner.showDashboard(false, container, container) } function buildHomePage (container: HTMLElement) { diff --git a/outline/manager.js b/outline/manager.js index 8e1210bd..c607fd95 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -282,9 +282,11 @@ module.exports = function (doc) { throw new Error('Not logged in') } function renderTab (div, item) { - const map = { 'home': 'Your stuff', + const map = { + 'home': 'Your stuff', 'trustedApplications': 'Web apps you trust', - 'profile': 'Edit your profile' } + 'profile': 'Edit your profile' + } div.textContent = map[item] || item } @@ -330,7 +332,7 @@ module.exports = function (doc) { menuButton.setAttribute('src', UI.icons.iconBase + 'noun_547570.svg') // Lines (could also use dots or home or hamburger menuButton.style = 'padding: 0.2em;' menuButton.addEventListener('click', event => { - [expanded, expandedControl] = showDashboard(expanded, expandedControl) + [expanded, expandedControl] = showDashboard(expanded, expandedControl, tr) }) menuButton.style = buttonStyle menuButton.style.maxHeight = iconHeight @@ -338,20 +340,15 @@ module.exports = function (doc) { return globalNav } - function showDashboard (expanded = false, expandedControl) { - const container = document.getElementById('outline').querySelector('table tr:last-child').firstChild + function showDashboard (expanded, expandedControl, container) { if (expanded) { expandedControl.parentNode.removeChild(expandedControl) } else { - if (container.nextSibling) container.parentElement.removeChild(container.nextSibling) // @@ hack - should use pane code - expandedControl = container.parentElement.appendChild(globalAppTabs()) + if (container.nextSibling) container.removeChild(container.nextSibling) // @@ hack - should use pane code + expandedControl = container.appendChild(globalAppTabs()) } expanded = !expanded return [expanded, expandedControl] - menuButton.style = buttonStyle - menuButton.style.maxHeight = iconHeight - globalNav.appendChild(menuButton) - return globalNav } this.showDashboard = showDashboard @@ -444,10 +441,13 @@ module.exports = function (doc) { dom.getElementById('queryButton').removeAttribute('style') } var second = t.firstChild.nextSibling - if (second) t.insertBefore(paneDiv, second) - else t.appendChild(paneDiv) - paneDiv.pane = pane - paneDiv.paneButton = ico + var row = dom.createElement('tr') + var cell = row.appendChild(dom.createElement('td')) + cell.appendChild(paneDiv) + if (second) t.insertBefore(row, second) + else t.appendChild(row) + row.pane = pane + row.paneButton = ico } var state state = ico.getAttribute('class') @@ -521,7 +521,6 @@ module.exports = function (doc) { return } const isHidden = menuButton.style.display === 'none' - console.log(isHidden) if (session) { menuButton.style.display = 'block' } else { @@ -599,12 +598,15 @@ module.exports = function (doc) { pre.appendChild(dom.createTextNode(UI.utils.stackString(e))) } + var row = dom.createElement('tr') + var cell = row.appendChild(dom.createElement('td')) + cell.appendChild(paneDiv) if (tr1.firstPane.requireQueryButton && dom.getElementById('queryButton')) { dom.getElementById('queryButton').removeAttribute('style') } - table.appendChild(paneDiv) - paneDiv.pane = tr1.firstPane - paneDiv.paneButton = tr1.paneButton + table.appendChild(row) + row.pane = tr1.firstPane + row.paneButton = tr1.paneButton } return table From 031509a28e0f24527e47c6e03029a2f0213fa15e Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 11:44:59 +0200 Subject: [PATCH 4/9] Only showing dashboard for root --- dashboard/dashboardPane.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts index 1cbe3971..79691806 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.ts @@ -19,8 +19,11 @@ if (nodeMode) { export const dashboardPane: PaneDefinition = { icon: UI.icons.iconBase + "noun_547570.svg", name: "dashboard", - label: () => { - return "Dashboard" + label: (subject) => { + if (subject.uri === `${location.origin}/`) { + return "Dashboard" + } + return null }, render: (subject, dom) => { const container = dom.createElement("div") From 01f08d7939721366f6d720aa04288371fac749a3 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 13:09:08 +0200 Subject: [PATCH 5/9] It's now tightly coupled with the changes in mashlib --- dashboard/dashboardPane.ts | 2 +- outline/manager.js | 58 ++++++-------------------------------- 2 files changed, 9 insertions(+), 51 deletions(-) diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts index 79691806..2bba9da8 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.ts @@ -51,7 +51,7 @@ function buildPage (container: HTMLElement, webId: NamedNode | null, dom: HTMLDo function buildDashboard (container: HTMLElement, dom: HTMLDocument) { const outliner = panes.getOutliner(dom) - outliner.showDashboard(false, container, container) + outliner.showDashboard(container) } function buildHomePage (container: HTMLElement) { diff --git a/outline/manager.js b/outline/manager.js index c607fd95..0f0ca028 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -314,41 +314,16 @@ module.exports = function (doc) { })) return div } - /** Global Navigation tool - ** - ** This gives the user the ability to find and do stuff sfrom no context - */ - function globalNavigationBox (tr, menuButtonId) { - const buttonStyle = 'padding: 0.3em 0.5em; border-radius:0.2em; margin: 0 0.4em; font-size: 100%;' // @@ - const globalNav = dom.createElement('nav') - var expanded = false - var expandedControl - globalNav.style = 'padding: 0; margin: 0; height: 100%; max-height: 2em;' + - 'display:flex; justify-content: flex-end; flex-grow: 1; align-items: center;' - // globalNav.style.backgroundColor = '#884488' // @@ placeholder - - var menuButton = dom.createElement('img') - menuButton.id = menuButtonId - menuButton.setAttribute('src', UI.icons.iconBase + 'noun_547570.svg') // Lines (could also use dots or home or hamburger - menuButton.style = 'padding: 0.2em;' - menuButton.addEventListener('click', event => { - [expanded, expandedControl] = showDashboard(expanded, expandedControl, tr) - }) - menuButton.style = buttonStyle - menuButton.style.maxHeight = iconHeight - globalNav.appendChild(menuButton) - return globalNav - } - function showDashboard (expanded, expandedControl, container) { - if (expanded) { - expandedControl.parentNode.removeChild(expandedControl) - } else { - if (container.nextSibling) container.removeChild(container.nextSibling) // @@ hack - should use pane code - expandedControl = container.appendChild(globalAppTabs()) + function showDashboard (container, unselectCurrentPane) { + container.innerHTML = '' + // console.log(container) + const currentPane = dom.querySelector('#outline .paneShown') + if (unselectCurrentPane && currentPane) { + // eslint-disable-next-line no-undef + // currentPane.dispatchEvent(new Event('click')) } - expanded = !expanded - return [expanded, expandedControl] + return container.appendChild(globalAppTabs()) } this.showDashboard = showDashboard @@ -512,23 +487,6 @@ module.exports = function (doc) { header.appendChild(renderPaneIconTray(td)) - if (options.solo) { - const menuButtonId = 'GlobalUserMenuButton' - td.appendChild(globalNavigationBox(tr, menuButtonId)) - UI.authn.solidAuthClient.trackSession(function (session) { - const menuButton = document.getElementById(menuButtonId) - if (!menuButton) { - return - } - const isHidden = menuButton.style.display === 'none' - if (session) { - menuButton.style.display = 'block' - } else { - menuButton.style.display = 'none' - } - }) - } - // set DOM methods tr.firstChild.tabulatorSelect = function () { setSelected(this, true) From 2a1ea695bdd5137a1220e3617a5a5d4af5b31a67 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 13:24:45 +0200 Subject: [PATCH 6/9] Allows to select a specific tab in the global dashboard --- outline/manager.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/outline/manager.js b/outline/manager.js index 0f0ca028..8d116e7a 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -274,7 +274,7 @@ module.exports = function (doc) { /** Render Tabbed set of home app panes * @returns {Element} - the div */ - function globalAppTabs () { + function globalAppTabs (selectedTab) { const div = dom.createElement('div') const me = UI.authn.currentUser() if (!me) { @@ -287,6 +287,7 @@ module.exports = function (doc) { 'trustedApplications': 'Web apps you trust', 'profile': 'Edit your profile' } + div.dataset.name = item div.textContent = map[item] || item } @@ -306,7 +307,8 @@ module.exports = function (doc) { renderTab, ordered: true, orientation: 0, - backgroundColor: '#eeeeee'} // black? + backgroundColor: '#eeeeee', + selectedTab} // black? // options.renderTabSettings = renderTabSettings No tab-specific settings div.appendChild(UI.tabs.tabWidget(options)) div.appendChild(UI.widgets.cancelButton(dom, event => { @@ -315,7 +317,7 @@ module.exports = function (doc) { return div } - function showDashboard (container, unselectCurrentPane) { + function showDashboard (container, unselectCurrentPane, globalPaneToSelect) { container.innerHTML = '' // console.log(container) const currentPane = dom.querySelector('#outline .paneShown') @@ -323,7 +325,7 @@ module.exports = function (doc) { // eslint-disable-next-line no-undef // currentPane.dispatchEvent(new Event('click')) } - return container.appendChild(globalAppTabs()) + return container.appendChild(globalAppTabs(globalPaneToSelect)) } this.showDashboard = showDashboard From 8545dda00d4e5e89942d908c3595c8c64c73e1f3 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 14:46:07 +0200 Subject: [PATCH 7/9] Generating a homepage as fallback for guests Is shown when you're unauthenticated or authenticated as someone other than the one who controls the Pod --- .../{dashboardPane.ts => dashboardPane.tsx} | 10 ++- dashboard/homepage.ts | 67 +++++++++++++++++++ 2 files changed, 76 insertions(+), 1 deletion(-) rename dashboard/{dashboardPane.ts => dashboardPane.tsx} (78%) create mode 100644 dashboard/homepage.ts diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.tsx similarity index 78% rename from dashboard/dashboardPane.ts rename to dashboard/dashboardPane.tsx index 2bba9da8..a317d1a1 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.tsx @@ -2,6 +2,7 @@ import { PaneDefinition, SolidSession } from "../types" import solidUi, { SolidUi } from "solid-ui" import paneRegistry from "pane-registry" import { NamedNode, sym } from "rdflib" +import { generateHomepage } from "./homepage" let panes: any let UI: SolidUi @@ -55,7 +56,14 @@ function buildDashboard (container: HTMLElement, dom: HTMLDocument) { } function buildHomePage (container: HTMLElement) { - container.innerText = "HOMEPAGE" + const wrapper = document.createElement('div') + container.appendChild(wrapper) + const shadow = wrapper.attachShadow({ mode: 'open' }) + const link = document.createElement('link') + link.rel = 'stylesheet' + link.href = '/common/css/bootstrap.min.css' + shadow.appendChild(link) + generateHomepage(UI.store, UI.store.fetcher).then(homepage => shadow.appendChild(homepage)) } diff --git a/dashboard/homepage.ts b/dashboard/homepage.ts new file mode 100644 index 00000000..17864d98 --- /dev/null +++ b/dashboard/homepage.ts @@ -0,0 +1,67 @@ +import $rdf, { Fetcher, IndexedFormula, NamedNode } from "rdflib" +import UI from "solid-ui" + +const ns = UI.ns + +export async function generateHomepage(store: IndexedFormula, fetcher: Fetcher): Promise { + const pod = location.origin + const ownersProfile = await loadProfile(`${pod}/profile/card#me`, fetcher) + const name = getName(store, ownersProfile) + + const wrapper = document.createElement('div') + wrapper.classList.add('container') + wrapper.appendChild(createTitle(ownersProfile.uri, name)) + wrapper.appendChild(createDataSection(name)) + + return wrapper +} + +function createDataSection(name: string): HTMLElement { + const dataSection = document.createElement('section') + + const title = document.createElement('h2') + title.innerText = 'Data' + dataSection.appendChild(title) + + const listGroup = document.createElement('div') + listGroup.classList.add('list-group') + dataSection.appendChild(listGroup) + + const publicDataLink = document.createElement('a') + publicDataLink.classList.add('list-group-item') + publicDataLink.href = '/public/' + publicDataLink.innerText = `View ${name}'s files` + listGroup.appendChild(publicDataLink) + + return dataSection +} + +function createTitle(uri: string, name: string): HTMLElement { + const profileLink = document.createElement('a') + profileLink.href = uri + profileLink.innerText = name + + const profileLinkPost = document.createElement('span') + profileLinkPost.innerText = `'s Pod` + + const title = document.createElement('h1') + title.appendChild(profileLink) + title.appendChild(profileLinkPost) + + return title +} + + +async function loadProfile(profileUrl: string, fetcher: Fetcher): Promise { + const webId = $rdf.sym(profileUrl) + await fetcher.load(webId) + return webId +} + + + +function getName (store: IndexedFormula, ownersProfile: NamedNode): string { + return (store.anyValue as any)(ownersProfile, ns.vcard("fn"), null, ownersProfile.doc()) + || (store.anyValue as any)(ownersProfile, ns.foaf("name"), null, ownersProfile.doc()) + || new URL(ownersProfile.uri).host.split('.')[0] +} From ff46ef61f87faa9fc5408b1648526f9d8a3b1c54 Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 14:53:07 +0200 Subject: [PATCH 8/9] Do not think we need cancel button anymore --- dashboard/{dashboardPane.tsx => dashboardPane.ts} | 0 outline/manager.js | 3 --- 2 files changed, 3 deletions(-) rename dashboard/{dashboardPane.tsx => dashboardPane.ts} (100%) diff --git a/dashboard/dashboardPane.tsx b/dashboard/dashboardPane.ts similarity index 100% rename from dashboard/dashboardPane.tsx rename to dashboard/dashboardPane.ts diff --git a/outline/manager.js b/outline/manager.js index 8d116e7a..3015842c 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -311,9 +311,6 @@ module.exports = function (doc) { selectedTab} // black? // options.renderTabSettings = renderTabSettings No tab-specific settings div.appendChild(UI.tabs.tabWidget(options)) - div.appendChild(UI.widgets.cancelButton(dom, event => { - div.parentNode.removeChild(div) - })) return div } From 1b68ad670f59404a5982b8bfd9f26cffb61b367e Mon Sep 17 00:00:00 2001 From: Arne Hassel Date: Wed, 24 Jul 2019 16:37:42 +0200 Subject: [PATCH 9/9] Some smaller changes based on feedback from Tim --- dashboard/dashboardPane.ts | 19 +++++++++---------- dashboard/homepage.ts | 4 ++-- outline/manager.js | 2 +- 3 files changed, 12 insertions(+), 13 deletions(-) diff --git a/dashboard/dashboardPane.ts b/dashboard/dashboardPane.ts index a317d1a1..49c2ce9c 100644 --- a/dashboard/dashboardPane.ts +++ b/dashboard/dashboardPane.ts @@ -21,7 +21,7 @@ export const dashboardPane: PaneDefinition = { icon: UI.icons.iconBase + "noun_547570.svg", name: "dashboard", label: (subject) => { - if (subject.uri === `${location.origin}/`) { + if (subject.uri === subject.site().uri) { return "Dashboard" } return null @@ -29,25 +29,24 @@ export const dashboardPane: PaneDefinition = { render: (subject, dom) => { const container = dom.createElement("div") const webId = UI.authn.currentUser() - buildPage(container, webId, dom) + buildPage(container, webId, dom, subject) UI.authn.solidAuthClient.trackSession(async (session: SolidSession) => { container.innerHTML = "" - buildPage(container, session ? sym(session.webId) : null, dom) + buildPage(container, session ? sym(session.webId) : null, dom, subject) }) return container } } -function buildPage (container: HTMLElement, webId: NamedNode | null, dom: HTMLDocument) { +function buildPage (container: HTMLElement, webId: NamedNode | null, dom: HTMLDocument, subject: NamedNode) { if (!webId) { - return buildHomePage(container) + return buildHomePage(container, subject) } - const webIdDefaultPod = new URL(webId.uri).origin - if (webIdDefaultPod === location.origin) { + if (webId.site().uri === subject.site().uri) { return buildDashboard(container, dom) } - return buildHomePage(container) + return buildHomePage(container, subject) } function buildDashboard (container: HTMLElement, dom: HTMLDocument) { @@ -55,7 +54,7 @@ function buildDashboard (container: HTMLElement, dom: HTMLDocument) { outliner.showDashboard(container) } -function buildHomePage (container: HTMLElement) { +function buildHomePage (container: HTMLElement, subject: NamedNode) { const wrapper = document.createElement('div') container.appendChild(wrapper) const shadow = wrapper.attachShadow({ mode: 'open' }) @@ -63,7 +62,7 @@ function buildHomePage (container: HTMLElement) { link.rel = 'stylesheet' link.href = '/common/css/bootstrap.min.css' shadow.appendChild(link) - generateHomepage(UI.store, UI.store.fetcher).then(homepage => shadow.appendChild(homepage)) + generateHomepage(subject, UI.store, UI.store.fetcher).then(homepage => shadow.appendChild(homepage)) } diff --git a/dashboard/homepage.ts b/dashboard/homepage.ts index 17864d98..83ab7a0f 100644 --- a/dashboard/homepage.ts +++ b/dashboard/homepage.ts @@ -3,8 +3,8 @@ import UI from "solid-ui" const ns = UI.ns -export async function generateHomepage(store: IndexedFormula, fetcher: Fetcher): Promise { - const pod = location.origin +export async function generateHomepage(subject: NamedNode, store: IndexedFormula, fetcher: Fetcher): Promise { + const pod = subject.site().uri const ownersProfile = await loadProfile(`${pod}/profile/card#me`, fetcher) const name = getName(store, ownersProfile) diff --git a/outline/manager.js b/outline/manager.js index 3015842c..3a97d5ab 100644 --- a/outline/manager.js +++ b/outline/manager.js @@ -284,7 +284,7 @@ module.exports = function (doc) { function renderTab (div, item) { const map = { 'home': 'Your stuff', - 'trustedApplications': 'Web apps you trust', + 'trustedApplications': 'Preferences', 'profile': 'Edit your profile' } div.dataset.name = item