How to use the solid-ui.icons.iconBase function in solid-ui

.catch((err: any) => {
                var str = 'Unable to delete ' + subject + ': ' + err
                console.log(str)
                alert(str)
              })
          }
        )
        deleteButton.style = 'height: 2em;'
        deleteButton.class = '' // Remove hover hide
        deleteCell.appendChild(deleteButton)
      }

      const refreshCell = controlRow.appendChild(dom.createElement('td'))
      const refreshButton = widgets.button(
        dom,
        icons.iconBase + 'noun_479395.svg',
        'refresh'
      )
      refreshCell.appendChild(refreshButton)
      refreshButton.addEventListener('click', () => {
        // @@ TODO Remove casting of store.fetcher
        ;(store as any).fetcher.refresh(subject, function (
          // @@ TODO Remove casting
          ok: boolean,
          errm: string
        ) {
          let str
          if (ok) {
            str = 'Refreshed OK: ' + subject
          } else {
            str = 'Error refreshing: ' + subject + ': ' + errm
          }

.catch((err: any) => {
                var str = 'Unable to delete ' + subject + ': ' + err
                console.log(str)
                alert(str)
              })
          }
        )
        deleteButton.style = 'height: 2em;'
        deleteButton.class = '' // Remove hover hide
        deleteCell.appendChild(deleteButton)
      }

      const refreshCell = controlRow.appendChild(dom.createElement('td'))
      const refreshButton = widgets.button(
        dom,
        icons.iconBase + 'noun_479395.svg',
        'refresh'
      )
      refreshCell.appendChild(refreshButton)
      refreshButton.addEventListener('click', () => {
        // @@ TODO Remove casting of store.fetcher
        ;(store as any).fetcher.refresh(subject, function (
          // @@ TODO Remove casting
          ok: boolean,
          errm: string
        ) {
          let str
          if (ok) {
            str = 'Refreshed OK: ' + subject
          } else {
            str = 'Error refreshing: ' + subject + ': ' + errm
          }

import { authn, icons, ns, pad, widgets } from 'solid-ui'
// @@ TODO: serialize is not part rdflib type definitions
// Might be fixed in https://github.com/linkeddata/rdflib.js/issues/341
// @ts-ignore
import { graph, log, NamedNode, Namespace, sym, serialize, UpdateManager, Fetcher } from 'rdflib'
import { PaneDefinition } from 'pane-registry'
/*   pad Pane
 **
 */

const paneDef: PaneDefinition = {
  // icon:  (module.__dirname || __dirname) + 'images/ColourOn.png',
  icon: icons.iconBase + 'noun_79217.svg',

  name: 'pad',

  audience: [ns.solid('PowerUser')],

  // Does the subject deserve an pad pane?
  label: function (subject, context) {
    var t = context.session.store.findTypeURIs(subject)
    if (t['http://www.w3.org/ns/pim/pad#Notepad']) {
      return 'pad'
    }
    return null // No under other circumstances
  },

  mintClass: ns.pad('Notepad'),

import { authn, icons, ns, pad, widgets } from 'solid-ui'
// @@ TODO: serialize is not part rdflib type definitions
// Might be fixed in https://github.com/linkeddata/rdflib.js/issues/341
// @ts-ignore
import { graph, log, NamedNode, Namespace, sym, serialize, UpdateManager, Fetcher } from 'rdflib'
import { PaneDefinition } from 'pane-registry'
/*   pad Pane
 **
 */

const paneDef: PaneDefinition = {
  // icon:  (module.__dirname || __dirname) + 'images/ColourOn.png',
  icon: icons.iconBase + 'noun_79217.svg',

  name: 'pad',

  audience: [ns.solid('PowerUser')],

  // Does the subject deserve an pad pane?
  label: function (subject, context) {
    var t = context.session.store.findTypeURIs(subject)
    if (t['http://www.w3.org/ns/pim/pad#Notepad']) {
      return 'pad'
    }
    return null // No under other circumstances
  },

  mintClass: ns.pad('Notepad'),

if (nodeMode) {
  UI = solidUi
  panes = paneRegistry
} else { // Add to existing mashlib
  panes = (window as any).panes
  UI = panes.UI
}
*/

const thisPane: PaneDefinition = {
  // 'noun_638141.svg' not editing

  global: false,

  icon: icons.iconBase + 'noun_15059.svg', // head.  noun_492246.svg for editing

  name: 'profile',

  label: function (subject, context) {
    var t = context.session.store.findTypeURIs(subject)
    if (
      t[ns.vcard('Individual').uri] ||
      t[ns.vcard('Organization').uri] ||
      t[ns.foaf('Person').uri] ||
      t[ns.schema('Person').uri]
    ) {
      return 'Profile'
    }
    return null
  },

/*   Home Pane
 **
 ** The home pane is avaiable everywhere and allows a user
 ** to
 **  - keep track of their stuff
 **  - make new things, and possibly
 **  - keep track of accounts and workspaces etc
 **
 */

import { authn, create, icons } from 'solid-ui'
import { PaneDefinition } from 'pane-registry'

const HomePaneSource: PaneDefinition = {
  icon: icons.iconBase + 'noun_547570.svg', // noun_25830

  global: true,

  name: 'home',

  // Does the subject deserve an home pane?
  //
  //   yes, always!
  //
  label: function () {
    return 'home'
  },

  render: function (subject, context) {
    const dom = context.dom
    var showContent = async function () {

import { NamedNode } from 'rdflib'

import { getLabel, paneDiv } from './profilePaneUtils'

import preferencesFormText from './preferencesFormText.ttl'
import { PaneDefinition } from 'pane-registry'

const highlightColor = style.highlightColor || '#7C4DFF'

const thisPane: PaneDefinition = {
  // 'noun_638141.svg' not editing

  global: true,

  icon: icons.iconBase + 'noun_492246.svg', // noun_492246.svg for editing

  name: 'editProfile', // not confuse with 'profile'

  label: function (subject, context) {
    return getLabel(subject, context.session.store, ns)
  },
  render: function (subject, context) {
    const dom = context.dom
    const store = context.session.store
    function complainIfBad (ok: Boolean, mess: any) {
      if (ok) return
      div.appendChild(widgets.errorMessageBlock(dom, mess, '#fee'))
    }

    function renderProfileForm (div: HTMLElement, subject: NamedNode) {
      const preferencesForm = store.sym(

import { authn, icons, ns, widgets } from 'solid-ui'
import { NamedNode, parse, IndexedFormula } from 'rdflib'
import { renderTrustedApplicationsOptions } from './trustedApplications/trustedApplicationsPane'

import preferencesFormText from './preferencesFormText.ttl'
import ontologyData from './ontologyData.ttl'
import { PaneDefinition } from 'pane-registry'

export const basicPreferencesPane: PaneDefinition = {
  icon: icons.iconBase + 'noun_Sliders_341315_000000.svg',
  name: 'basicPreferences',
  label: _subject => {
    return null
  },

  // Render the pane
  // The subject should be the logged in user.
  render: (subject, context) => {
    const dom = context.dom
    const store = context.session.store

    function complainIfBad (ok: Boolean, mess: any) {
      if (ok) return
      container.appendChild(widgets.errorMessageBlock(dom, mess, '#fee'))
    }

import { SolidSession } from '../types'
import { authn, icons, store } from 'solid-ui'
import { NamedNode, sym } from 'rdflib'
import { generateHomepage } from './homepage'
import { DataBrowserContext, PaneDefinition } from 'pane-registry'

export const dashboardPane: PaneDefinition = {
  icon: icons.iconBase + 'noun_547570.svg',
  name: 'dashboard',
  label: subject => {
    if (subject.uri === subject.site().uri) {
      return 'Dashboard'
    }
    return null
  },
  render: (subject, context) => {
    const dom = context.dom
    const container = dom.createElement('div')
    authn.solidAuthClient.trackSession(async (session: SolidSession) => {
      container.innerHTML = ''
      buildPage(
        container,
        session ? sym(session.webId) : null,
        context,

import { SolidSession } from '../types'
import { authn, icons, store } from 'solid-ui'
import { NamedNode, sym } from 'rdflib'
import { generateHomepage } from './homepage'
import { DataBrowserContext, PaneDefinition } from 'pane-registry'

export const dashboardPaneSource: PaneDefinition = {
  icon: icons.iconBase + 'noun_547570.svg',
  name: 'dashboard',
  label: subject => {
    if (subject.uri === subject.site().uri) {
      return 'Dashboard'
    }
    return null
  },
  render: (subject, context) => {
    const dom = context.dom
    const container = dom.createElement('div')
    authn.solidAuthClient.trackSession(async (session: SolidSession) => {
      container.innerHTML = ''
      buildPage(
        container,
        session ? sym(session.webId) : null,
        context,