feat: add support for Jinja templates (#60)

jorgehermo9 · Dec 24, 2024 · 7793bab · 7793bab
1 parent f6e1efd
commit 7793bab
Show file tree

Hide file tree

Showing 32 changed files with 946 additions and 237 deletions.
diff --git a/crates/web/frontend/package-lock.json b/crates/web/frontend/package-lock.json
diff --git a/crates/web/frontend/package.json b/crates/web/frontend/package.json
@@ -14,6 +14,7 @@
     "@codemirror/autocomplete": "^6.18.1",
     "@codemirror/lang-json": "^6.0.1",
     "@codemirror/lang-yaml": "^6.1.1",
+    "@codemirror/legacy-modes": "^6.4.2",
     "@monaco-editor/react": "^4.6.0",
     "@radix-ui/react-accordion": "^1.2.1",
     "@radix-ui/react-alert-dialog": "^1.1.2",
@@ -48,6 +49,7 @@
     "lucide-react": "^0.447.0",
     "next": "14.2.14",
     "next-themes": "^0.3.0",
+    "nunjucks": "^3.2.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-resizable-panels": "^2.1.4",
@@ -63,6 +65,7 @@
   "devDependencies": {
     "@biomejs/biome": "1.9.3",
     "@types/node": "^22.7.4",
+    "@types/nunjucks": "^3.2.6",
     "@types/react": "^18.3.11",
     "@types/react-dom": "^18.3.0",
     "autoprefixer": "^10.4.20",

diff --git a/crates/web/frontend/src/app/global-error.tsx b/crates/web/frontend/src/app/global-error.tsx
@@ -5,7 +5,7 @@ import { cn } from "@/lib/utils";
 import { Fira_Mono, Montserrat } from "next/font/google";
 import { useEffect } from "react";
 import "./globals.css";
-import { deleteDatabase } from "@/services/queries/query-service";
+import { deleteDatabase } from "@/services/history/history-service";
 
 const montserrat = Montserrat({ subsets: ["latin"], variable: "--font-sans" });
 const firaCode = Fira_Mono({

diff --git a/crates/web/frontend/src/app/globals.css b/crates/web/frontend/src/app/globals.css
@@ -28,7 +28,7 @@
 		--background: #10151d;
 		--foreground: #e1e5ec;
 		--accent: #959efd;
-		--accent-subtle: #626da7;
+		--accent-subtle: #7d89c0;
 		--accent-background: #2e3c51;
 		--muted: #222b37;
 
@@ -106,3 +106,7 @@ h4 {
 p {
 	@apply text-xs;
 }
+
+.cm-editor {
+	outline: none !important;
+}
diff --git a/crates/web/frontend/src/app/page-utils.ts b/crates/web/frontend/src/app/page-utils.ts
@@ -2,8 +2,9 @@ import { notify } from "@/lib/notify";
 import type { Completion } from "@/model/completion";
 import { Data } from "@/model/data";
 import FileType from "@/model/file-type";
-import { getShare } from "@/services/shares/share-service";
+import { getShare } from "@/services/share/share-service";
 import type { CompletionContext, CompletionSource } from "@codemirror/autocomplete";
+import nunjucks from "nunjucks";
 import type PromiseWorker from "webworker-promise";
 
 export const applyGq = async (
@@ -24,6 +25,18 @@ export const applyGq = async (
 	return result;
 };
 
+export const applyTemplate = async (
+	inputContent: string,
+	inputType: FileType,
+	jinjaContent: string,
+	silent = true,
+): Promise<string> => {
+	const input = { data: JSON.parse(inputContent) };
+	const result = nunjucks.renderString(jinjaContent, input);
+	!silent && notify.success(`Template applied to ${inputType.toUpperCase()}`);
+	return result;
+};
+
 const triggerBlacklist = new Set<string>(["{", ":", " "]);
 
 export const getQueryCompletionSource = (