issue-pane 2.4.20 → 2.5.0

package/.eslintrc

@@ -0,0 +1,19 @@
+{
+  "root": true,
+  "env": {
+    "browser": true,
+    "es6": true,
+    "node": true
+  },
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly"
+  },
+  "rules": {
+    "no-unused-vars": ["warn", {
+      "argsIgnorePattern": "^_",
+      "varsIgnorePattern": "^_"
+    }]
+  },
+  "extends": ["eslint:recommended", "plugin:import/recommended"]
+}

package/.github/workflows/ci.yml

@@ -0,0 +1,75 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - "**"
+  pull_request:
+    branches:
+      - "**"  
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+       node-version:
+          - 18.x
+          - 20.x
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: npm ci
+      - run: npm run lint --if-present
+      - run: npm test
+      - run: npm run build --if-present
+      - name: Save build
+        if: matrix.node-version == '18.x'
+        uses: actions/upload-artifact@v4
+        with:
+          name: build
+          path: |
+            .
+            !node_modules
+          retention-days: 1
+  npm-publish-build:
+      needs: build
+      runs-on: ubuntu-latest
+      steps:
+        - uses: actions/download-artifact@v4
+          with:
+            name: build
+        - uses: actions/setup-node@v1
+          with:
+            node-version: 18.x
+        - uses: rlespinasse/github-slug-action@v3.x
+        - name: Append commit hash to package version
+          run: 'sed -i -E "s/(\"version\": *\"[^\"]+)/\1-${GITHUB_SHA_SHORT}/" package.json'
+        - name: Disable pre- and post-publish actions
+          run: 'sed -i -E "s/\"((pre|post)publish)/\"ignore:\1/" package.json'
+        - uses: JS-DevTools/npm-publish@v1
+          with:
+            token: ${{ secrets.NPM_TOKEN }}
+            tag: ${{ env.GITHUB_REF_SLUG }}
+
+  npm-publish-latest:
+    needs: build
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main'
+    steps:
+      - uses: actions/download-artifact@v4
+        with:
+          name: build
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 18.x
+      - name: Disable pre- and post-publish actions
+        run: 'sed -i -E "s/\"((pre|post)publish)/\"ignore:\1/" package.json'
+      - uses: JS-DevTools/npm-publish@v1
+        with:
+          token: ${{ secrets.NPM_TOKEN }}
+          tag: latest

package/.nvmrc

@@ -0,0 +1 @@
+v18.19.0

package/Makefile

@@ -1,6 +1,8 @@
 # Wrap TTL files into JS files for bundling with library
 
-,all : wf.js trackerSettingsForm.js trackerInstancesForm.js ui.js
+# unused:  trackerInstancesForm.js
+
+,all : wf.js trackerSettingsForm.js  ui.js
 
 #individualForm.js : individualForm.ttl
 #				(echo 'module.exports = `' ; cat individualForm.ttl; echo '`') >  individualForm.js

package/csvButton.js

