Кликабельная собственность Url в Neo4j

Question

Я хочу добавить свойство URL к узлу в Neo4J.Проблема в том, что URL не кликабелен.Есть ли способ сделать его визуализированным и кликабельным в Neo4J?

Answer 1

Я отвечу на вопрос, предполагая, что вы говорите о Neo4j Dashboard. Пользовательские стили, которые они в настоящее время предоставляют, применяются к компоненту графа, который включает узлы и отношения: Стиль травы

Не указано значение свойства в строке свойств ниже.

Я вижу 2 способа достижения этого:

First

Если это для большей аудитории, правильным способом было бы отредактировать код Neo4j browser , чтобы внести эти изменения. Браузер на самом деле сделан с использованием React. Как только вы выясните, какой компонент и код фактически отображают свойства узла, вы можете отредактировать его так, чтобы URL отображался как ссылка.

Шаг1: Используя элемент inspect, чтобы найти классы строки состояния свойств, я смог сузить код, который обрабатывал это. В вашем случае файл был: inspector.jsx и компонент, который мы ищем: StyledInspectorFooterRowListPair . Это можно выяснить из элемента inspect.

Шаг2: Мы видим, что StyledInspectorFooterRowListPair использует mapItemProperties для визуализации пары ключ-значение. Поэтому изменение этого метода решает проблему.

const mapItemProperties = itemProperties =>
  itemProperties
    .sort(
      ({ key: keyA }, { key: keyB }) =>
        keyA < keyB ? -1 : keyA === keyB ? 0 : 1
    )
    .map((prop, i) => (
      <StyledInspectorFooterRowListPair className='pair' key={'prop' + i}>
        <StyledInspectorFooterRowListKey className='key'>
          {prop.key + ': '}
        </StyledInspectorFooterRowListKey>
        <StyledInspectorFooterRowListValue className='value'>
         { prop.key =="link"
            ? <a href={optionalToString(prop.value)}>{optionalToString(prop.value)}</a>
            : optionalToString(prop.value)
         }
        </StyledInspectorFooterRowListValue>
      </StyledInspectorFooterRowListPair>
    ))

Код, упомянутый ниже, фактически отвечает за отображение элемента link, если имя свойства узла - "link". Вы можете использовать любую другую логику, которая вам нравится. Это пример.

{ prop.key =="link"
  ? <a href={optionalToString(prop.value)}> {optionalToString(prop.value)} 
    </a>
  : optionalToString(prop.value)
}

Step3 Используйте шаги, указанные в репозитории, чтобы запустить проект.

Второй

Если это только для вас, вы можете создать простое расширение для браузера, которое изменит эти свойства на ссылки.