Merge pull request #57 from githubnext/aw/onFetchInternalEndpoint

Implement onFetchInternalEndpoint
githubnext · Jun 30, 2022 · 14c6e10 · 14c6e10
2 parents b8f396e + f8d708f
commit 14c6e10
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 11 deletions.
diff --git a/blocks/file-blocks/edit/index.tsx b/blocks/file-blocks/edit/index.tsx
@@ -12,6 +12,8 @@ import { Button, FormControl, TextInput } from "@primer/react";
 
 export default function (props: FileBlockProps) {
   const { content, context, onUpdateContent } = props;
+  const onFetchInternalEndpoint =
+    props.private__onFetchInternalEndpoint || onFetchInternalEndpointPolyfill;
 
   const [instruction, setInstruction] = useState<string>("");
   const [newContent, setNewContent] = useState<string>("");
@@ -46,9 +48,12 @@ export default function (props: FileBlockProps) {
         onSubmit={async (e) => {
           e.preventDefault();
           setIsLoading(true);
-          const res = await axios.post("/api/openai-edit", {
-            instruction: instruction,
-            input: content,
+          const res = await onFetchInternalEndpoint("/api/openai-edit", {
+            method: "POST",
+            data: {
+              instruction: instruction,
+              input: content,
+            },
           });
           setNewContent(res.data);
           setIsLoading(false);
@@ -196,3 +201,7 @@ const Change = ({ change, language }: { change: Hunk; language: string }) => {
     </div>
   );
 };
+
+const onFetchInternalEndpointPolyfill = async (url: string, params: any) => {
+  return await axios(url, params);
+};
diff --git a/blocks/file-blocks/explain/explanation.tsx b/blocks/file-blocks/explain/explanation.tsx
@@ -3,10 +3,17 @@ import axios from "axios";
 import { useQuery } from "react-query";
 import type { Explanation } from ".";
 
-const fetchExplanation = async (code: string, language: string) => {
-  const res = await axios.post(`/api/explain`, {
-    code,
-    language,
+const fetchExplanation = async (
+  code: string,
+  language: string,
+  onFetchInternalEndpoint: (url: string, params: any) => Promise<any>
+): Promise<Explanation> => {
+  const res = await onFetchInternalEndpoint("/api/explain", {
+    method: "POST",
+    data: {
+      code,
+      language,
+    },
   });
   return res.data;
 };
@@ -16,9 +23,17 @@ export function ExplanationComponent(props: {
   language: string;
 }) {
   const { explanation } = props;
+  const onFetchInternalEndpoint =
+    props.private__onFetchInternalEndpoint || onFetchInternalEndpointPolyfill;
+
   const { data, status } = useQuery(
     ["explanation", props.explanation.code],
-    () => fetchExplanation(props.explanation.code, props.language),
+    () =>
+      fetchExplanation(
+        props.explanation.code,
+        props.language,
+        onFetchInternalEndpoint
+      ),
     { refetchOnWindowFocus: false }
   );
 
@@ -49,3 +64,7 @@ export function ExplanationComponent(props: {
     </>
   );
 }
+
+const onFetchInternalEndpointPolyfill = async (url: string, params: any) => {
+  return await axios(url, params);
+};
diff --git a/blocks/file-blocks/summarize/index.tsx b/blocks/file-blocks/summarize/index.tsx
@@ -9,6 +9,8 @@ import "./index.css";
 
 export default function (props: FileBlockProps) {
   const { content, context } = props;
+  const onFetchInternalEndpoint =
+    props.private__onFetchInternalEndpoint || onFetchInternalEndpointPolyfill;
   const [sections, setSections] = useState<CodeSection[]>([]);
   const [sectionExplanations, setSectionExplanations] = useState<string[]>([]);
   const [isCollapsed, setIsCollapsed] = useState<boolean>(false);
@@ -39,7 +41,7 @@ export default function (props: FileBlockProps) {
         type === "function" &&
         // don't hammer the endpoint
         index < 30
-          ? await fetchCodeSummary(text, language)
+          ? await fetchCodeSummary(text, language, onFetchInternalEndpoint)
           : "";
       setSectionExplanations((sectionExplanations) => {
         let newSectionExplanations = [...sectionExplanations];
@@ -191,9 +193,13 @@ const Section = ({
   );
 };
 
-const fetchCodeSummary = async (code: string, language: string) => {
+const fetchCodeSummary = async (
+  code: string,
+  language: string,
+  onFetchInternalEndpoint: (url: string, params: any) => Promise<any>
+) => {
   // this is an endpoint on the main prototype
-  const response = await axios("/api/explain", {
+  const response = await onFetchInternalEndpoint("/api/explain", {
     method: "POST",
     data: {
       language,
@@ -282,3 +288,7 @@ const breakCodeIntoSections = async (
   });
   return sections.filter((d) => !!d.text.trim());
 };
+
+const onFetchInternalEndpointPolyfill = async (url: string, params: any) => {
+  return await axios(url, params);
+};