@@ -0,0 +1,137 @@
+// A Button to copy the state of the tracker in CSV format
+// Comma-separated Values
+//
+// Yes this mixes the layers but that is not all bad if it gets it in one file
+// one can look at 
+
+import { icons, ns, utils, widgets } from 'solid-ui'
+import { store } from 'solid-logic'
+
+const TestCSVstring = 'A,B,C\n1,2,3\n4,5,6\nfoo,bar,baz\n'
+
+export function quoteString(value) {
+  // https://www.rfc-editor.org/rfc/rfc4180
+  const stripped = value.replaceAll('\n', ' ')
+  if (!stripped.includes(',')) {
+    return stripped
+  }  // If contains comma then put in quotes and double up internal quotes
+  const quoted = '"' + stripped.replaceAll('"', '""') + '"'
+  console.log('Quoted:  >>>' + quoted + '<<<')
+  const check  = quoted.slice(1,-1).replaceAll('""', '') 
+  if (check.includes('"')) throw new Error('CSV inconsistecy')
+  return quoted
+}
+
+export function csvText(store, tracker)  {
+
+  function columnText(task, column) {
+    let thing
+    if (column.predicate)  {
+      thing = store.any(task, column.predicate)
+      return thing? thing.value : '--'
+    }
+    else if (column.category)  {
+      const types = store.each(task, ns.rdf('type'))
+      for (const t of types) {
+        // console.log('@@ checking subclass type: ', t, ' category: ', column.category )
+        if (store.holds(t, ns.rdfs('subClassOf'), column.category)){
+          thing = t
+        }
+      }
+      if (!thing) return '?' + utils.label(column.category) // Missing cat OK
+      // if (!thing) throw new Error('wot no class of category ', column.category)
+    } else {
+      throw new Error('wot no pred or cat', column)
+    }
+    return utils.label(thing)
+  }
+
+  function taskLine(task) {
+    return columns.map(column => columnText(task, column))
+        .map(quoteString)
+        .join(',')
+            + '\n'
+  }
+  const stateStore = store.any(tracker, ns.wf('stateStore'))
+  const tasks = store.each(null, ns.wf('tracker'), tracker, stateStore)
+  console.log('  CSV: Tasks:', tasks.length)
+
+  const columns = [
+    
+    { label: 'Name',  predicate: ns.dc('title')  },
+  /*  { label: 'Description',  predicate: ns.wf('description')  }, */
+
+/*    { label: 'State', category: ns.wf('Task') }
+      */
+] 
+  const states = store.any(tracker, ns.wf('issueClass')) // Main states are subclasses of this class
+  console.log('  CSV: States - main superclass:', states)
+  const stateColumn = { label: 'State', category: states} // better than  'task'
+  console.log('  CSV: found column from state', stateColumn)
+  columns.push(stateColumn) 
+
+  const categories = store.each(tracker, ns.wf('issueCategory'))
+  console.log('  CSV: Categories : ', categories )
+  console.log('  CSV: Categories : length: ', categories.length)
+  console.log('  CSV: Categories : first: ', categories[0])
+
+  const classifications = categories
+  for (const c of classifications){
+    const column = { label: utils.label(c), category: c}
+    console.log('  CSV: found column from classifications', column)
+    columns.push(column) // Classes are different
+  }
+
+  // const propertyList = ns.wf('propertyList')
+  const form = store.any(tracker, ns.wf('extrasEntryForm'), null, null)
+  console.log('  CSV: Form : ', form )
+
+  if (form) {
+    const parts = store.any(form, ns.ui('parts'), null, form.doc())
+    console.log('  CSV: parts : ', parts )
+
+    const fields = parts.elements
+    console.log('  CSV: fields : ', fields )
+
+    for (const field of fields) {
+      const prop = store.any(field,ns.ui('property'))
+      if (prop) {
+        const lab = utils.label(prop)
+        const column = {label: lab, predicate: prop}
+        console.log('  CSV: found column from form', column)
+        columns.push(column)  
+      }
+    }
+  }
+  // Put description  on the end as it can be long
+  columns.push({ label: 'Description',  predicate: ns.wf('description') })
+  console.log('Columns: ', columns.length)
+  const header = columns.map(col => col.label).join(',') + '\n'
+  console.log('CSV: Header= ', header)
+  // Order tasks?? By Creation date? By Status?
+  const body = tasks.map(taskLine).join('')
+  return header + body
+}
+
+export function csvButton (dom, tracker) {
+  const wrapper = dom.createElement('div')
+  // Add a button
+  const button = widgets.button(dom, icons.iconBase + 'noun_Document_998605.svg',
+    'Copy as CSV', async event => {
+
+      const div = button.parentNode.parentNode
+      console.log('button gparent div', div)
+      div.addEventListener('copy', event => {
+          // alert ('Copy caught');
+          const csv = csvText(store, tracker);
+          event.clipboardData.setData("text/plain", csv);
+          event.clipboardData.setData("text/csv", csv);
+          alert ('Copy data: ' + csv)
+          event.preventDefault();
+      })
+    })
+
+  wrapper.appendChild(button)
+  return wrapper
+}
+

package/dev/context.js

@@ -0,0 +1,19 @@
+// import { longChatPane } from "chat-pane";
+import { DataBrowserContext, PaneRegistry } from "pane-registry";
+import { LiveStore, solidLogicSingleton, store } from "solid-logic";
+
+export const context = {
+  session: {
+    store: store,
+    paneRegistry: {
+      byName: (name) => {
+        return // longChatPane
+      }
+    },
+    logic : solidLogicSingleton
+  },
+  dom: document,
+  getOutliner: () => null,
+};
+
+export const fetcher = store.fetcher;

package/dev/index.html

