Skip to content

Commit

Permalink
Rdf highlighting (#75)
Browse files Browse the repository at this point in the history
feat: add highlight to turtle syntax
  • Loading branch information
uahmed-assecor authored Dec 18, 2024
1 parent b8d633a commit 555e324
Show file tree
Hide file tree
Showing 8 changed files with 153 additions and 17 deletions.
114 changes: 114 additions & 0 deletions apps/bank/src/assets/highlightjs-turtle/turtle.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
/*
Language: Turtle
Author: Redmer KRONEMEIJER <redmer.kronemeijer@rdmr.eu>
Contributors: Mark ELLIS <mark.ellis@stardog.com>, Vladimir ALEXIEV <vladimir.alexiev@ontotext.com>
*/
function hljsDefineTurtle(hljs) {
var KEYWORDS = {
keyword: "BASE|2 PREFIX|5 @base|10 @prefix|10",
literal: "true false",
built_in: "a",
};

var IRI_LITERAL = {
className: "literal",
relevance: 1,
begin: /</,
end: />/,
};

var PN_CHARS_BASE =
"A-Za-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\u10000-\uEFFFF";
var PN_CHARS_U = PN_CHARS_BASE + "_";
var PN_CHARS = "-" + PN_CHARS_U + "0-9\u00B7\u0300-\u036F\u203F-\u2040";
var BLANK_NODE_LABEL =
"_:" + PN_CHARS_U + "0-9?";
var PN_PREFIX =
"" + PN_CHARS_BASE + "?";
var PERCENT = "%[0-9A-Fa-f][0-9A-Fa-f]";
var PN_LOCAL_ESC = "\\\\[_~.!$&'()*+,;=/?#@%-]";
var PLX = PERCENT + "|" + PN_LOCAL_ESC;
var PNAME_NS = "(" + PN_PREFIX + ")?:";
var PN_LOCAL =
"([" +
PN_CHARS_U +
":0-9]|" +
PLX +
")([" +
PN_CHARS +
".:]|" +
PLX +
")*([" +
PN_CHARS +
":]|" +
PLX +
")?";
var PNAME_LN = PNAME_NS + PN_LOCAL;
var PNAME_NS_or_LN = PNAME_NS + "(" + PN_LOCAL + ")?";

var PNAME = {
begin: PNAME_NS_or_LN,
relevance: 0,
className: "symbol",
};

var BLANK_NODE = {
begin: BLANK_NODE_LABEL,
relevance: 10,
className: "template-variable",
};

var LANGTAG = {
begin: /@[a-zA-Z]+([a-zA-Z0-9-]+)*/,
className: "type",
relevance: 0,
};

var DATATYPE = {
begin: "\\^\\^" + PNAME_LN,
className: "type",
relevance: 10,
};

var TRIPLE_APOS_STRING = {
begin: /'''/,
end: /'''/,
className: "string",
relevance: 0,
};

var TRIPLE_QUOTE_STRING = {
begin: /"""/,
end: /"""/,
className: "string",
relevance: 0,
};

var APOS_STRING_LITERAL = JSON.parse(JSON.stringify(hljs.APOS_STRING_MODE));
APOS_STRING_LITERAL.relevance = 0;

var QUOTE_STRING_LITERAL = JSON.parse(JSON.stringify(hljs.QUOTE_STRING_MODE));
QUOTE_STRING_LITERAL.relevance = 0;

return {
name: "Turtle",
case_insensitive: true,
keywords: KEYWORDS,
aliases: ["turtle", "ttl", "n3"],
contains: [
LANGTAG,
DATATYPE,
IRI_LITERAL,
BLANK_NODE,
PNAME,
TRIPLE_APOS_STRING,
TRIPLE_QUOTE_STRING,
APOS_STRING_LITERAL,
QUOTE_STRING_LITERAL,
hljs.C_NUMBER_MODE,
hljs.HASH_COMMENT_MODE,
],
};
}

module.exports = hljsDefineTurtle;
6 changes: 5 additions & 1 deletion apps/bank/src/components/BusinessDataPanel.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,11 @@ import {Store, Writer} from 'n3';
import BusinessDataPanel from "@/components/BusinessDataPanel.vue";

jest.mock('@/assets/check.svg', () => 'mocked-check-icon-path');

jest.mock('highlight.js/styles/stackoverflow-light.css', () => 'mocked-check-icon-path');
jest.mock('highlight.js/lib/core', () => ({
highlightBlock: jest.fn(),
registerLanguage: jest.fn()
}));
describe('BusinessDataPanel.vue', () => {
let store: Store;
let writer: Writer;
Expand Down
17 changes: 13 additions & 4 deletions apps/bank/src/components/BusinessDataPanel.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,15 @@
<script setup lang="ts">
import { Store, Writer } from 'n3';
import { ref } from 'vue';
import {Store, Writer} from 'n3';
import {onMounted, ref} from 'vue';
import hljs from "highlight.js/lib/core";
import hljsDefineTurtle from '../assets/highlightjs-turtle/turtle.js';
import 'highlight.js/styles/stackoverflow-light.css';
hljs.registerLanguage('turtle', hljsDefineTurtle);
onMounted(() => {
hljs.highlightBlock(document.querySelector('.turtle'));
});
const props = defineProps({
store: Store
Expand All @@ -20,8 +29,8 @@ if (props.store) {
</script>

<template>
<div class="card bg-gray-50 border-round" style="background: rgba(232, 236, 239, 0.7); padding:0.5rem">
<p class="m-0">{{ displayText }} </p>
<div class="p-1">
<pre><code ref="codeBlock" class="turtle border-round bg-gray-50">{{ displayText }}</code></pre>
</div>
<div class="success-message border-round">
<p>Looks good: Automatic processing returned positive!
Expand Down
1 change: 1 addition & 0 deletions apps/bank/src/components/DemandProcessor.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import PrimeVue from "primevue/config";
import ToastService from "primevue/toastservice";
import ConfirmationService from "primevue/confirmationservice";

jest.mock('highlight.js/styles/stackoverflow-light.css', () => 'mocked-check-icon-path');
describe('DemandProcessor.vue', () => {
it('should render DemandProcessor', async() => {
const wrapper = mount(DemandProcessor, {
Expand Down
2 changes: 1 addition & 1 deletion apps/bank/src/components/DemandProcessor.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@
</div>


<Dialog v-model:visible="isDialogVisible" modal header="Requested business assessment data" :style="{ width: '55rem' }">
<Dialog v-model:visible="isDialogVisible" modal header="Requested business assessment data" :style="{ width: '80%' }">
<div v-if="!businessDataFetched">
<Skeleton width="100%" height="300px" ></Skeleton>
<Skeleton width="100%" height="50px" class="mb-5 mt-2"></Skeleton>
Expand Down
1 change: 1 addition & 0 deletions apps/bank/src/router/accessRequestHandledCallback.spec.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import onResult from "@/router/accessRequestHandledCallback";
jest.mock('highlight.js/styles/stackoverflow-light.css', () => 'mocked-check-icon-path');

describe('accessRequestHandledCallback', () => {
it('should memorize callback uri', async () => {
Expand Down
18 changes: 14 additions & 4 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

11 changes: 4 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,25 +16,22 @@
"build": "lerna run build",
"test": "lerna run test",
"lint": "lerna run lint",

"version": "lerna version",
"prepublish": "run-s libs:build",
"publish": "lerna publish from-package",

"apps:build": "lerna run build --scope \"@apps/*\"",
"apps:lint": "lerna run lint --scope \"@apps/*\"",
"apps:test": "lerna run test --scope \"@apps/*\"",

"libs:build": "lerna run build --scope \"@datev-research/*\"",
"libs:lint": "lerna run lint --scope \"@datev-research/*\"",
"libs:test": "lerna run test --scope \"@datev-research/*\"",

"prepare": "husky"
},
"dependencies": {
"@vueuse/components": "^11.1.0",
"@vueuse/core": "^11.1.0",
"axios": "^1.7.2",
"highlight.js": "^11.9.0",
"jose": "^5.4.0",
"n3": "^1.16.2",
"primeflex": "^3.3.1",
Expand All @@ -48,8 +45,8 @@
"devDependencies": {
"@fullhuman/postcss-purgecss": "^4.0.0",
"@fullhuman/vue-cli-plugin-purgecss": "~6.0.0",
"@types/n3": "^1.10.4",
"@types/jest": "^29.0.0",
"@types/n3": "^1.10.4",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vue/cli-plugin-babel": "~5.0.0",
Expand All @@ -62,11 +59,11 @@
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"husky": "^9.1.6",
"lerna": "^8.1.9",
"jest": "^29.0.0",
"ts-jest": "^29.0.0",
"lerna": "^8.1.9",
"sass": "^1.72.0",
"sass-loader": "^16.0.2",
"ts-jest": "^29.0.0",
"typescript": "^5.4.5"
},
"workspaces": [
Expand Down

0 comments on commit 555e324

Please sign in to comment.