Skip to content

Commit da0a788

Browse files
committed
Merge branch 'auth-upgrade' of github.com:solid/solid-ui into auth-upgrade
2 parents 78b68ac + 6311261 commit da0a788

8 files changed

Lines changed: 364 additions & 8139 deletions

File tree

package-lock.json

Lines changed: 269 additions & 8092 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@
5454
"homepage": "https://github.com/solid/solid-ui",
5555
"dependencies": {
5656
"@babel/runtime": "^7.14.0",
57-
"@inrupt/solid-client-authn-browser": "^1.10.1",
57+
"@inrupt/solid-client-authn-browser": "^1.11.2",
5858
"crypto-browserify": "^3.12.0",
5959
"escape-html": "^1.0.3",
6060
"jss": "^10.6.0",

src/authn/authn.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,8 @@ import { Quad_Object } from 'rdflib/lib/tf-types'
3535
import { solidLogicSingleton } from '../logic'
3636
import { CrossOriginForbiddenError, FetchError, NotFoundError, SameOriginForbiddenError, UnauthorizedError, ACL_LINK } from 'solid-logic'
3737

38+
/* global confirm */
39+
3840
export const authSession = authSessionImport
3941

4042
const DEFAULT_ISSUERS = [
@@ -1111,8 +1113,18 @@ export async function checkUser<T> (
11111113
const postLoginRedirectHash = window.localStorage.getItem('preLoginRedirectHash')
11121114
if (postLoginRedirectHash) {
11131115
const curUrl = new URL(window.location.href)
1114-
curUrl.hash = postLoginRedirectHash
1115-
window.location.href = curUrl.toString()
1116+
if (curUrl.hash !== postLoginRedirectHash) {
1117+
if (history.pushState) {
1118+
// console.log('Setting window.location.has using pushState')
1119+
history.pushState(null, document.title, postLoginRedirectHash)
1120+
} else {
1121+
// console.warn('Setting window.location.has using location.hash')
1122+
location.hash = postLoginRedirectHash
1123+
}
1124+
curUrl.hash = postLoginRedirectHash
1125+
}
1126+
// See https://stackoverflow.com/questions/3870057/how-can-i-update-window-location-hash-without-jumping-the-document
1127+
// indow.location.href = curUrl.toString()// @@ See https://developer.mozilla.org/en-US/docs/Web/API/Window/location
11161128
window.localStorage.setItem('preLoginRedirectHash', '')
11171129
}
11181130

src/style.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,11 @@ const formFieldNameBoxWidth = '8em' // The fixed amount to get form fields to li
1111
// fields in different groups though is hard problem.
1212

1313
export const style = { // styleModule
14+
15+
checkboxStyle: 'colour: black; font-size: 100%; padding-left: 0.5 em; padding-right: 0.5 em;',
16+
checkboxInputStyle: 'font-size: 150%; height: 1.2em; width: 1.2em; background-color: #eef; margin: 0.1em',
17+
18+
fieldLabelStyle: 'color: #3B5998; text-decoration: none;',
1419
formSelectSTyle:
1520
'background-color: #eef; padding: 0.5em; border: .05em solid #88c; border-radius:0.2em; font-size: 100%; margin:0.2em;',
1621
textInputStyle:
@@ -65,8 +70,6 @@ export const style = { // styleModule
6570
multilineTextInputStyle: 'font-size:100%; white-space: pre-wrap; background-color: #eef;' +
6671
' border: 0.07em solid gray; padding: 1em 0.5em; margin: 1em 1em;',
6772

68-
checkboxStyle: 'colour: black; font-size: 100%; padding-left: 0.5 em; padding-right: 0.5 em;',
69-
7073
// Buttons
7174
renderAsDivStyle: 'display: flex; align-items: center; justify-content: space-between; height: 2.5em; padding: 1em;',
7275
imageDivStyle: 'width:2.5em; padding:0.5em; height: 2.5em;',

src/widgets/forms.js

Lines changed: 37 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { field, mostSpecificClassURI, fieldFunction } from './forms/fieldFunctio
1212
import { setFieldStyle } from './forms/formStyle'
1313
import * as debug from '../debug'
1414
import { errorMessageBlock } from './error'
15-
import { basicField } from './forms/basic'
15+
import { basicField, renderNameValuePair } from './forms/basic'
1616
import { autocompleteField } from './forms/autocomplete/autocompleteField'
1717
import * as style from '../style'
1818

@@ -172,27 +172,32 @@ field[ns.ui('Options').uri] = function (
172172
}
173173
let values
174174
if (dependingOn.sameTerm(ns.rdf('type'))) {
175-
values = kb.findTypeURIs(subject)
175+
values = Object.keys(kb.findTypeURIs(subject)).map(uri => $rdf.sym(uri)) // Use RDF-S inference
176176
} else {
177-
const value = kb.any(subject, dependingOn)
178-
if (value === undefined) {
179-
box.appendChild(
180-
errorMessageBlock(
181-
dom,
182-
"Can't select subform as no value of: " + dependingOn
183-
)
184-
)
185-
} else {
186-
values = {}
187-
values[value.uri] = true
188-
}
177+
values = kb.each(subject, dependingOn)
189178
}
190-
// @@ Add box.refresh() to sync fields with values
191-
for (let i = 0; i < cases.length; i++) {
192-
const c = cases[i]
193-
const tests = kb.each(c, ui('for'), null, formDoc) // There can be multiple 'for'
194-
for (let j = 0; j < tests.length; j++) {
195-
if (values[tests[j].uri]) {
179+
if (values.length === 0) {
180+
box.appendChild(
181+
errorMessageBlock(
182+
dom,
183+
"Can't select subform as no value of: " + dependingOn
184+
)
185+
)
186+
} else {
187+
for (let i = 0; i < cases.length; i++) {
188+
const c = cases[i]
189+
const tests = kb.each(c, ui('for'), null, formDoc) // There can be multiple 'for'
190+
let match = false
191+
for (let j = 0; j < tests.length; j++) {
192+
for (const value of values) {
193+
const test = tests[j]
194+
if (value.sameTerm(tests) ||
195+
(value.termType === test.termType && value.value === test.value)) {
196+
match = true
197+
}
198+
}
199+
}
200+
if (match) {
196201
const field = kb.the(c, ui('use'))
197202
if (!field) {
198203
box.appendChild(
@@ -217,6 +222,7 @@ field[ns.ui('Options').uri] = function (
217222
}
218223
}
219224
}
225+
// @@ Add box.refresh() to sync fields with values
220226
return box
221227
}
222228

@@ -1579,20 +1585,14 @@ export function makeSelectForNestedCategory (
15791585
*/
15801586
export function buildCheckboxForm (dom, kb, lab, del, ins, form, dataDoc, tristate) {
15811587
const box = dom.createElement('div')
1582-
const tx = dom.createTextNode(lab)
1588+
const rhs = renderNameValuePair(dom, kb, box, form)
15831589
const editable = kb.updater.editable(dataDoc.uri)
1584-
tx.style = style.checkboxStyle
1585-
1586-
box.appendChild(tx)
1587-
let input
1588-
// eslint-disable-next-line prefer-const
1589-
input = dom.createElement('button')
15901590

1591-
input.setAttribute(
1592-
'style',
1593-
'font-size: 150%; height: 1.2em; width: 1.2em; background-color: #eef; margin: 0.1em'
1594-
)
1595-
box.appendChild(input)
1591+
const input = dom.createElement('button')
1592+
const colorCarrier = input // Which element changes color to flag changed/saving/saved?
1593+
input.style = style.checkboxInputStyle
1594+
// colorCarrier.style = style.checkboxStyle
1595+
rhs.appendChild(input)
15961596

15971597
function fix (x) {
15981598
if (!x) return [] // no statements
@@ -1646,7 +1646,7 @@ export function buildCheckboxForm (dom, kb, lab, del, ins, form, dataDoc, trista
16461646
if (!editable) return box
16471647

16481648
const boxHandler = function (_e) {
1649-
tx.style = 'color: #bbb;' // grey -- not saved yet
1649+
colorCarrier.style.color = '#bbb;' // grey -- not saved yet
16501650
const toDelete = input.state === true ? ins : input.state === false ? del : []
16511651
input.newState =
16521652
input.state === null
@@ -1678,7 +1678,8 @@ export function buildCheckboxForm (dom, kb, lab, del, ins, form, dataDoc, trista
16781678
debug.log(' @@@@@ weird if 409 - does hold statement')
16791679
}
16801680
}
1681-
tx.style = 'color: #black; background-color: #fee;'
1681+
colorCarrier.style.color = 'color: #black;'
1682+
colorCarrier.style.backgroundColor = '#fee;'
16821683
box.appendChild(
16831684
errorMessageBlock(
16841685
dom,
@@ -1688,7 +1689,7 @@ export function buildCheckboxForm (dom, kb, lab, del, ins, form, dataDoc, trista
16881689
)
16891690
)
16901691
} else {
1691-
tx.style = 'color: #black;'
1692+
colorCarrier.style = 'color: #black;'
16921693
input.state = input.newState
16931694
input.textContent = {
16941695
true: checkMarkCharacter,
@@ -1710,7 +1711,7 @@ export function fieldLabel (dom, property, form) {
17101711
}
17111712
const anchor = dom.createElement('a')
17121713
if (property.uri) anchor.setAttribute('href', property.uri)
1713-
anchor.setAttribute('style', 'color: #3B5998; text-decoration: none;') // Not too blue and no underline
1714+
anchor.setAttribute('style', style.fieldLabelStyle) // Not too blue and no underline
17141715
anchor.textContent = lab
17151716
return anchor
17161717
}

src/widgets/forms/basic.ts

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { st, BlankNode, Literal, Node, NamedNode, Variable } from 'rdflib'
1+
import { st, BlankNode, Literal, Node, NamedNode, Variable, Store } from 'rdflib'
22
import { solidLogicSingleton } from '../../logic'
33
import * as ns from '../../ns'
44
import { textInputStyle, textInputStyleUneditable, formFieldNameBoxWidth, formFieldNameBoxStyle } from '../../style'
@@ -8,6 +8,29 @@ import { mostSpecificClassURI } from './fieldFunction'
88
import { fieldParams } from './fieldParams'
99

1010
const store = solidLogicSingleton.store
11+
12+
/* Style and create a name, value pair
13+
*/
14+
export function renderNameValuePair (dom: HTMLDocument, kb: Store, box: HTMLElement, form: NamedNode):HTMLElement {
15+
const property = kb.any(form, ns.ui('property'))
16+
box.style.display = 'flex'
17+
box.style.flexDirection = 'row'
18+
const lhs = box.appendChild(dom.createElement('div'))
19+
lhs.style.width = formFieldNameBoxWidth
20+
const rhs = box.appendChild(dom.createElement('div'))
21+
22+
lhs.setAttribute('class', 'formFieldName')
23+
lhs.setAttribute('style', formFieldNameBoxStyle)
24+
rhs.setAttribute('class', 'formFieldValue')
25+
if (!property) { // Assume more space for error on right
26+
rhs.appendChild(errorMessageBlock(dom, 'No property given for form field: ' + form))
27+
lhs.appendChild(dom.createTextNode('???'))
28+
} else {
29+
lhs.appendChild(fieldLabel(dom, property as NamedNode, form))
30+
}
31+
return rhs
32+
}
33+
1134
/**
1235
* Create an anchor element with a label as the anchor text.
1336
*
@@ -90,23 +113,24 @@ export function basicField (
90113
const box = dom.createElement('div')
91114

92115
const property = kb.any(form, ns.ui('property'))
116+
if (container) container.appendChild(box)
93117
if (!property) {
94118
return box.appendChild(
95119
errorMessageBlock(dom, 'Error: No property given for text field: ' + form)
96120
)
97121
}
122+
const rhs = renderNameValuePair(dom, kb, box, form)
123+
/*
98124
box.style.display = 'flex'
99125
box.style.flexDirection = 'row'
100126
const lhs = box.appendChild(dom.createElement('div'))
101127
lhs.style.width = formFieldNameBoxWidth
102128
const rhs = box.appendChild(dom.createElement('div'))
103129
lhs.appendChild(fieldLabel(dom, property as NamedNode, form))
104-
105-
if (container) container.appendChild(box)
106-
107130
lhs.setAttribute('class', 'formFieldName')
108131
lhs.setAttribute('style', formFieldNameBoxStyle)
109132
rhs.setAttribute('class', 'formFieldValue')
133+
*/
110134

111135
// It can be cleaner to just remove empty fields if you can't edit them anyway
112136
const suppressEmptyUneditable = kb.anyJS(form, ns.ui('suppressEmptyUneditable'), null, formDoc)

src/widgets/forms/fieldParams.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export const fieldParams: { [ fieldUri: string ]: FieldParamsObject } = {
4141

4242
[ns.ui('DateTimeField').uri]: {
4343
size: 20,
44-
type: 'date',
44+
type: 'datetime-local', // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime
4545
dt: 'dateTime',
4646
pattern: /^\s*[0-9][0-9][0-9][0-9](-[0-1]?[0-9]-[0-3]?[0-9])?(T[0-2][0-9]:[0-5][0-9](:[0-5][0-9])?)?Z?\s*$/
4747
},

test/unit/widgets/forms/__snapshots__/index.test.ts.snap

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,15 @@ exports[`Heading runs 1`] = `
4040
</div>
4141
`;
4242

43-
exports[`Options field runs 1`] = `<div />`;
43+
exports[`Options field runs 1`] = `
44+
<div>
45+
<div
46+
style="margin: 0.1em; padding: 0.5em; border: 0.05em solid gray; background-color: #fee; color:black;"
47+
>
48+
Can't select subform as no value of: &lt;http://www.w3.org/1999/02/22-rdf-syntax-ns#type&gt;
49+
</div>
50+
</div>
51+
`;
4452

4553
exports[`TristateField runs 1`] = `
4654
<div

0 commit comments

Comments
 (0)