@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <title>issue-pane dev server</title>
+    <style>
+        body {
+            margin: 0;
+            font-family: sans-serif;
+        }
+        h1 {
+            padding: 0.5rem;
+            margin: 0;
+            color: #666;
+        }
+        #loginBanner {
+            display: grid;
+            padding: 0.5rem;
+            grid-gap: 1rem;
+            grid-auto-flow: column;
+            justify-content: flex-start;
+            align-items: center;
+        }
+        .banner {
+            margin: 0;
+            height: 1rem;
+            width: 100%;
+            background: repeating-linear-gradient(
+                    -45deg,
+                    #ffffff,
+                    #d8d9d5 20px,
+                    #d41717 20px,
+                    #984646 40px
+            );
+        }
+    </style>
+</head>
+<body>
+<h1>pane under development</h1>
+<div>
+    <div id="webId"></div>
+  </div>
+<div id="loginBanner"></div>
+<div class="banner"></div>
+<div id="app">Rendering...</div>
+</body>
+</html>

package/dev/index.js

@@ -0,0 +1,42 @@
+import { sym } from "rdflib";
+import { default as pane } from "..";
+import { context, fetcher } from "./context";
+import { authn, authSession } from "solid-logic";
+import * as UI from "solid-ui";
+
+const loginBanner = document.getElementById("loginBanner");
+const webId = document.getElementById("webId");
+
+loginBanner.appendChild(UI.login.loginStatusBox(document, null, {}));
+
+async function finishLogin() {
+  await authSession.handleIncomingRedirect();
+  const session = authSession;
+  if (session.info.isLoggedIn) {
+    // Update the page with the status.
+    webId.innerHTML = "Logged in as: " + authn.currentUser().uri;
+  } else {
+    webId.innerHTML = "";
+  }
+}
+
+finishLogin();
+
+
+// https://testingsolidos.solidcommunity.net/profile/card#me
+// https://timbl.solidcommunity.net/profile/card#me
+//
+// const targetURIToShow = "https://angelo.veltens.org/profile/card#me";
+// const targetURIToShow = "https://testingsolidos.solidcommunity.net/profile/card#me";
+// const targetURIToShow = "https://timbl.solidcommunity.net/profile/card#me";
+
+// const targetURIToShow = "https://solidproject.solidcommunity.net/Roadmap/index.ttl#this";
+
+// const targetURIToShow = "https://timbl.com/timbl/Automation/mother/tracker.n3#mother"
+
+const targetURIToShow = "http://localhost:8080/big-tracker.ttl#this"
+
+fetcher.load(targetURIToShow).then(() => {
+  const app = pane.render(sym(targetURIToShow), context);
+  document.getElementById("app").replaceWith(app);
+});

package/dist/big-tracker.ttl

