Add BFL language definition and do syntax highlighting based on that

ui/package.json

@@ -13,7 +13,7 @@
     "@types/node": "^12.20.10",
     "@types/react": "^17.0.3",
     "@types/react-dom": "^17.0.3",
-    "@uiw/react-textarea-code-editor": "^1.4.12",
+    "@uiw/react-textarea-code-editor": "file:/home/mertyildiran/Downloads/react-textarea-code-editor",
     "axios": "^0.21.1",
     "highlight.js": "^11.3.1",
     "json-beautify": "^1.1.1",

ui/src/components/Filters.tsx

@@ -7,6 +7,7 @@ import {SyntaxHighlighter} from "./UI/SyntaxHighlighter/index";
 import filterUIExample1 from "./assets/filter-ui-example-1.png"
 import filterUIExample2 from "./assets/filter-ui-example-2.png"
 import variables from '../variables.module.scss';
+import bfl from '../helpers/bfl.js'
 
 interface FiltersProps {
     query: string
@@ -93,7 +94,8 @@ export const QueryForm: React.FC<QueryFormProps> = ({query, setQuery, background
                     <label>
                         <CodeEditor
                             value={query}
-                            language="py"
+                            syntax={bfl}
+                            language="bfl"
                             placeholder="Mizu Filter Syntax"
                             onChange={handleChange}
                             padding={8}

ui/src/helpers/bfl.js

@@ -0,0 +1,76 @@
+// @ts-nocheck
+bfl.displayName = 'bfl'
+bfl.aliases = []
+
+/** @type {import('../core.js').Syntax} */
+export default function bfl(Prism) {
+    Prism.languages.bfl = {
+        comment: {
+            pattern: /(^|[^\\])#.*/,
+            lookbehind: true,
+            greedy: true
+        },
+        'string-interpolation': {
+            pattern:
+            /(?:f|fr|rf)(?:("""|''')[\s\S]*?\1|("|')(?:\\.|(?!\2)[^\\\r\n])*\2)/i,
+            greedy: true,
+            inside: {
+                interpolation: {
+                    // "{" <expression> <optional "!s", "!r", or "!a"> <optional ":" format specifier> "}"
+                    pattern:
+                    /((?:^|[^{])(?:\{\{)*)\{(?!\{)(?:[^{}]|\{(?!\{)(?:[^{}]|\{(?!\{)(?:[^{}])+\})+\})+\}/,
+                    lookbehind: true,
+                    inside: {
+                        'format-spec': {
+                            pattern: /(:)[^:(){}]+(?=\}$)/,
+                            lookbehind: true
+                        },
+                        'conversion-option': {
+                            pattern: /![sra](?=[:}]$)/,
+                            alias: 'punctuation'
+                        },
+                        rest: null
+                    }
+                },
+                string: /[\s\S]+/
+            }
+        },
+        'triple-quoted-string': {
+            pattern: /(?:[rub]|br|rb)?("""|''')[\s\S]*?\1/i,
+            greedy: true,
+            alias: 'string'
+        },
+        string: {
+            pattern: /(?:[rub]|br|rb)?("|')(?:\\.|(?!\1)[^\\\r\n])*\1/i,
+            greedy: true
+        },
+        function: {
+            pattern: /((?:^|\s)def[ \t]+)[a-zA-Z_]\w*(?=\s*\()/g,
+            lookbehind: true
+        },
+        'class-name': {
+            pattern: /(\bclass\s+)\w+/i,
+            lookbehind: true
+        },
+        decorator: {
+            pattern: /(^[\t ]*)@\w+(?:\.\w+)*/m,
+            lookbehind: true,
+            alias: ['annotation', 'punctuation'],
+            inside: {
+                punctuation: /\./
+            }
+        },
+        keyword:
+        /\b(?:_(?=\s*:)|and|as|assert|async|await|break|case|class|continue|def|del|elif|else|except|exec|finally|for|from|global|if|import|in|is|lambda|match|nonlocal|not|or|pass|print|raise|return|try|while|with|yield)\b/,
+        builtin:
+        /\b(?:__import__|abs|all|any|apply|ascii|basestring|bin|bool|buffer|bytearray|bytes|callable|chr|classmethod|cmp|coerce|compile|complex|delattr|dict|dir|divmod|enumerate|eval|execfile|file|filter|float|format|frozenset|getattr|globals|hasattr|hash|help|hex|id|input|int|intern|isinstance|issubclass|iter|len|list|locals|long|map|max|memoryview|min|next|object|oct|open|ord|pow|property|range|raw_input|reduce|reload|repr|reversed|round|set|setattr|slice|sorted|staticmethod|str|sum|super|tuple|type|unichr|unicode|vars|xrange|zip)\b/,
+        boolean: /\b(?:False|None|True)\b/,
+        number:
+        /\b0(?:b(?:_?[01])+|o(?:_?[0-7])+|x(?:_?[a-f0-9])+)\b|(?:\b\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\B\.\d+(?:_\d+)*)(?:e[+-]?\d+(?:_\d+)*)?j?(?!\w)/i,
+        operator: /[-+%=]=?|!=|:=|\*\*?=?|\/\/?=?|<[<=>]?|>[=>]?|[&|^~]/,
+        punctuation: /[{}[\];(),.:]/
+    }
+    Prism.languages.bfl['string-interpolation'].inside[
+        'interpolation'
+    ].inside.rest = Prism.languages.bfl
+}