From 2b9093184aaa47a332019caa65128bb2be01c725 Mon Sep 17 00:00:00 2001 From: Raj Nandan Sharma Date: Fri, 28 Mar 2025 20:34:19 +0530 Subject: [PATCH] feat: add support for Markdown language in events and enhance SEO documentation as requested in #359 --- docs/seo.md | 12 ++- package-lock.json | 82 ++++++++++++++++++- package.json | 1 + src/kener.css | 7 ++ src/lib/components/IncidentNew.svelte | 7 +- .../manage/(app)/app/events/+page.svelte | 71 +++++++++++++--- vite.config.js | 3 +- 7 files changed, 166 insertions(+), 17 deletions(-) diff --git a/docs/seo.md b/docs/seo.md index b72db760..63707cc4 100644 --- a/docs/seo.md +++ b/docs/seo.md @@ -21,7 +21,17 @@ Add API key of your Amplitude account ### Mixpanel -Add token of your Mixpanel account. +Add project token of your Mixpanel account. + +### Plausible + +- Add domain of your Plausible account. Example: `example.com` +- Add API key of your Plausible account. Default is `https://plausible.io/api/event` +- Add Script Source of your Plausible account. Default is `https://plausible.io/js/script.pageview-props.tagged-events.js` + +### Microsoft Clarity + +Add Project ID of your Microsoft Clarity account. ## Search Engine Optimization diff --git a/package-lock.json b/package-lock.json index 230ad424..abacc6cb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,17 +1,18 @@ { "name": "kener", - "version": "3.2.5", + "version": "3.2.10", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "kener", - "version": "3.2.5", + "version": "3.2.10", "license": "MIT", "dependencies": { "@babel/runtime": "^7.26.10", "@codemirror/lang-javascript": "^6.2.3", "@codemirror/lang-json": "^6.0.1", + "@codemirror/lang-markdown": "^6.3.2", "@formkit/auto-animate": "^0.8.2", "@number-flow/svelte": "^0.2.1", "@scalar/express-api-reference": "^0.4.167", @@ -218,6 +219,36 @@ "@lezer/common": "^1.1.0" } }, + "node_modules/@codemirror/lang-css": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/@codemirror/lang-css/-/lang-css-6.3.1.tgz", + "integrity": "sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.0.0", + "@codemirror/language": "^6.0.0", + "@codemirror/state": "^6.0.0", + "@lezer/common": "^1.0.2", + "@lezer/css": "^1.1.7" + } + }, + "node_modules/@codemirror/lang-html": { + "version": "6.4.9", + "resolved": "https://registry.npmjs.org/@codemirror/lang-html/-/lang-html-6.4.9.tgz", + "integrity": "sha512-aQv37pIMSlueybId/2PVSP6NPnmurFDVmZwzc7jszd2KAF8qd4VBbvNYPXWQq90WIARjsdVkPbw29pszmHws3Q==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.0.0", + "@codemirror/lang-css": "^6.0.0", + "@codemirror/lang-javascript": "^6.0.0", + "@codemirror/language": "^6.4.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.17.0", + "@lezer/common": "^1.0.0", + "@lezer/css": "^1.1.0", + "@lezer/html": "^1.3.0" + } + }, "node_modules/@codemirror/lang-javascript": { "version": "6.2.3", "resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-6.2.3.tgz", @@ -243,6 +274,21 @@ "@lezer/json": "^1.0.0" } }, + "node_modules/@codemirror/lang-markdown": { + "version": "6.3.2", + "resolved": "https://registry.npmjs.org/@codemirror/lang-markdown/-/lang-markdown-6.3.2.tgz", + "integrity": "sha512-c/5MYinGbFxYl4itE9q/rgN/sMTjOr8XL5OWnC+EaRMLfCbVUmmubTJfdgpfcSS2SCaT7b+Q+xi3l6CgoE+BsA==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.7.1", + "@codemirror/lang-html": "^6.0.0", + "@codemirror/language": "^6.3.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.0.0", + "@lezer/common": "^1.2.1", + "@lezer/markdown": "^1.0.0" + } + }, "node_modules/@codemirror/language": { "version": "6.11.0", "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.11.0.tgz", @@ -852,6 +898,17 @@ "integrity": "sha512-w7ojc8ejBqr2REPsWxJjrMFsA/ysDCFICn8zEOR9mrqzOu2amhITYuLD8ag6XZf0CFXDrhKqw7+tW8cX66NaDA==", "license": "MIT" }, + "node_modules/@lezer/css": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/@lezer/css/-/css-1.1.11.tgz", + "integrity": "sha512-FuAnusbLBl1SEAtfN8NdShxYJiESKw9LAFysfea1T96jD3ydBn12oYjaSG1a04BQRIUd93/0D8e5CV1cUMkmQg==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.2.0", + "@lezer/highlight": "^1.0.0", + "@lezer/lr": "^1.0.0" + } + }, "node_modules/@lezer/highlight": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.1.tgz", @@ -861,6 +918,17 @@ "@lezer/common": "^1.0.0" } }, + "node_modules/@lezer/html": { + "version": "1.3.10", + "resolved": "https://registry.npmjs.org/@lezer/html/-/html-1.3.10.tgz", + "integrity": "sha512-dqpT8nISx/p9Do3AchvYGV3qYc4/rKr3IBZxlHmpIKam56P47RSHkSF5f13Vu9hebS1jM0HmtJIwLbWz1VIY6w==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.2.0", + "@lezer/highlight": "^1.0.0", + "@lezer/lr": "^1.0.0" + } + }, "node_modules/@lezer/javascript": { "version": "1.4.21", "resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-1.4.21.tgz", @@ -892,6 +960,16 @@ "@lezer/common": "^1.0.0" } }, + "node_modules/@lezer/markdown": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@lezer/markdown/-/markdown-1.4.2.tgz", + "integrity": "sha512-iYewCigG/517D0xJPQd7RGaCjZAFwROiH8T9h7OTtz0bRVtkxzFhGBFJ9JGKgBBs4uuo1cvxzyQ5iKhDLMcLUQ==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.0.0", + "@lezer/highlight": "^1.0.0" + } + }, "node_modules/@mapbox/node-pre-gyp": { "version": "1.0.11", "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.11.tgz", diff --git a/package.json b/package.json index 4ea42b0c..a3b64e2e 100644 --- a/package.json +++ b/package.json @@ -70,6 +70,7 @@ "@babel/runtime": "^7.26.10", "@codemirror/lang-javascript": "^6.2.3", "@codemirror/lang-json": "^6.0.1", + "@codemirror/lang-markdown": "^6.3.2", "@formkit/auto-animate": "^0.8.2", "@number-flow/svelte": "^0.2.1", "@scalar/express-api-reference": "^0.4.167", diff --git a/src/kener.css b/src/kener.css index c4450139..6d7b7c12 100644 --- a/src/kener.css +++ b/src/kener.css @@ -939,3 +939,10 @@ textarea::placeholder { .dark .like-input { background-color: rgba(0, 0, 0, 0.1) !important; } +.ͼo .cm-gutters { + border-top-left-radius: var(--radius); + border-bottom-left-radius: var(--radius); +} +.no-gutter .ͼo .cm-gutters { + display: none; +} diff --git a/src/lib/components/IncidentNew.svelte b/src/lib/components/IncidentNew.svelte index 683841da..8a409fcc 100644 --- a/src/lib/components/IncidentNew.svelte +++ b/src/lib/components/IncidentNew.svelte @@ -10,6 +10,7 @@ import { Tooltip } from "bits-ui"; import GMI from "$lib/components/gmi.svelte"; import { page } from "$app/stores"; + import { marked } from "marked"; export let incident; export let index; export let lang; @@ -189,7 +190,11 @@
- {@html comment.comment} +
+ {@html marked.parse(comment.comment)} +
{/each} diff --git a/src/routes/(manage)/manage/(app)/app/events/+page.svelte b/src/routes/(manage)/manage/(app)/app/events/+page.svelte index d02618b2..4782bed6 100644 --- a/src/routes/(manage)/manage/(app)/app/events/+page.svelte +++ b/src/routes/(manage)/manage/(app)/app/events/+page.svelte @@ -27,6 +27,12 @@ import MessageSquarePlus from "lucide-svelte/icons/message-square-plus"; import ChevronRight from "lucide-svelte/icons/chevron-right"; import Trash from "lucide-svelte/icons/trash"; + import CodeMirror from "svelte-codemirror-editor"; + import { markdown } from "@codemirror/lang-markdown"; + import { marked } from "marked"; + import { githubLight, githubDark } from "@uiw/codemirror-theme-github"; + import { mode } from "mode-watcher"; + import * as Select from "$lib/components/ui/select"; export let data; let status = "OPEN"; @@ -414,6 +420,7 @@ function setCommentEdit(c) { newComment = { ...c }; newComment.commented_at = new Date(Number(c.commented_at) * 1000); + scrollToElementInsideContainer("incident-modal", "edit-comment-box"); } $: { //broadcast a custom event named blockScroll @@ -429,6 +436,17 @@ showModal = false; window.location.hash = ""; } + function scrollToElementInsideContainer(containerId, elementId) { + const container = document.getElementById(containerId); + const element = document.getElementById(elementId); + + if (container && element) { + container.scrollTo({ + top: element.offsetTop - container.offsetTop, + behavior: "smooth" + }); + } + }
@@ -674,7 +692,7 @@ on:clickoutside={closeModal} class="absolute right-0 top-0 h-screen w-[800px] border-l bg-background p-4 shadow-xl" > -
+
{#if newIncident.id} @@ -736,11 +754,22 @@ Summary * - +
+ +
{/if} @@ -860,11 +889,22 @@ />
- +
+ +
@@ -913,7 +953,14 @@ {#each comments as comment}
-

{@html comment.comment}

+
+
+ {@html marked.parse(comment.comment)} +
+
+
{#if currentIncident.incident_type == "INCIDENT"} diff --git a/vite.config.js b/vite.config.js index 5662f1b4..44c2da51 100644 --- a/vite.config.js +++ b/vite.config.js @@ -18,7 +18,8 @@ export default defineConfig(({ mode }) => ({ "codemirror", "@codemirror/language-javascript", "@uiw/codemirror-theme-github", - "@codemirror/language-json" /* ... */, + "@codemirror/language-json", + "@codemirror/language-markdown", ], }, plugins: [