southpaw 0.2.7

package/api/server.ts

@@ -0,0 +1,566 @@
+import {
+  JsxAttributeStructure,
+  JsxElement,
+  JsxElementStructure,
+  JsxFragment,
+  JsxSelfClosingElement,
+  JsxSelfClosingElementStructure,
+  Project,
+  SourceFile,
+  StructureKind,
+  ts,
+} from "ts-morph";
+import PATH from "path";
+import prettier from "prettier";
+import { ApiType } from "../types/api";
+import { FiberNodeType } from "../types/fiber_node";
+
+const project = new Project();
+project.addSourceFilesAtPaths(["src/**/*{.tsx,.ts}", "package.json"]);
+
+const getSourceFile = (filename: string) => {
+  if (filename.startsWith("[project]")) {
+    const url = PATH.join(
+      process.cwd(),
+      PATH.normalize(filename.split("[project]")[1]),
+    );
+    const sourceFile = project.getSourceFile(url);
+    sourceFile?.refreshFromFileSystemSync();
+    if (!sourceFile) {
+      throw `Source file not found for ${filename}`;
+    }
+    return sourceFile;
+  } else {
+    const url = PATH.normalize(filename);
+    const sourceFile = project.getSourceFile(url);
+    sourceFile?.refreshFromFileSystemSync();
+    if (!sourceFile) {
+      throw `Source file not found for ${filename}`;
+    }
+    return sourceFile;
+  }
+};
+const getNodeAtPos = (
+  sourcefile: SourceFile,
+  location: FiberNodeType["_debugSource"],
+) => {
+  const node =
+    sourcefile.getDescendants().find((node) => {
+      const lineNumber = node.getStartLineNumber();
+      const columnNumber = node.getStart() - node.getStartLinePos();
+      const found =
+        location.lineNumber === lineNumber &&
+        location.columnNumber === columnNumber;
+      return found;
+    }) || null;
+  if (!node) {
+    throw new Error(`Node at ${JSON.stringify(location)} not found`);
+  }
+  return node;
+};
+
+const saveSourceFile = async (sourceFile: SourceFile) => {
+  sourceFile.organizeImports();
+
+  const fullPath = sourceFile.getFilePath();
+  const content = sourceFile.getFullText();
+
+  try {
+    const formatted = await prettier.format(content, {
+      filepath: fullPath,
+      parser: "typescript",
+      semi: true,
+      singleQuote: false,
+      tabWidth: 2,
+      trailingComma: "all",
+    });
+    sourceFile.replaceWithText(formatted);
+  } catch (error) {
+    console.error("Prettier formatting failed:", error);
+    // If Prettier fails, we still save the unformatted content to avoid data loss
+  }
+
+  await sourceFile.save();
+};
+
+const ensureImports = (sourceFile: SourceFile, code: string) => {
+  const hasUI = code.includes("UI.");
+  const hasBlocks = code.includes("Blocks.");
+
+  if (hasUI) {
+    const uiImport = sourceFile.getImportDeclaration("southpaw/ui");
+    if (!uiImport) {
+      sourceFile.addImportDeclaration({
+        namedImports: ["UI"],
+        moduleSpecifier: "southpaw/ui",
+      });
+    } else {
+      if (!uiImport.getNamedImports().some((ni) => ni.getName() === "UI")) {
+        uiImport.addNamedImport("UI");
+      }
+    }
+  }
+
+  if (hasBlocks) {
+    const blocksImport = sourceFile.getImportDeclaration("southpaw/ui/blocks");
+    if (!blocksImport) {
+      sourceFile.addImportDeclaration({
+        namedImports: ["Blocks"],
+        moduleSpecifier: "southpaw/ui/blocks",
+      });
+    } else {
+      if (!blocksImport.getNamedImports().some((ni) => ni.getName() === "Blocks")) {
+        blocksImport.addNamedImport("Blocks");
+      }
+    }
+  }
+};
+export const API: ApiType = {
+  application: {},
+  page: {
+    async writeSEO(args) {
+      try {
+        const source = args.source;
+        const seo = args.seo;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const callExpressions = sourceFile.getDescendantsOfKind(
+          ts.SyntaxKind.CallExpression,
+        );
+        const createPageCallExp = callExpressions.find(
+          (callExp) => callExp.getExpression().getText() === "create_page",
+        );
+        if (!createPageCallExp) {
+          throw `create_page call expression not found in ${source.fileName}`;
+        }
+        const paramsObject = createPageCallExp
+          .getArguments()[0]
+          .asKindOrThrow(ts.SyntaxKind.ObjectLiteralExpression);
+        const seoObject = paramsObject
+          .getPropertyOrThrow("seo")
+          .asKindOrThrow(ts.SyntaxKind.PropertyAssignment);
+        seoObject.setInitializer(JSON.stringify(seo, null, "  "));
+        await saveSourceFile(sourceFile);
+        return Promise.resolve({
+          type: "success",
+          message: `Seo title written successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async insertNode(args) {
+      try {
+        const source = args.source;
+        const code = args.code;
+        const insertMode = args.insertMode;
+        const sourceFile = getSourceFile(source.fileName);
+        const node = getNodeAtPos(sourceFile, source);
+
+        ensureImports(sourceFile, code);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+        if (!jsxElement) {
+          throw new Error(
+            `No jsx element found at source ${JSON.stringify(source)}`,
+          );
+        }
+        switch (true) {
+          case jsxElement instanceof JsxElement:
+            switch (insertMode) {
+              case "before":
+                jsxElement.replaceWithText(`${code}\n${jsxElement.getText()}`);
+                break;
+              case "after":
+                jsxElement.replaceWithText(`${jsxElement.getText()}\n${code}`);
+                break;
+              case "within":
+                const jsxChildren = (jsxElement as JsxElement).getJsxChildren();
+                const lastChild = (jsxElement as JsxElement).getJsxChildren()[
+                  jsxChildren.length - 1
+                ];
+                if (lastChild) {
+                  lastChild.replaceWithText(`${lastChild.getText()}\n${code}`);
+                } else {
+                  (jsxElement as JsxElement).setBodyText(code);
+                }
+
+                break;
+            }
+            break;
+          case jsxElement instanceof JsxSelfClosingElement:
+            switch (insertMode) {
+              case "before":
+                jsxElement.replaceWithText(`${code}\n${jsxElement.getText()}`);
+                break;
+              case "after":
+                jsxElement.replaceWithText(`${jsxElement.getText()}\n${code}`);
+                break;
+              case "within":
+                const tagName = (jsxElement as JsxSelfClosingElement)
+                  .getTagNameNode()
+                  .getText();
+                jsxElement.replaceWithText(
+                  `${jsxElement
+                    .getText()
+                    .replace("/>", ">")}\n${code}\n</${tagName}>`,
+                );
+                break;
+            }
+            break;
+          case jsxElement instanceof JsxFragment:
+            switch (insertMode) {
+              case "before":
+                jsxElement.replaceWithText(`${code}\n${jsxElement.getText()}`);
+                break;
+              case "after":
+                jsxElement.replaceWithText(`${jsxElement.getText()}\n${code}`);
+                break;
+              case "within":
+                const jsxChildren = (jsxElement as JsxFragment).getJsxChildren();
+                const lastChild = jsxChildren[jsxChildren.length - 1];
+                if (lastChild) {
+                  lastChild.replaceWithText(`${lastChild.getText()}\n${code}`);
+                } else {
+                  const opening = (jsxElement as JsxFragment)
+                    .getOpeningFragment()
+                    .getText();
+                  const closing = (jsxElement as JsxFragment)
+                    .getClosingFragment()
+                    .getText();
+                  jsxElement.replaceWithText(`${opening}\n${code}\n${closing}`);
+                }
+                break;
+            }
+            break;
+        }
+        await saveSourceFile(sourceFile);
+        return Promise.resolve({
+          type: "success",
+          message: `Code inserted successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async deleteNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+        jsxElement?.replaceWithText("");
+        await saveSourceFile(sourceFile);
+        return Promise.resolve({
+          type: "success",
+          message: `Code inserted successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async duplicateNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+        jsxElement?.replaceWithText(
+          `${jsxElement.getText()}\n${jsxElement.getText()}`,
+        );
+        await saveSourceFile(sourceFile);
+        return Promise.resolve({
+          type: "success",
+          message: `Code duplicated successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async moveUpNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxText) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+        if (jsxElement) {
+          const selfText = jsxElement.getText();
+          const prevNode = jsxElement
+            .getPreviousSiblings()
+            .filter((sib) => sib.getText())[0];
+          if (prevNode) {
+            const prevNodeText = prevNode.getText();
+            prevNode.replaceWithText(selfText);
+            jsxElement.replaceWithText(prevNodeText);
+            await saveSourceFile(sourceFile);
+          }
+        }
+        return Promise.resolve({
+          type: "success",
+          message: `Code moved up successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async moveDownNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxText) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+        if (jsxElement) {
+          const selfText = jsxElement.getText();
+          const nextNode = jsxElement
+            .getNextSiblings()
+            .filter((sib) => sib.getText())[0];
+
+          if (nextNode) {
+            const nextNodeText = nextNode.getText();
+            nextNode.replaceWithText(selfText);
+            jsxElement.replaceWithText(nextNodeText);
+            await saveSourceFile(sourceFile);
+          }
+        }
+        return Promise.resolve({
+          type: "success",
+          message: `Code moved down successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async moveNode(args) {
+      try {
+        const source = args.source;
+        const target = args.target;
+        const position = args.position;
+        const sourceFile = getSourceFile(source.fileName);
+        const sourceNode = getNodeAtPos(sourceFile, source);
+        const targetNode = getNodeAtPos(sourceFile, target);
+
+        const sourceJsx =
+          sourceNode.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          sourceNode.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          sourceNode.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+
+        const targetJsx =
+          targetNode.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          targetNode.getFirstAncestorByKind(ts.SyntaxKind.JsxElement) ||
+          targetNode.getFirstAncestorByKind(ts.SyntaxKind.JsxFragment);
+
+        if (!sourceJsx || !targetJsx) {
+          throw new Error("Source or target JSX element not found");
+        }
+
+        const sourceText = sourceJsx.getText();
+        sourceJsx.replaceWithText("");
+
+        if (position === "before") {
+          targetJsx.replaceWithText(`${sourceText}\n${targetJsx.getText()}`);
+        } else if (position === "after") {
+          targetJsx.replaceWithText(`${targetJsx.getText()}\n${sourceText}`);
+        } else if (position === "within") {
+          if (targetJsx instanceof JsxSelfClosingElement) {
+            const tagName = targetJsx.getTagNameNode().getText();
+            const attributes = targetJsx.getAttributes()
+              .map((a) => a.getText())
+              .join(" ");
+            targetJsx.replaceWithText(
+              `<${tagName} ${attributes}>\n${sourceText}\n</${tagName}>`,
+            );
+          } else if (targetJsx instanceof JsxElement) {
+            const childrenText = targetJsx
+              .getJsxChildren()
+              .map((c) => c.getText())
+              .join("");
+            targetJsx.setBodyText(`${childrenText}\n${sourceText}`);
+          } else if (targetJsx instanceof JsxFragment) {
+            const opening = targetJsx.getOpeningFragment().getText();
+            const childrenText = targetJsx
+              .getJsxChildren()
+              .map((c) => c.getText())
+              .join("");
+            const closing = targetJsx.getClosingFragment().getText();
+            targetJsx.replaceWithText(
+              `${opening}${childrenText}\n${sourceText}${closing}`,
+            );
+          }
+        }
+
+        await saveSourceFile(sourceFile);
+        return Promise.resolve({
+          type: "success",
+          message: `Node moved successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async setPropNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement);
+        if (jsxElement) {
+          const structure =
+            jsxElement.getStructure() as Partial<JsxSelfClosingElementStructure> &
+              Partial<JsxElementStructure>;
+          args.attrs.forEach((attr) => {
+            if (attr.newValue) ensureImports(sourceFile, attr.newValue);
+            const attribute = structure.attributes!.find(
+              (a) => (a as JsxAttributeStructure).name === attr.name,
+            ) as JsxAttributeStructure | undefined;
+
+            if (typeof attr.newValue === "undefined") {
+              structure.attributes = structure.attributes?.filter(
+                (a) => (a as JsxAttributeStructure).name !== attr.name,
+              );
+            } else if (attribute) {
+              attribute.initializer = attr.newValue;
+            } else {
+              structure.attributes!.push({
+                name: attr.name,
+                initializer: attr.newValue,
+                kind: StructureKind.JsxAttribute,
+              });
+            }
+          });
+          jsxElement.set(structure);
+          await saveSourceFile(sourceFile);
+        }
+        return Promise.resolve({
+          type: "success",
+          message: `Prop set successfully`,
+          payload: {},
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: {},
+        });
+      }
+    },
+    async getRawPropsNode(args) {
+      try {
+        const source = args.source;
+        const sourceFile = getSourceFile(source.fileName);
+
+        const node = getNodeAtPos(sourceFile, source);
+
+        const jsxElement =
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxSelfClosingElement) ||
+          node.getFirstAncestorByKind(ts.SyntaxKind.JsxElement);
+        if (!jsxElement) {
+          return Promise.resolve({
+            type: "error",
+            message: "No jsx element found",
+            payload: { rawProps: {} },
+          });
+        }
+        const structure = jsxElement.getStructure();
+        const attributes = structure.attributes || [];
+        const rawProps = attributes.reduce(
+          (acc, curr) => {
+            if (
+              curr.kind === StructureKind.JsxAttribute &&
+              typeof curr.name === "string"
+            ) {
+              acc[curr.name] = curr.initializer || "";
+            }
+            return acc;
+          },
+          {} as Record<string, string>,
+        );
+        return Promise.resolve({
+          type: "success",
+          message: `Get raw props successfully`,
+          payload: {
+            rawProps,
+          },
+        });
+      } catch (error) {
+        console.log({ error });
+        return Promise.resolve({
+          type: "error",
+          message: (error as Error).message,
+          payload: { rawProps: {} },
+        });
+      }
+    },
+  },
+};