5 files changed, 49 insertions, 8 deletions
diff --git a/packages/bun-macro-relay/__generated__/FooOperation.ts b/packages/bun-macro-relay/__generated__/FooOperation.ts
new file mode 100644
index 000000000..4c83371c9
--- /dev/null
+++ b/packages/bun-macro-relay/__generated__/FooOperation.ts
@@ -0,0 +1,3 @@
+export class FooOperation {}
+
+export default FooOperation;
diff --git a/packages/bun-macro-relay/bun-macro-relay.tsx b/packages/bun-macro-relay/bun-macro-relay.tsx
index eaeca062a..018f8f7f5 100644
--- a/packages/bun-macro-relay/bun-macro-relay.tsx
+++ b/packages/bun-macro-relay/bun-macro-relay.tsx
@@ -18,9 +18,14 @@ artifactDirectory = artifactDirectory.startsWith("/")
   : Bun.cwd + artifactDirectory;
 
 export function graphql(node) {
-  const [templateLiteral] = node.arguments;
+  let query;
+
+  if (node instanceof <call />) {
+    query = node.arguments[0].toString();
+  } else if (node instanceof <template />) {
+    query = node.toString();
+  }
 
-  const query = templateLiteral?.toString();
   if (typeof query !== "string" || query.length === 0) {
     throw new Error("BunMacroRelay: Unexpected empty graphql string.");
   }
@@ -56,10 +61,16 @@ export function graphql(node) {
     />
   );
 
-  return (
-    <>
-      <inject>{importStmt}</inject>,
-      <id to={importStmt.symbols.default} pure />,
-    </>
-  );
+  try {
+    const ret = (
+      <>
+        <inject>{importStmt}</inject>
+        <id to={importStmt.namespace[definitionName]} pure />
+      </>
+    );
+    return ret;
+  } catch (exception) {
+    console.error(exception);
+  }
+  return null;
 }
diff --git a/packages/bun-macro-relay/package.json b/packages/bun-macro-relay/package.json
index f811e4177..968a52065 100644
--- a/packages/bun-macro-relay/package.json
+++ b/packages/bun-macro-relay/package.json
@@ -5,5 +5,15 @@
   "license": "MIT",
   "dependencies": {
     "graphql": "^15.6.0"
+  },
+  "files": [
+    "bun-macro-relay.tsx"
+  ],
+  "bun": {
+    "macros": {
+      "react-relay": {
+        "graphql": "../bun-macro-relay.tsx"
+      }
+    }
   }
 }
diff --git a/packages/bun-macro-relay/test/foo.tsx b/packages/bun-macro-relay/test/foo.tsx
new file mode 100644
index 000000000..fbb54f551
--- /dev/null
+++ b/packages/bun-macro-relay/test/foo.tsx
@@ -0,0 +1,11 @@
+import { graphql } from "react-relay";
+
+export const Foo = () => {
+  const definition = graphql`
+    query FooOperation {
+      foo
+    }
+  `;
+
+  return <div>{definition.operation.name}</div>;
+};
diff --git a/packages/bun-macro-relay/tsconfig.json b/packages/bun-macro-relay/tsconfig.json
new file mode 100644
index 000000000..19d4ac2e6
--- /dev/null
+++ b/packages/bun-macro-relay/tsconfig.json
@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {}
+  }
+}