fix: fix highlight range

muzammil-irfan · Oct 22, 2024 · 56129e5 · 56129e5
1 parent 7535ba8
commit 56129e5
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 7 deletions.
diff --git a/src/components/artifacts/ArtifactRenderer.tsx b/src/components/artifacts/ArtifactRenderer.tsx
@@ -1,7 +1,7 @@
 import { useToast } from "@/hooks/use-toast";
 import { GraphInput } from "@/hooks/useGraph";
 import { convertToOpenAIFormat } from "@/lib/convert_messages";
-import { newlineToCarriageReturn } from "@/lib/normalize_string";
+import { emptyLineCount, newlineToCarriageReturn } from "@/lib/normalize_string";
 import { cn } from "@/lib/utils";
 import { Artifact, ProgrammingLanguageOptions, Reflections } from "@/types";
 import { EditorView } from "@codemirror/view";
@@ -39,6 +39,10 @@ interface SelectionBox {
   text: string;
 }
 
+function loadSectionContent(content:string,start:number,end:number){
+  return content.substring(start,end)
+}
+
 export function ArtifactRenderer(props: ArtifactRendererProps) {
   const { toast } = useToast();
   const editorRef = useRef<EditorView | null>(null);
@@ -215,6 +219,15 @@ export function ArtifactRenderer(props: ArtifactRendererProps) {
                   node = node.parentNode;
                 }
               }
+              const startOffset =  emptyLineCount(
+                currentArtifactContent?.content.substring(0, startIndex+1)??"",
+              )*2
+              const endOffset =  emptyLineCount(
+                currentArtifactContent?.content.substring(0,endIndex+1)??"",
+              )*2
+              console.log('startOffset',startOffset)
+              startIndex+=startOffset
+              endIndex+=endOffset
             }
 
             setSelectionIndexes({ start: startIndex, end: endIndex });
@@ -368,7 +381,7 @@ export function ArtifactRenderer(props: ArtifactRendererProps) {
             style={{
               top: `${selectionBox.top + 60}px`,
               left: `${selectionBox.left}px`,
-              width: isInputVisible ? "400px" : "250px",
+              width: isInputVisible ? "400px" : "850px",
               marginLeft: isInputVisible ? "0" : "150px",
             }}
             onMouseDown={handleSelectionBoxMouseDown}
@@ -397,14 +410,27 @@ export function ArtifactRenderer(props: ArtifactRendererProps) {
                 </Button>
               </form>
             ) : (
-              <Button
+              <div className="w-full ">
+                <div className="h-[500px]">
+                  <div>
+                    {JSON.stringify(selectionIndexes)}
+                  </div>
+                  {
+                     loadSectionContent((currentArtifactContent.content),selectionIndexes?.start??0 , selectionIndexes?.end??0)
+                  }
+                </div>
+
+                <hr />
+                 <Button
                 variant="ghost"
                 onClick={() => setIsInputVisible(true)}
                 className="transition-all duration-300 ease-in-out w-full"
               >
                 Ask Open Canvas
               </Button>
-            )}
+
+              </div>
+)}
           </div>
         )}
       </div>

diff --git a/src/lib/normalize_string.ts b/src/lib/normalize_string.ts
@@ -12,3 +12,10 @@ export const reverseCleanContent = (content: string): string => {
 export const newlineToCarriageReturn = (str: string) =>
   // str.replace(actualNewline, "\r\n");
   str.replace(actualNewline, [actualNewline, actualNewline].join(""));
+
+
+export const emptyLineCount = (content: string): number => {
+  const liens = content.split("\n");
+  return liens.filter(line => line.trim() == "").length
+};
+
diff --git a/yarn.lock b/yarn.lock
@@ -1049,7 +1049,7 @@
   dependencies:
     "@radix-ui/react-use-layout-effect" "1.1.0"
 
-"@radix-ui/react-label@^2.1.0":
+"@radix-ui/react-label@^2.0.2", "@radix-ui/react-label@^2.1.0":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-label/-/react-label-2.1.0.tgz#3aa2418d70bb242be37c51ff5e51a2adcbc372e3"
   integrity sha512-peLblDlFw/ngk3UWq0VnYaOLy6agTZZ+MUO/WhVfm14vJGML+xH4FAl2XQGLqdefjNb7ApRg6Yn7U42ZhmYXdw==
@@ -2574,7 +2574,7 @@ cookie@^0.6.0:
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.6.0.tgz#2798b04b071b0ecbff0dbb62a505a8efa4e19051"
   integrity sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==
 
-crelt@^1.0.5:
+crelt@^1.0.0, crelt@^1.0.5:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/crelt/-/crelt-1.0.6.tgz#7cc898ea74e190fb6ef9dae57f8f81cf7302df72"
   integrity sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==
@@ -6300,7 +6300,12 @@ react-dom@^18:
     loose-envify "^1.1.0"
     scheduler "^0.23.2"
 
-react-icons@^5.3.0:
+react-hook-form@^7.52.0:
+  version "7.53.1"
+  resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.53.1.tgz#3f2cd1ed2b3af99416a4ac674da2d526625add67"
+  integrity sha512-6aiQeBda4zjcuaugWvim9WsGqisoUk+etmFEsSUMm451/Ic8L/UAb7sRtMj3V+Hdzm6mMjU1VhiSzYUZeBm0Vg==
+
+react-icons@^5.2.1, react-icons@^5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-5.3.0.tgz#ccad07a30aebd40a89f8cfa7d82e466019203f1c"
   integrity sha512-DnUk8aFbTyQPSkCfF8dbX6kQjXA9DktMeJqfjrg6cK9vwQVMxmcA3BfP4QoiztVmEHtwlTgLFsPuH2NskKT6eg==