Connecting skohub-editor to local skohub-vocab

[jschnasse]

Dear colleagues,

I'm evaluating your amazing toolset for one of my projects. For demonstration purposes I´d like to run a local instance of skohub-editor and connect it to a locally served skos vocabulary to demonstrate the input of subjects (schema:about) based on SKOS.

Here is what I did

Download skohub-editor

git clone https://github.com/skohub-io/skohub-editor.git
cd skohub-editor
npm install
npm use 16

Run skohub-editor

PORT=9004 npm start

Provide a default scheme locally

mkdir public
cd public 
cp ../src/json/generic-oer-schema.json schema.json

Set local scheme.json as default

code src/components/SkohubEditor.js
# Edit Line 16 to
# const DEFAULT_SCHEMA = 'http://localhost:9004/public/schema.json'

Delete localStorage in firefox!

Edit the about section in public/schema.json to provide lookup to my local skos-vocab endpoint

....
"about": {
      "title": "Subject",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "type": {
            "type": "string",
            "enum": [
              "Concept"
            ]
          },
          "id": {
            "type": "string",
            "format": "uri"
          },
          "inScheme": {
            "type": "object",
            "properties": {
              "id": {
                "type": "string",
                "enum": [
                  "http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.de.html"
                ]
              }
            }
          }
        },
....

This cannot work for now. So...

Now I´d like to provide the vocab under http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.de.html

Download skohub-vocabs

git clone git@github.com:skohub-io/skohub-vocabs.git
cd skohub-vocabs
nvm install 18
nvm use 18
npm i
cp .env.example .env

Provide actual SKOS-Vocab to the tool

cp demo/systematik.ttl data/

Run skohub-vocabs

npm run develop

Expected

1. The skohub-vocab endpoint will be available under http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.de.html
2. The skohub-editor will provide a lookup on the subject form based on http://localhost:8000/w3id.org/kim/hochschulfaechersystematik /scheme.de.html

Actual

1. The skohub-vocab endpoint is available under http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.de.html

2. The skohub-editor does not provide a lookup on the subject form based on http://localhost:8000/w3id.org/kim/hochschulfaechersystematik /scheme.de.html

• Subject form is not diplayed
• Some unrelated (?) errors in console

Could you provide any hint on why this does not work as expected?

[sroertgen]

Hey @jschnasse ,

try adding .json instead of de.html. Since the development server of SkoHub Vocabs will not do any content negotiation, you have to pass the specific path to the json.

....
"about": {
      "title": "Subject",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "type": {
            "type": "string",
            "enum": [
              "Concept"
            ]
          },
          "id": {
            "type": "string",
            "format": "uri"
          },
          "inScheme": {
            "type": "object",
            "properties": {
              "id": {
                "type": "string",
                "enum": [
                  "http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.json"
                ]
              }
            }
          }
        },
....

Regarding the other errors I will have to have a deeper look. Seems like the search is not working properly, but the subjects should show up. Currently the editor is a little bit unmaintained, but that might change in (near) future. We focused mostly on SkoHub Vocabs for the past months and will start to work on SkoHub Reconcile in Q1 2023.

[sroertgen]

You should get the search working with the following hack:

In SkoHubLookup.js L 126 place the following:

fetch(
      schemaLocation.endsWith(".json")
        ? schemaLocation.replace(".json", ".de.index")
        : schemaLocation,
      {
        headers: {
          Accept: "text/index",
        },
      }
    )
     .then((response....

This will only work for german vocabularies, but it will reduce the error messages and you can use the search feature.

[jschnasse]

Thank you @sroertgen .

"http://localhost:8000/w3id.org/kim/hochschulfaechersystematik/scheme.json"

does the trick indeed.

[jschnasse]

Your hack

fetch(
      schemaLocation.endsWith(".json")
        ? schemaLocation.replace(".json", ".de.index")
        : schemaLocation,
      {
        headers: {
          Accept: "text/index",
        },
      }
    )
     .then((response....

works as well.

Just for reference.

Paste in here:

https://github.com/skohub-io/skohub-editor/blob/master/src/components/JSONPointerForm/SkohubLookup.js#L94

[sroertgen]

I will close the issue for now. If you encounter any other problems or have further questions, feel free to (re)open a ticket!