@@ -0,0 +1,238 @@
+
+  # This is the master file for a big issue tracker
+
+    @prefix : <#> .
+    @prefix con: <http://www.w3.org/2000/10/swap/pim/contact#> .
+    @prefix doap: <http://usefulinc.com/ns/doap#> .
+    @prefix flow: <http://www.w3.org/2005/01/wf/flow#> .
+    @prefix ical: <http://www.w3.org/2002/12/cal/ical#> .
+    @prefix owl: <http://www.w3.org/2002/07/owl#> .
+    @prefix ui: <http://www.w3.org/ns/ui#> .
+    
+    :Accepted     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Will go ahead. We are working on this";
+         <http://www.w3.org/2000/01/rdf-schema#label> "Accepted, in progress";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 50 .
+    
+    :Action     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "action";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeeeff";
+         ui:sortOrder 80 .
+    
+    :AttendConference     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "attend conference";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#fcfce8";
+         ui:sortOrder 50 .
+        
+    :Book     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "book";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeffee";
+         ui:sortOrder 70 .
+    
+    :CommercialSpeaking     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "commercial speaking";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#ffcbad";
+         ui:sortOrder 30 .
+    
+    :Declined     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Declined";
+         <http://www.w3.org/2000/01/rdf-schema#label> "declined";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 30 .
+    
+    :Discussing     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Being discussed";
+         <http://www.w3.org/2000/01/rdf-schema#label> "in discussion";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 80 .
+    
+    :Done     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Completed.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "done";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 20 .
+    
+    :Film     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "film";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeffff";
+         ui:sortOrder 80 .
+    
+    :HonoraryDegree     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "honorary degree";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#ffa8ab";
+         ui:sortOrder 40 .
+        
+    :Meeting     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "meeting request";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#e8e8ff";
+         ui:sortOrder 60 .
+    
+    :MotherIssue     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "Request";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Task;
+         owl:disjointUnionOf  (
+        :New
+        :Discussing
+        :Pending
+        :Negotiating
+        :Accepted
+        :Urgent
+        :ToBeDeclined
+        :Watchlist
+        :Declined
+        :Obsolete
+        :Done ) .
+    
+    :Negotiating     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Being negotiated";
+         <http://www.w3.org/2000/01/rdf-schema#label> "negotiating";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 60 .
+    
+    :New     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> """Has not been looked at.
+    This is the initial state normally when an issue is created.""";
+         <http://www.w3.org/2000/01/rdf-schema#label> "new";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 90 .
+    
+    :NonProfitSpeaking     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "non-profit speaking";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#fffed0";
+         ui:sortOrder 20 .
+        
+    :Obsolete     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Overtaken by time or events.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "obsolete/missed";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 10 .
+
+
+    :OtherRequest     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "other";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeeeee";
+         ui:sortOrder 90 .
+    
+    :Pending     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Waiting for someone else's input.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "pending others";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 75 .
+    
+    :PressRequest     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "press";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#dccdfc";
+         ui:sortOrder 10 .
+        
+    :RequestCategory     <http://www.w3.org/2000/01/rdf-schema#label> "category";
+         owl:disjointUnionOf  (
+        :PressRequest
+        :NonProfitSpeaking
+        :CommercialSpeaking
+        :HonoraryDegree
+        :AttendConference
+        :Meeting
+        :Book
+        :Film
+        :Action
+        :OtherRequest ) .
+    
+    :RequestExtrasForm     a ui:Form,
+                ui:Group;
+         <http://purl.org/dc/elements/1.1/title> "Extra  details of a request";
+         ui:parts  (
+         [
+                 a ui:Heading;
+                 ui:contents "Details:"@en;
+                 ui:sequence 10 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:earliestDate;
+                 ui:sequence 20 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:latestDate;
+                 ui:sequence 40 ]
+         [
+                 a ui:Comment;
+                 ui:contents "The earliest and latest dates are the window for the event, or both the same if fixed."@en;
+                 ui:sequence 60;
+                 ui:style "background-color: #ffe;" ]
+         [
+                 a ui:SingleLineTextField;
+                 ui:property ical:location;
+                 ui:seuqence 70;
+                 ui:size 30 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:dateReceived;
+                 ui:sequence 80 ]
+         [
+                 a ui:MultiLineTextField;
+                 ui:property <http://www.w3.org/2000/01/rdf-schema#comment>;
+                 ui:sequence 90 ] ) .
+    
+        
+    :ToBeDeclined     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "To be declined";
+         <http://www.w3.org/2000/01/rdf-schema#label> "to be declined";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 40 .
+    
+    :Urgent     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Needs urgent attention";
+         <http://www.w3.org/2000/01/rdf-schema#label> "URGENT";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 55 .
+        
+    :Watchlist     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "We will keep this in mind.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "watch list";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 35 .
+    
+    :this     a flow:Tracker;
+         <http://purl.org/dc/terms/title> "The Big Request Tracker";
+         <http://www.w3.org/2000/01/rdf-schema#label> "Request Tracker";
+         flow:allowSubIssues :false;
+         flow:assigneeClass <http://xmlns.com/foaf/0.1/Person>;
+         flow:defaultView flow:TableView;
+         flow:description "Requests";
+         flow:extrasEntryForm :RequestExtrasForm;
+         flow:initialState :New;
+         flow:issueCategory :RequestCategory;
+         flow:issueClass :MotherIssue;
+         flow:propertyList  (
+        flow:earliestDate
+        flow:latestDate
+        ical:location
+        <http://www.w3.org/2000/01/rdf-schema#comment>
+        flow:assignee );
+         flow:stateStore <state.n3> .
+    
+    <tracker.n3>     <http://www.w3.org/2000/01/rdf-schema#comment> """This file defines a tracker for requests.
+    """;
+         <http://www.w3.org/2000/01/rdf-schema#label> "A tracker definition file for requests" .
+    

package/dist/ecosystem-roadmap.ttl

@@ -0,0 +1,78 @@
+@prefix : <#>.
+@prefix dc: <http://purl.org/dc/elements/1.1/>.
+@prefix dct: <http://purl.org/dc/terms/>.
+@prefix foaf: <http://xmlns.com/foaf/0.1/>.
+@prefix owl: <http://www.w3.org/2002/07/owl#>.
+@prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#>.
+@prefix ui: <http://www.w3.org/ns/ui#>.
+@prefix wf: <http://www.w3.org/2005/01/wf/flow#>.
+@prefix xsd: <http://www.w3.org/2001/XMLSchema#>.
+@prefix c: </profile/card#>.
+
+:Classification
+    rdfs:label "Category";
+    owl:disjointUnionOf
+    ( :Specification :Tests :Servers :Clients :DeveloperTools :Vertical ).
+:Clients
+    rdfs:comment "Client side frameworks, SDKs and operating systems";
+    rdfs:label "Clients";
+    rdfs:subClassOf :Classification.
+:DeveloperTools rdfs:label "Developer tools"; rdfs:subClassOf :Classification.
+
+:InProgress
+    rdfs:label "In progress";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#f9ee71"^^xsd:color.
+:NextSession
+    rdfs:label "To be done this month";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#91fdb9"^^xsd:color.
+:Released
+    rdfs:label "Released";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e2a7fb"^^xsd:color.
+:Research
+    rdfs:label "Research";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#ffffff"^^xsd:color.
+:Servers
+rdfs:label "Solid Server implementations"; rdfs:subClassOf :Classification.
+:Someday
+    rdfs:label "Someday pile";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e3e3e3"^^xsd:color.
+:Specification
+rdfs:label "Parts of the Solid specification"; rdfs:subClassOf :Classification.
+:States
+    rdfs:label "Task";
+    owl:disjointUnionOf
+    ( :Research :Someday :ToBeDone :NextSession :InProgress :Works :Released ).
+:Tests rdfs:label "Test suites"; rdfs:subClassOf :Classification.
+
+:this
+    a wf:Tracker;
+    dc:author c:me;
+    dc:created "2020-07-21T14:00:20Z"^^xsd:dateTime;
+    dct:title "Solid Ecosystem: Roadmap";
+    wf:assigneeClass foaf:Person;
+    wf:defaultView :Classification;
+    wf:description
+        """A roadmap for the whole Solid ecosystem.
+See also other linked roadmaps for parts of the ecosystem like the SolidOS, Spec, open source projects, etc.
+
+
+""";
+    wf:initialState :Someday;
+    wf:issueCategory :Classification;
+    wf:issueClass :States;
+    wf:stateStore <state.ttl>.
+:ToBeDone
+    rdfs:label "To Be Done";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e0ffeb"^^xsd:color.
+:Vertical rdfs:label "Apps and Verticals"; rdfs:subClassOf :Classification.
+
+:Works
+    rdfs:label "Code runs";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#dcdbff"^^xsd:color.

package/dist/state.n3

@@ -0,0 +1,67 @@
+
+
+@prefix dc: <http://purl.org/dc/terms/> .
+@prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .
+    @prefix con: <http://www.w3.org/2000/10/swap/pim/contact#> .
+    @prefix dc: <http://purl.org/dc/elements/1.1/>.
+    @prefix doap: <http://usefulinc.com/ns/doap#> .
+    @prefix wf: <http://www.w3.org/2005/01/wf/flow#> .
+    @prefix ical: <http://www.w3.org/2002/12/cal/ical#> .
+    @prefix owl: <http://www.w3.org/2002/07/owl#> .
+    @prefix ui: <http://www.w3.org/ns/ui#> .
+    @prefix dct: <http://purl.org/dc/terms/> .
+
+@prefix : <big-tracker.ttl#> . # the config file
+
+    <#Task1> wf:tracker :this ;
+        dc:title "Test task 1";
+        a :New , :Action;
+        dct:created 2004-08-21;
+        ical:location "London";
+        wf:dateReceived 2000-01-12;
+        wf:earliestDate 1999-12-12;
+        wf:latestDate 2001-12-12;
+
+        wf:description "Yadda Tadda yadda ";
+        rdfs:comment "This is a comment".
+
+    <#Task2> wf:tracker :this ;
+        dc:title "Test task 2";
+        a :Accepted , :Action;
+        dct:created 2004-06-21;
+        ical:location "London";
+        wf:dateReceived 2000-01-12;
+        wf:earliestDate 1999-12-12;
+        wf:latestDate 2001-12-12;
+
+        wf:description "Yadda Tadda yadda ";
+        rdfs:comment "This is a comment".
+
+    <#Task3> wf:tracker :this ;
+        dc:title "Test task 3";
+        a :New , :Book;
+        dct:created 2004-04-21;
+        ical:location "London";
+        wf:dateReceived 2000-01-12;
+        wf:earliestDate 1999-12-12;
+        wf:latestDate 2001-12-12;
+
+        wf:description "Yadda Tadda yadda ";
+        rdfs:comment "This is a comment".
+
+    <#Task4> wf:tracker :this ;
+        dc:title "Test task 4";
+        a :Accepted , :Book;
+        dct:created 2004-09-21;
+        ical:location "London";
+        wf:dateReceived 2000-01-12;
+        wf:earliestDate 1999-12-12;
+        wf:latestDate 2001-12-12;
+
+        wf:description "Yadda Tadda yadda ";
+        rdfs:comment "This is a comment".
+
+
+
+# ENDS
+

package/issuePane.js

@@ -1,4 +1,4 @@
-/*   Issue Tracker Pane
+  /*   Issue Tracker Pane
  **
  **  This solid view allows a user to interact with an issue tracker, or individual issue,
  ** to change its state according to an ontology, comment on it, etc.
@@ -11,6 +11,7 @@ import { board } from './board' // @@ will later be in solid-UI
 import { renderIssue, renderIssueCard, getState, exposeOverlay } from './issue'
 import { newTrackerButton } from './newTracker'
 import { newIssueForm } from './newIssue'
+import { csvButton } from './csvButton'
 import { trackerSettingsFormText } from './trackerSettingsForm.js'
 // import { trackerInstancesFormText } from './trackerInstancesForm.js'
 
@@ -355,6 +356,7 @@ export default {
     }
     function renderSettings (tracker) {
       const settingsDiv = dom.createElement('div')
+      settingsDiv.appendChild(csvButton(dom, tracker)) // Button to copy the tracker as a CSV file
       const states = kb.any(tracker, ns.wf('issueClass'))
       const views = [tableView, states] // Possible default views
         .concat(kb.each(tracker, ns.wf('issueCategory')))

package/package.json

@@ -1,15 +1,16 @@
 {
   "name": "issue-pane",
-  "version": "2.4.20",
+  "version": "2.5.0",
   "description": "Solid-compatible Panes: issue editor",
   "main": "./issuePane.js",
   "scripts": {
     "build": "echo nothing to build",
     "lint": "eslint '*.js'",
     "lint-fix": "eslint '*.js' --fix",
+    "start": "webpack serve --config webpack.dev.config.js --open",
     "test": "npm run lint",
-    "ignore:prepublishOnly": "npm test",
-    "ignore:postpublish": "git push origin main --follow-tags"
+    "prepublishOnly": "npm test",
+    "postpublish": "git push origin main --follow-tags"
   },
   "repository": {
     "type": "git",
@@ -40,11 +41,16 @@
     "@eslint/compat": "^1.2.6",
     "@eslint/eslintrc": "^3.2.0",
     "@eslint/js": "^9.19.0",
+    "babel-loader": "^10.0.0",
     "eslint": "^9.19.0",
     "eslint-plugin-import": "^2.31.0",
     "globals": "^15.14.0",
+    "html-webpack-plugin": "^5.6.3",
     "husky": "^9.1.7",
-    "lint-staged": "^15.4.3"
+    "lint-staged": "^15.4.3",
+    "node-polyfill-webpack-plugin": "^4.1.0",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^4.15.2"
   },
   "husky": {
     "hooks": {

package/test/big-tracker.ttl

@@ -0,0 +1,238 @@
+#Processed by Id
+        #    using base file:///Users/timbl_1/src/github.com/solidos/solidos/workspaces/issue-pane/test/big-tracker-config.ttl
+             @prefix : <tracker.n3#> .
+    @prefix ca: <https://olarkin.inrupt.net/profile/card#> .
+    @prefix con: <http://www.w3.org/2000/10/swap/pim/contact#> .
+    @prefix doap: <http://usefulinc.com/ns/doap#> .
+    @prefix flow: <http://www.w3.org/2005/01/wf/flow#> .
+    @prefix ical: <http://www.w3.org/2002/12/cal/ical#> .
+    @prefix owl: <http://www.w3.org/2002/07/owl#> .
+    @prefix ui: <http://www.w3.org/ns/ui#> .
+    
+    :Accepted     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Will go ahead. We are working on this";
+         <http://www.w3.org/2000/01/rdf-schema#label> "Accepted, in progress";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 50 .
+    
+    :Action     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "action";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeeeff";
+         ui:sortOrder 80 .
+    
+    :AttendConference     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "attend conference";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#fcfce8";
+         ui:sortOrder 50 .
+        
+    :Book     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "book";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeffee";
+         ui:sortOrder 70 .
+    
+    :CommercialSpeaking     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "commercial speaking";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#ffcbad";
+         ui:sortOrder 30 .
+    
+    :Declined     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Declined";
+         <http://www.w3.org/2000/01/rdf-schema#label> "declined";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 30 .
+    
+    :Discussing     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Being discussed";
+         <http://www.w3.org/2000/01/rdf-schema#label> "in discussion";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 80 .
+    
+    :Done     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Completed.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "done";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 20 .
+    
+    :Film     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "film";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeffff";
+         ui:sortOrder 80 .
+    
+    :HonoraryDegree     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "honorary degree";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#ffa8ab";
+         ui:sortOrder 40 .
+        
+    :Meeting     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "meeting request";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#e8e8ff";
+         ui:sortOrder 60 .
+    
+    :MotherIssue     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "Request";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Task;
+         owl:disjointUnionOf  (
+        :New
+        :Discussing
+        :Pending
+        :Negotiating
+        :Accepted
+        :Urgent
+        :ToBeDeclined
+        :Watchlist
+        :Declined
+        :Obsolete
+        :Done ) .
+    
+    :Negotiating     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Being negotiated";
+         <http://www.w3.org/2000/01/rdf-schema#label> "negotiating";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 60 .
+    
+    :New     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> """Has not been looked at.
+    This is the initial state normally when an issue is created.""";
+         <http://www.w3.org/2000/01/rdf-schema#label> "new";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 90 .
+    
+    :NonProfitSpeaking     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "non-profit speaking";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#fffed0";
+         ui:sortOrder 20 .
+        
+    :Obsolete     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Overtaken by time or events.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "obsolete/missed";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Closed,
+                :MotherIssue;
+         ui:sortOrder 10 .
+
+
+    :OtherRequest     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "other";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#eeeeee";
+         ui:sortOrder 90 .
+    
+    :Pending     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Waiting for someone else's input.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "pending others";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 75 .
+    
+    :PressRequest     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#label> "press";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> :RequestCategory;
+         ui:backgroundColor "#dccdfc";
+         ui:sortOrder 10 .
+        
+    :RequestCategory     <http://www.w3.org/2000/01/rdf-schema#label> "category";
+         owl:disjointUnionOf  (
+        :PressRequest
+        :NonProfitSpeaking
+        :CommercialSpeaking
+        :HonoraryDegree
+        :AttendConference
+        :Meeting
+        :Book
+        :Film
+        :Action
+        :OtherRequest ) .
+    
+    :RequestExtrasForm     a ui:Form,
+                ui:Group;
+         <http://purl.org/dc/elements/1.1/title> "Extra  details of a request";
+         ui:parts  (
+         [
+                 a ui:Heading;
+                 ui:contents "Details:"@en;
+                 ui:sequence 10 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:earliestDate;
+                 ui:sequence 20 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:latestDate;
+                 ui:sequence 40 ]
+         [
+                 a ui:Comment;
+                 ui:contents "The earliest and latest dates are the window for the event, or both the same if fixed."@en;
+                 ui:sequence 60;
+                 ui:style "background-color: #ffe;" ]
+         [
+                 a ui:SingleLineTextField;
+                 ui:property ical:location;
+                 ui:seuqence 70;
+                 ui:size 30 ]
+         [
+                 a ui:DateField;
+                 ui:property flow:dateReceived;
+                 ui:sequence 80 ]
+         [
+                 a ui:MultiLineTextField;
+                 ui:property <http://www.w3.org/2000/01/rdf-schema#comment>;
+                 ui:sequence 90 ] ) .
+    
+        
+    :ToBeDeclined     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "To be declined";
+         <http://www.w3.org/2000/01/rdf-schema#label> "to be declined";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 40 .
+    
+    :Urgent     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "Needs urgent attention";
+         <http://www.w3.org/2000/01/rdf-schema#label> "URGENT";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 55 .
+        
+    :Watchlist     a <http://www.w3.org/2000/01/rdf-schema#Class>;
+         <http://www.w3.org/2000/01/rdf-schema#comment> "We will keep this in mind.";
+         <http://www.w3.org/2000/01/rdf-schema#label> "watch list";
+         <http://www.w3.org/2000/01/rdf-schema#subClassOf> flow:Open,
+                :MotherIssue;
+         ui:sortOrder 35 .
+    
+    :this     a flow:Tracker;
+         <http://purl.org/dc/terms/title> "The Big Request Tracker";
+         <http://www.w3.org/2000/01/rdf-schema#label> "Request Tracker";
+         flow:allowSubIssues :false;
+         flow:assigneeClass <http://xmlns.com/foaf/0.1/Person>;
+         flow:defaultView flow:TableView;
+         flow:description "Requests";
+         flow:extrasEntryForm :RequestExtrasForm;
+         flow:initialState :New;
+         flow:issueCategory :RequestCategory;
+         flow:issueClass :MotherIssue;
+         flow:propertyList  (
+        flow:earliestDate
+        flow:latestDate
+        ical:location
+        <http://www.w3.org/2000/01/rdf-schema#comment>
+        flow:assignee );
+         flow:stateStore <state.n3> .
+    
+    <tracker.n3>     <http://www.w3.org/2000/01/rdf-schema#comment> """This file defines a tracker for requests.
+    """;
+         <http://www.w3.org/2000/01/rdf-schema#label> "A tracker definition file for requests" .
+    

package/test/ecosystem-roadmap.ttl

@@ -0,0 +1,78 @@
+@prefix : <#>.
+@prefix dc: <http://purl.org/dc/elements/1.1/>.
+@prefix dct: <http://purl.org/dc/terms/>.
+@prefix foaf: <http://xmlns.com/foaf/0.1/>.
+@prefix owl: <http://www.w3.org/2002/07/owl#>.
+@prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#>.
+@prefix ui: <http://www.w3.org/ns/ui#>.
+@prefix wf: <http://www.w3.org/2005/01/wf/flow#>.
+@prefix xsd: <http://www.w3.org/2001/XMLSchema#>.
+@prefix c: </profile/card#>.
+
+:Classification
+    rdfs:label "Category";
+    owl:disjointUnionOf
+    ( :Specification :Tests :Servers :Clients :DeveloperTools :Vertical ).
+:Clients
+    rdfs:comment "Client side frameworks, SDKs and operating systems";
+    rdfs:label "Clients";
+    rdfs:subClassOf :Classification.
+:DeveloperTools rdfs:label "Developer tools"; rdfs:subClassOf :Classification.
+
+:InProgress
+    rdfs:label "In progress";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#f9ee71"^^xsd:color.
+:NextSession
+    rdfs:label "To be done this month";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#91fdb9"^^xsd:color.
+:Released
+    rdfs:label "Released";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e2a7fb"^^xsd:color.
+:Research
+    rdfs:label "Research";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#ffffff"^^xsd:color.
+:Servers
+rdfs:label "Solid Server implementations"; rdfs:subClassOf :Classification.
+:Someday
+    rdfs:label "Someday pile";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e3e3e3"^^xsd:color.
+:Specification
+rdfs:label "Parts of the Solid specification"; rdfs:subClassOf :Classification.
+:States
+    rdfs:label "Task";
+    owl:disjointUnionOf
+    ( :Research :Someday :ToBeDone :NextSession :InProgress :Works :Released ).
+:Tests rdfs:label "Test suites"; rdfs:subClassOf :Classification.
+
+:this
+    a wf:Tracker;
+    dc:author c:me;
+    dc:created "2020-07-21T14:00:20Z"^^xsd:dateTime;
+    dct:title "Solid Ecosystem: Roadmap";
+    wf:assigneeClass foaf:Person;
+    wf:defaultView :Classification;
+    wf:description
+        """A roadmap for the whole Solid ecosystem.
+See also other linked roadmaps for parts of the ecosystem like the SolidOS, Spec, open source projects, etc.
+
+
+""";
+    wf:initialState :Someday;
+    wf:issueCategory :Classification;
+    wf:issueClass :States;
+    wf:stateStore <state.ttl>.
+:ToBeDone
+    rdfs:label "To Be Done";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#e0ffeb"^^xsd:color.
+:Vertical rdfs:label "Apps and Verticals"; rdfs:subClassOf :Classification.
+
+:Works
+    rdfs:label "Code runs";
+    rdfs:subClassOf wf:Open, :States;
+    ui:backgroundColor "#dcdbff"^^xsd:color.

package/webpack.dev.config.js

@@ -0,0 +1,36 @@
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
+
+module.exports = [
+  {
+    mode: "development",
+    entry: ["./dev/index.js"], // was .ts
+    plugins: [
+      new HtmlWebpackPlugin({ template: "./dev/index.html" }),
+      new NodePolyfillPlugin()
+    ],
+    module: {
+      rules: [
+        {
+          test: /\.(js|ts)$/,
+          exclude: /node_modules/,
+          use: ["babel-loader"],
+        },
+
+        {
+          test: /\.ttl$/, // Target text  files
+          type: 'asset/source', // Load the file's content as a string
+        },
+  
+      ],
+    },
+    resolve: {
+      extensions: ["*", ".js", ".ts"]
+    },
+
+    devServer: {
+      static: './dist'
+    },
+    devtool: "source-map",
+  },
+];