From 1ef3d7e48e9759335fb08cb02046998e1c98faac Mon Sep 17 00:00:00 2001 From: Marino Rottier Date: Mon, 29 Jul 2024 12:41:48 +0200 Subject: [PATCH 1/2] fix: separately import solid functions in storybook examples --- stories/components/link.stories.tsx | 22 +-- stories/components/table.stories.tsx | 144 +++++++++--------- stories/components/tableColumn.stories.tsx | 16 +- stories/components/text.stories.tsx | 22 +-- stories/components/value.stories.tsx | 14 +- stories/components/video.stories.tsx | 14 +- .../providers/combinedProvider.stories.tsx | 14 +- stories/providers/datasetProvider.stories.tsx | 22 +-- stories/providers/thingProvider.stories.tsx | 14 +- 9 files changed, 141 insertions(+), 141 deletions(-) diff --git a/stories/components/link.stories.tsx b/stories/components/link.stories.tsx index 38c60175..cdb737f8 100644 --- a/stories/components/link.stories.tsx +++ b/stories/components/link.stories.tsx @@ -21,7 +21,7 @@ import type { ReactElement } from "react"; import React from "react"; -import SolidFns from "@inrupt/solid-client"; +import { addUrl, createThing, setThing, createSolidDataset } from "@inrupt/solid-client"; import { Link } from "../../src/components/link"; export default { @@ -48,8 +48,8 @@ export default { export function WithChildren({ property }: { property: string }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = SolidFns.addUrl( - SolidFns.createThing(), + const exampleThing = addUrl( + createThing(), property, exampleUrl, ); @@ -74,8 +74,8 @@ export function WithoutChildren({ property: string; }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = SolidFns.addUrl( - SolidFns.createThing(), + const exampleThing = addUrl( + createThing(), property, exampleUrl, ); @@ -92,14 +92,14 @@ WithoutChildren.args = { export function Editable({ property }: { property: string }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = SolidFns.addUrl( - SolidFns.createThing(), + const exampleThing = addUrl( + createThing(), property, exampleUrl, ); - const exampleDataset = SolidFns.setThing( - SolidFns.createSolidDataset(), + const exampleDataset = setThing( + createSolidDataset(), exampleThing, ); @@ -124,8 +124,8 @@ Editable.args = { export function ErrorComponent(): ReactElement { const exampleUrl = "http://test.url"; const property = "http://xmlns.com/foaf/0.1/homepage"; - const exampleThing = SolidFns.addUrl( - SolidFns.createThing(), + const exampleThing = addUrl( + createThing(), property, exampleUrl, ); diff --git a/stories/components/table.stories.tsx b/stories/components/table.stories.tsx index 9cda0e34..432524f8 100644 --- a/stories/components/table.stories.tsx +++ b/stories/components/table.stories.tsx @@ -21,7 +21,7 @@ import type { ReactElement } from "react"; import React, { useContext } from "react"; -import SolidFns from "@inrupt/solid-client"; +import { addDatetime, addStringNoLocale, createSolidDataset, createThing, getThing, getUrl, setThing, SolidDataset } from "@inrupt/solid-client"; import DatasetContext, { DatasetProvider, } from "../../src/context/datasetContext"; @@ -64,27 +64,27 @@ export function BasicExample(): ReactElement { const namePredicate = `http://xmlns.com/foaf/0.1/name`; const datePredicate = `http://schema.org/datePublished`; - const thing1A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing1A = addStringNoLocale( + createThing(), namePredicate, `example name 1`, ); - const thing1 = SolidFns.addDatetime(thing1A, datePredicate, new Date()); + const thing1 = addDatetime(thing1A, datePredicate, new Date()); - const thing2A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing2A = addStringNoLocale( + createThing(), namePredicate, `example name 2`, ); - const thing2 = SolidFns.addDatetime( + const thing2 = addDatetime( thing2A, datePredicate, new Date("1999-01-02"), ); - const emptyDataset = SolidFns.createSolidDataset(); - const datasetWithThing1 = SolidFns.setThing(emptyDataset, thing1); - const dataset = SolidFns.setThing(datasetWithThing1, thing2); + const emptyDataset = createSolidDataset(); + const datasetWithThing1 = setThing(emptyDataset, thing1); + const dataset = setThing(datasetWithThing1, thing2); return ( { - const numberThing = SolidFns.getThing(dataset, numberThingIri); + const numberThing = getThing(dataset, numberThingIri); if ( numberThing && - SolidFns.getUrl(numberThing, typeProperty) === numberType + getUrl(numberThing, typeProperty) === numberType ) { - phoneNumber = SolidFns.getUrl(numberThing, valueProperty) ?? ""; + phoneNumber = getUrl(numberThing, valueProperty) ?? ""; return true; } return false; @@ -267,11 +267,11 @@ export function NestedDataExample(): ReactElement { if (!solidDataset) { return null; } - const personThing = SolidFns.getThing( + const personThing = getThing( solidDataset, `${host}/example.ttl#me`, ); - const alterEgoThing = SolidFns.getThing( + const alterEgoThing = getThing( solidDataset, `${host}/example.ttl#alterEgo`, ); @@ -338,27 +338,27 @@ export function SortableColumns(): ReactElement { const namePredicate = `http://xmlns.com/foaf/0.1/name`; const datePredicate = `http://schema.org/datePublished`; - const thing1A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing1A = addStringNoLocale( + createThing(), namePredicate, `example name 1`, ); - const thing1 = SolidFns.addDatetime(thing1A, datePredicate, new Date()); + const thing1 = addDatetime(thing1A, datePredicate, new Date()); - const thing2A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing2A = addStringNoLocale( + createThing(), namePredicate, `example name 2`, ); - const thing2 = SolidFns.addDatetime( + const thing2 = addDatetime( thing2A, datePredicate, new Date("1999-01-02"), ); - const emptyDataset = SolidFns.createSolidDataset(); - const datasetWithThing1 = SolidFns.setThing(emptyDataset, thing1); - const dataset = SolidFns.setThing(datasetWithThing1, thing2); + const emptyDataset = createSolidDataset(); + const datasetWithThing1 = setThing(emptyDataset, thing1); + const dataset = setThing(datasetWithThing1, thing2); return (
{ const valueA = a.split(/\s+/)[1]; @@ -504,27 +504,27 @@ export function NoDataComponent(): ReactElement { const namePredicate = `http://xmlns.com/foaf/0.1/name`; const datePredicate = `http://schema.org/datePublished`; - const thing1A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing1A = addStringNoLocale( + createThing(), namePredicate, `example name 1`, ); - const thing1 = SolidFns.addDatetime(thing1A, datePredicate, new Date()); + const thing1 = addDatetime(thing1A, datePredicate, new Date()); - const thing2A = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const thing2A = addStringNoLocale( + createThing(), namePredicate, `example name 2`, ); - const thing2 = SolidFns.addDatetime( + const thing2 = addDatetime( thing2A, datePredicate, new Date("1999-01-02"), ); - const emptyDataset = SolidFns.createSolidDataset(); - const datasetWithThing1 = SolidFns.setThing(emptyDataset, thing1); - const dataset = SolidFns.setThing(datasetWithThing1, thing2); + const emptyDataset = createSolidDataset(); + const datasetWithThing1 = setThing(emptyDataset, thing1); + const dataset = setThing(datasetWithThing1, thing2); return (
{ if (thing) { - const fetchedProperty = SolidFns.getStringNoLocale(thing, propertyUrl); + const fetchedProperty = getStringNoLocale(thing, propertyUrl); if (fetchedProperty) { setProperty(fetchedProperty); @@ -106,7 +106,7 @@ function ExampleComponentFetchedData({ useEffect(() => { if (thing) { - const fetchedProperty = SolidFns.getStringNoLocale(thing, propertyUrl); + const fetchedProperty = getStringNoLocale(thing, propertyUrl); if (fetchedProperty) { setProperty(fetchedProperty); } @@ -124,13 +124,13 @@ export function WithLocalData(): ReactElement { const property = "http://xmlns.com/foaf/0.1/name"; const name = "example value"; - const exampleThing = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const exampleThing = addStringNoLocale( + createThing(), property, name, ); - const dataset = SolidFns.setThing( - SolidFns.createSolidDataset(), + const dataset = setThing( + createSolidDataset(), exampleThing, ); diff --git a/stories/providers/datasetProvider.stories.tsx b/stories/providers/datasetProvider.stories.tsx index 3ebdc622..876a4c1f 100644 --- a/stories/providers/datasetProvider.stories.tsx +++ b/stories/providers/datasetProvider.stories.tsx @@ -21,11 +21,11 @@ import type { ReactElement } from "react"; import React, { useContext, useState, useEffect } from "react"; -import SolidFns from "@inrupt/solid-client"; import DatasetContext, { DatasetProvider, } from "../../src/context/datasetContext"; import config from "../config"; +import { Thing, getThing, getStringNoLocale, getThingAll, addStringNoLocale, createThing, setThing, createSolidDataset } from "@inrupt/solid-client"; const { host } = config(); @@ -68,7 +68,7 @@ function ExampleComponentWithDatasetUrl( ): ReactElement { const { thingUrl, property: propertyUrl } = props; - const [exampleThing, setExampleThing] = useState(); + const [exampleThing, setExampleThing] = useState(); const [property, setProperty] = useState("fetching in progress"); const datasetContext = useContext(DatasetContext); @@ -76,14 +76,14 @@ function ExampleComponentWithDatasetUrl( useEffect(() => { if (solidDataset) { - const thing = SolidFns.getThing(solidDataset, thingUrl); + const thing = getThing(solidDataset, thingUrl); setExampleThing(thing || undefined); } }, [solidDataset, thingUrl]); useEffect(() => { if (exampleThing) { - const fetchedProperty = SolidFns.getStringNoLocale( + const fetchedProperty = getStringNoLocale( exampleThing, propertyUrl, ); @@ -101,7 +101,7 @@ function ExampleComponentWithDatasetUrl( } function ExampleComponentWithDataset(): ReactElement { - const [exampleThing, setExampleThing] = useState(); + const [exampleThing, setExampleThing] = useState(); const [property, setProperty] = useState("fetching in progress"); const datasetContext = useContext(DatasetContext); @@ -109,14 +109,14 @@ function ExampleComponentWithDataset(): ReactElement { useEffect(() => { if (solidDataset) { - const things = SolidFns.getThingAll(solidDataset); + const things = getThingAll(solidDataset); setExampleThing(things[0]); } }, [solidDataset]); useEffect(() => { if (exampleThing) { - const fetchedProperty = SolidFns.getStringNoLocale( + const fetchedProperty = getStringNoLocale( exampleThing, "http://xmlns.com/foaf/0.1/name", ); @@ -137,13 +137,13 @@ export function WithLocalDataset(): ReactElement { const property = "http://xmlns.com/foaf/0.1/name"; const name = "example value"; - const exampleThing = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const exampleThing = addStringNoLocale( + createThing(), property, name, ); - const dataset = SolidFns.setThing( - SolidFns.createSolidDataset(), + const dataset = setThing( + createSolidDataset(), exampleThing, ); diff --git a/stories/providers/thingProvider.stories.tsx b/stories/providers/thingProvider.stories.tsx index b6f568b8..46d7f24d 100644 --- a/stories/providers/thingProvider.stories.tsx +++ b/stories/providers/thingProvider.stories.tsx @@ -21,10 +21,10 @@ import type { ReactElement } from "react"; import React, { useContext, useState, useEffect } from "react"; -import SolidFns from "@inrupt/solid-client"; import { DatasetProvider } from "../../src/context/datasetContext"; import ThingContext, { ThingProvider } from "../../src/context/thingContext"; import config from "../config"; +import { getStringNoLocale, addStringNoLocale, createThing, getSolidDataset, SolidDataset, WithResourceInfo } from "@inrupt/solid-client"; const { host } = config(); @@ -66,7 +66,7 @@ function ExampleComponentWithThingUrl( useEffect(() => { if (thing) { - const fetchedProperty = SolidFns.getStringNoLocale( + const fetchedProperty = getStringNoLocale( thing, propertyUrl as string, ); @@ -95,7 +95,7 @@ function ExampleComponentWithThing(): ReactElement { useEffect(() => { if (thing) { - const fetchedProperty = SolidFns.getStringNoLocale( + const fetchedProperty = getStringNoLocale( thing, "http://xmlns.com/foaf/0.1/name", ); @@ -116,8 +116,8 @@ export function WithLocalThing(): ReactElement { const property = "http://xmlns.com/foaf/0.1/name"; const name = "example value"; - const exampleThing = SolidFns.addStringNoLocale( - SolidFns.createThing(), + const exampleThing = addStringNoLocale( + createThing(), property, name, ); @@ -138,11 +138,11 @@ interface IWithThingUrl { export function WithThingUrl(props: IWithThingUrl): ReactElement { const { datasetUrl, thingUrl, property } = props; const [litDataset, setSolidDataset] = useState< - SolidFns.SolidDataset & SolidFns.WithResourceInfo + SolidDataset & WithResourceInfo >(); const setDataset = async (url: string) => { - await SolidFns.getSolidDataset(url).then((result) => { + await getSolidDataset(url).then((result) => { setSolidDataset(result); }); }; From 4a79e74a868f18ce01906f79741a75cc50876a9f Mon Sep 17 00:00:00 2001 From: Nicolas Ayral Seydoux Date: Wed, 14 Aug 2024 11:55:19 +0200 Subject: [PATCH 2/2] Fix linting --- stories/components/link.stories.tsx | 36 +++------ stories/components/table.stories.tsx | 81 +++++-------------- stories/components/tableColumn.stories.tsx | 7 +- stories/components/text.stories.tsx | 23 +++--- stories/components/value.stories.tsx | 18 ++--- stories/components/video.stories.tsx | 20 +---- .../providers/combinedProvider.stories.tsx | 19 +++-- stories/providers/datasetProvider.stories.tsx | 27 +++---- stories/providers/thingProvider.stories.tsx | 19 +++-- 9 files changed, 91 insertions(+), 159 deletions(-) diff --git a/stories/components/link.stories.tsx b/stories/components/link.stories.tsx index cdb737f8..9083daa1 100644 --- a/stories/components/link.stories.tsx +++ b/stories/components/link.stories.tsx @@ -21,7 +21,12 @@ import type { ReactElement } from "react"; import React from "react"; -import { addUrl, createThing, setThing, createSolidDataset } from "@inrupt/solid-client"; +import { + addUrl, + createThing, + setThing, + createSolidDataset, +} from "@inrupt/solid-client"; import { Link } from "../../src/components/link"; export default { @@ -48,11 +53,7 @@ export default { export function WithChildren({ property }: { property: string }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = addUrl( - createThing(), - property, - exampleUrl, - ); + const exampleThing = addUrl(createThing(), property, exampleUrl); return ( Example child @@ -74,11 +75,7 @@ export function WithoutChildren({ property: string; }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = addUrl( - createThing(), - property, - exampleUrl, - ); + const exampleThing = addUrl(createThing(), property, exampleUrl); return ; } @@ -92,16 +89,9 @@ WithoutChildren.args = { export function Editable({ property }: { property: string }): ReactElement { const exampleUrl = "http://test.url"; - const exampleThing = addUrl( - createThing(), - property, - exampleUrl, - ); + const exampleThing = addUrl(createThing(), property, exampleUrl); - const exampleDataset = setThing( - createSolidDataset(), - exampleThing, - ); + const exampleDataset = setThing(createSolidDataset(), exampleThing); return ( { const numberThing = getThing(dataset, numberThingIri); - if ( - numberThing && - getUrl(numberThing, typeProperty) === numberType - ) { + if (numberThing && getUrl(numberThing, typeProperty) === numberType) { phoneNumber = getUrl(numberThing, valueProperty) ?? ""; return true; } @@ -267,10 +253,7 @@ export function NestedDataExample(): ReactElement { if (!solidDataset) { return null; } - const personThing = getThing( - solidDataset, - `${host}/example.ttl#me`, - ); + const personThing = getThing(solidDataset, `${host}/example.ttl#me`); const alterEgoThing = getThing( solidDataset, `${host}/example.ttl#alterEgo`, @@ -350,11 +333,7 @@ export function SortableColumns(): ReactElement { namePredicate, `example name 2`, ); - const thing2 = addDatetime( - thing2A, - datePredicate, - new Date("1999-01-02"), - ); + const thing2 = addDatetime(thing2A, datePredicate, new Date("1999-01-02")); const emptyDataset = createSolidDataset(); const datasetWithThing1 = setThing(emptyDataset, thing1); @@ -406,11 +385,7 @@ export function FilterOnFirstColumn({ namePredicate, `example name 2`, ); - const thing2 = addDatetime( - thing2A, - datePredicate, - new Date("1999-01-02"), - ); + const thing2 = addDatetime(thing2A, datePredicate, new Date("1999-01-02")); const emptyDataset = createSolidDataset(); const datasetWithThing1 = setThing(emptyDataset, thing1); @@ -456,16 +431,8 @@ export function SortingFunctionOnFirstColumn(): ReactElement { ); const thing1 = addDatetime(thing1A, datePredicate, new Date()); - const thing2A = addStringNoLocale( - createThing(), - namePredicate, - "Name A", - ); - const thing2 = addDatetime( - thing2A, - datePredicate, - new Date("1999-01-02"), - ); + const thing2A = addStringNoLocale(createThing(), namePredicate, "Name A"); + const thing2 = addDatetime(thing2A, datePredicate, new Date("1999-01-02")); const emptyDataset = createSolidDataset(); const datasetWithThing1 = setThing(emptyDataset, thing1); @@ -516,11 +483,7 @@ export function NoDataComponent(): ReactElement { namePredicate, `example name 2`, ); - const thing2 = addDatetime( - thing2A, - datePredicate, - new Date("1999-01-02"), - ); + const thing2 = addDatetime(thing2A, datePredicate, new Date("1999-01-02")); const emptyDataset = createSolidDataset(); const datasetWithThing1 = setThing(emptyDataset, thing1); diff --git a/stories/components/tableColumn.stories.tsx b/stories/components/tableColumn.stories.tsx index 03f1858f..8bf58b94 100644 --- a/stories/components/tableColumn.stories.tsx +++ b/stories/components/tableColumn.stories.tsx @@ -21,9 +21,14 @@ import type { ReactElement } from "react"; import React from "react"; +import { + addStringNoLocale, + createThing, + createSolidDataset, + setThing, +} from "@inrupt/solid-client"; import { Table, TableColumn } from "../../src/components/table"; import type { DataType } from "../../src/helpers"; -import { addStringNoLocale, createThing, createSolidDataset, setThing } from "@inrupt/solid-client"; export default { title: "Components/TableColumn", diff --git a/stories/components/text.stories.tsx b/stories/components/text.stories.tsx index a8cfde28..cfd13847 100644 --- a/stories/components/text.stories.tsx +++ b/stories/components/text.stories.tsx @@ -22,11 +22,16 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ import type { ReactElement } from "react"; import React from "react"; +import { + addStringNoLocale, + createThing, + setThing, + createSolidDataset, +} from "@inrupt/solid-client"; import { Text } from "../../src/components/text"; import { DatasetProvider } from "../../src/context/datasetContext"; import { ThingProvider } from "../../src/context/thingContext"; import config from "../config"; -import { addStringNoLocale, createThing, setThing, createSolidDataset } from "@inrupt/solid-client"; const { host } = config(); @@ -107,16 +112,9 @@ export function BasicExample({ }: IText): ReactElement { const exampleNick = "example value"; - const exampleThing = addStringNoLocale( - createThing(), - property, - exampleNick, - ); + const exampleThing = addStringNoLocale(createThing(), property, exampleNick); - const exampleDataset = setThing( - createSolidDataset(), - exampleThing, - ); + const exampleDataset = setThing(createSolidDataset(), exampleThing); return ( diff --git a/stories/providers/datasetProvider.stories.tsx b/stories/providers/datasetProvider.stories.tsx index 876a4c1f..7ed1604a 100644 --- a/stories/providers/datasetProvider.stories.tsx +++ b/stories/providers/datasetProvider.stories.tsx @@ -21,11 +21,20 @@ import type { ReactElement } from "react"; import React, { useContext, useState, useEffect } from "react"; +import type { Thing } from "@inrupt/solid-client"; +import { + getThing, + getStringNoLocale, + getThingAll, + addStringNoLocale, + createThing, + setThing, + createSolidDataset, +} from "@inrupt/solid-client"; import DatasetContext, { DatasetProvider, } from "../../src/context/datasetContext"; import config from "../config"; -import { Thing, getThing, getStringNoLocale, getThingAll, addStringNoLocale, createThing, setThing, createSolidDataset } from "@inrupt/solid-client"; const { host } = config(); @@ -83,10 +92,7 @@ function ExampleComponentWithDatasetUrl( useEffect(() => { if (exampleThing) { - const fetchedProperty = getStringNoLocale( - exampleThing, - propertyUrl, - ); + const fetchedProperty = getStringNoLocale(exampleThing, propertyUrl); if (fetchedProperty) { setProperty(fetchedProperty); } @@ -137,15 +143,8 @@ export function WithLocalDataset(): ReactElement { const property = "http://xmlns.com/foaf/0.1/name"; const name = "example value"; - const exampleThing = addStringNoLocale( - createThing(), - property, - name, - ); - const dataset = setThing( - createSolidDataset(), - exampleThing, - ); + const exampleThing = addStringNoLocale(createThing(), property, name); + const dataset = setThing(createSolidDataset(), exampleThing); return ( diff --git a/stories/providers/thingProvider.stories.tsx b/stories/providers/thingProvider.stories.tsx index 46d7f24d..a9ad3f86 100644 --- a/stories/providers/thingProvider.stories.tsx +++ b/stories/providers/thingProvider.stories.tsx @@ -21,10 +21,16 @@ import type { ReactElement } from "react"; import React, { useContext, useState, useEffect } from "react"; +import type { SolidDataset, WithResourceInfo } from "@inrupt/solid-client"; +import { + getStringNoLocale, + addStringNoLocale, + createThing, + getSolidDataset, +} from "@inrupt/solid-client"; import { DatasetProvider } from "../../src/context/datasetContext"; import ThingContext, { ThingProvider } from "../../src/context/thingContext"; import config from "../config"; -import { getStringNoLocale, addStringNoLocale, createThing, getSolidDataset, SolidDataset, WithResourceInfo } from "@inrupt/solid-client"; const { host } = config(); @@ -66,10 +72,7 @@ function ExampleComponentWithThingUrl( useEffect(() => { if (thing) { - const fetchedProperty = getStringNoLocale( - thing, - propertyUrl as string, - ); + const fetchedProperty = getStringNoLocale(thing, propertyUrl as string); if (fetchedProperty) { setProperty(fetchedProperty); @@ -116,11 +119,7 @@ export function WithLocalThing(): ReactElement { const property = "http://xmlns.com/foaf/0.1/name"; const name = "example value"; - const exampleThing = addStringNoLocale( - createThing(), - property, - name, - ); + const exampleThing = addStringNoLocale(createThing(), property, name); return (