Relay Support in Rust Compiler

package.json

@@ -59,6 +59,7 @@
     "@types/http-proxy": "1.17.3",
     "@types/jest": "24.0.13",
     "@types/node": "13.11.0",
+    "@types/relay-runtime": "13.0.0",
     "@types/selenium-webdriver": "4.0.15",
     "@types/sharp": "0.29.3",
     "@types/string-hash": "1.1.1",
@@ -145,6 +146,8 @@
     "react-dom": "17.0.2",
     "react-dom-18": "npm:[email protected]",
     "react-ssr-prepass": "1.0.8",
+    "relay-compiler": "13.0.1",
+    "relay-runtime": "13.0.1",
     "release": "6.3.0",
     "request-promise-core": "1.1.2",
     "resolve-from": "5.0.0",

packages/next-swc/crates/core/src/lib.rs

@@ -53,6 +53,7 @@ pub mod next_dynamic;
 pub mod next_ssg;
 pub mod page_config;
 pub mod react_remove_properties;
+pub mod relay;
 pub mod remove_console;
 pub mod shake_exports;
 pub mod styled_jsx;
@@ -91,6 +92,9 @@ pub struct TransformOptions {
     #[serde(default)]
     pub react_remove_properties: Option<react_remove_properties::Config>,
 
+    #[serde(default)]
+    pub relay: Option<relay::Config>,
+
     #[serde(default)]
     pub shake_exports: Option<shake_exports::Config>,
 }
@@ -130,6 +134,10 @@ pub fn custom_before_pass(
             page_config::page_config(opts.is_development, opts.is_page_file),
             !opts.disable_page_config
         ),
+        match &opts.relay {
+            Some(config) => Either::Left(relay::relay(config.clone(), file.name.clone())),
+            _ => Either::Right(noop()),
+        },
         match &opts.remove_console {
             Some(config) if config.truthy() =>
                 Either::Left(remove_console::remove_console(config.clone())),

packages/next-swc/crates/core/src/relay.rs

@@ -0,0 +1,157 @@
+use std::path::PathBuf;
+
+use pathdiff::diff_paths;
+use serde::Deserialize;
+use swc_atoms::{js_word, JsWord};
+use swc_common::FileName::Real;
+use swc_common::{FileName, Span};
+use swc_ecmascript::ast::*;
+use swc_ecmascript::visit::{Fold, FoldWith};
+
+#[derive(Clone, Debug, Deserialize)]
+#[serde(rename_all = "snake_case")]
+pub enum RelayLanguageConfig {
+    Typescript,
+    Flow,
+}
+
+#[derive(Clone, Debug, Deserialize)]
+pub struct Config {
+    pub artifact_directory: Option<PathBuf>,
+    pub language: RelayLanguageConfig,
+}
+
+impl Config {
+    fn file_extension(&mut self) -> &'static str {
+        match self.language {
+            RelayLanguageConfig::Typescript => "ts",
+            RelayLanguageConfig::Flow => "js",
+        }
+    }
+}
+
+struct Relay {
+    config: Config,
+    file_name: FileName,
+}
+
+fn pull_first_operation_name_from_tpl(tpl: TaggedTpl) -> Option<String> {
+    tpl.tpl
+        .quasis
+        .into_iter()
+        .filter_map(|quasis| {
+            let template_string_content = String::from(quasis.raw.value.to_string());
+            let split_content = template_string_content.split(" ").collect::<Vec<&str>>();
+
+            let operation = split_content
+                .chunks(2)
+                .filter_map(|slice| {
+                    if slice.len() == 1 {
+                        return None;
+                    }
+
+                    let word = slice[0];
+                    let next_word = slice[1];
+
+                    if word == "query" || word == "subscription" || word == "mutation" {
+                        return Some(String::from(next_word));
+                    }
+
+                    None
+                })
+                .next();
+
+            return operation;
+        })
+        .next()
+}
+
+fn build_require_expr_from_path(path: String) -> Expr {
+    Expr::Call(CallExpr {
+        span: Default::default(),
+        callee: ExprOrSuper::Expr(Box::new(Expr::Ident(Ident::new(
+            js_word!("require"),
+            Span::default(),
+        )))),
+        args: vec![ExprOrSpread {
+            spread: None,
+            expr: Box::new(Expr::Lit(Lit::Str(Str {
+                span: Default::default(),
+                value: JsWord::from(path),
+                has_escape: false,
+                kind: Default::default(),
+            }))),
+        }],
+        type_args: None,
+    })
+}
+
+impl Fold for Relay {
+    fn fold_expr(&mut self, expr: Expr) -> Expr {
+        let expr = expr.fold_children_with(self);
+
+        match expr.clone() {
+            Expr::TaggedTpl(tpl) => {
+                if let Some(built_expr) = self.build_call_expr_from_tpl(tpl) {
+                    built_expr
+                } else {
+                    expr
+                }
+            }
+            _ => expr,
+        }
+    }
+}
+
+impl Relay {
+    fn build_call_expr_from_tpl(&mut self, tpl: TaggedTpl) -> Option<Expr> {
+        if let Expr::Ident(ident) = *tpl.tag.clone() {
+            if ident.sym.to_string() != "graphql" {
+                return None;
+            }
+        }
+
+        let operation_name = pull_first_operation_name_from_tpl(tpl);
+
+        if let (Some(operation_name), Real(source_path_buf)) =
+            (operation_name, self.file_name.clone())
+        {
+            let path_to_source_dir = source_path_buf.parent().unwrap();
+            let generated_file_name = format!(
+                "{}.graphql.{}",
+                operation_name,
+                self.config.file_extension().clone()
+            );
+
+            let fully_qualified_require_path = match self.config.artifact_directory.clone() {
+                Some(artifact_directory) => std::env::current_dir()
+                    .unwrap()
+                    .join(artifact_directory)
+                    .join(generated_file_name),
+                _ => path_to_source_dir
+                    .clone()
+                    .join("__generated__")
+                    .join(generated_file_name),
+            };
+
+            let mut require_path = String::from(
+                diff_paths(fully_qualified_require_path, path_to_source_dir)
+                    .unwrap()
+                    .to_str()
+                    .unwrap(),
+            );
+
+            if !require_path.starts_with(".") {
+                require_path = format!("./{}", require_path);
+            }
+
+            return Some(build_require_expr_from_path(require_path));
+        }
+
+        None
+    }
+}
+
+pub fn relay(config: Config, file_name: FileName) -> impl Fold {
+    Relay { config, file_name }
+}

packages/next-swc/crates/core/tests/fixture.rs

@@ -1,3 +1,4 @@
+use next_swc::relay::{relay, RelayLanguageConfig};
 use next_swc::{
     amp_attributes::amp_attributes,
     next_dynamic::next_dynamic,
@@ -11,6 +12,7 @@ use next_swc::{
 use std::path::PathBuf;
 use swc_common::{chain, comments::SingleThreadedComments, FileName, Mark, Span, DUMMY_SP};
 use swc_ecma_transforms_testing::{test, test_fixture};
+use swc_ecmascript::parser::TsConfig;
 use swc_ecmascript::{
     parser::{EsConfig, Syntax},
     transforms::{react::jsx, resolver},
@@ -135,6 +137,49 @@ fn page_config_fixture(input: PathBuf) {
     test_fixture(syntax(), &|_tr| page_config_test(), &input, &output);
 }
 
+#[fixture("tests/fixture/relay/no-artifact-dir/**/input.ts*")]
+fn relay_no_artifact_dir_fixture(input: PathBuf) {
+    let output = input.parent().unwrap().join("output.js");
+    test_fixture(
+        syntax(),
+        &|_tr| {
+            relay(
+                next_swc::relay::Config {
+                    artifact_directory: None,
+                    language: RelayLanguageConfig::Typescript,
+                },
+                FileName::Real(PathBuf::from(input.clone())),
+            )
+        },
+        &input,
+        &output,
+    );
+}
+
+#[fixture("tests/fixture/relay/artifact-dir/**/input.ts*")]
+fn relay_fixture(input: PathBuf) {
+    let output = input.parent().unwrap().join("output.js");
+    test_fixture(
+        Syntax::Typescript(TsConfig {
+            tsx: true,
+            decorators: false,
+            dts: false,
+            no_early_errors: false,
+        }),
+        &|_tr| {
+            relay(
+                next_swc::relay::Config {
+                    artifact_directory: Some(PathBuf::from("some/generated/dir")),
+                    language: RelayLanguageConfig::Typescript,
+                },
+                FileName::Real(PathBuf::from(input.clone())),
+            )
+        },
+        &input,
+        &output,
+    );
+}
+
 #[fixture("tests/fixture/remove-console/**/input.js")]
 fn remove_console_fixture(input: PathBuf) {
     let output = input.parent().unwrap().join("output.js");

packages/next-swc/crates/core/tests/fixture/relay/artifact-dir/input.tsx

@@ -0,0 +1,42 @@
+const variableQuery = graphql`
+  query InputVariableQuery {
+    hello
+  }
+`
+
+fetchQuery(graphql`
+  query InputUsedInFunctionCallQuery {
+    hello
+  }
+`)
+
+function SomeQueryComponent() {
+  useLazyLoadQuery(graphql`
+    query InputInHookQuery {
+      hello
+    }
+  `)
+}
+
+const variableMutation = graphql`
+  query InputVariableMutation {
+    someMutation
+  }
+`
+
+commitMutation(
+  environment,
+  graphql`
+    query InputUsedInFunctionCallMutation {
+      someMutation
+    }
+  `
+)
+
+function SomeMutationComponent() {
+  useMutation(graphql`
+    query InputInHookMutation {
+      someMutation
+    }
+  `)
+}

packages/next-swc/crates/core/tests/fixture/relay/artifact-dir/output.js

@@ -0,0 +1,10 @@
+const variableQuery = require("../../../../../../some/generated/dir/InputVariableQuery.graphql.ts");
+fetchQuery(require("../../../../../../some/generated/dir/InputUsedInFunctionCallQuery.graphql.ts"));
+function SomeQueryComponent() {
+  useLazyLoadQuery(require("../../../../../../some/generated/dir/InputInHookQuery.graphql.ts"));
+}
+const variableMutation = require("../../../../../../some/generated/dir/InputVariableMutation.graphql.ts");
+commitMutation(environment, require("../../../../../../some/generated/dir/InputUsedInFunctionCallMutation.graphql.ts"));
+function SomeMutationComponent() {
+  useMutation(require("../../../../../../some/generated/dir/InputInHookMutation.graphql.ts"));
+}

packages/next-swc/crates/core/tests/fixture/relay/no-artifact-dir/input.tsx

@@ -0,0 +1,42 @@
+const variableQuery = graphql`
+  query InputVariableQuery {
+    hello
+  }
+`
+
+fetchQuery(graphql`
+  query InputUsedInFunctionCallQuery {
+    hello
+  }
+`)
+
+function SomeQueryComponent() {
+  useLazyLoadQuery(graphql`
+    query InputInHookQuery {
+      hello
+    }
+  `)
+}
+
+const variableMutation = graphql`
+  query InputVariableMutation {
+    someMutation
+  }
+`
+
+commitMutation(
+    environment,
+    graphql`
+      query InputUsedInFunctionCallMutation {
+        someMutation
+      }
+    `
+)
+
+function SomeMutationComponent() {
+  useMutation(graphql`
+    query InputInHookMutation {
+      someMutation
+    }
+  `)
+}

packages/next-swc/crates/core/tests/fixture/relay/no-artifact-dir/output.js

@@ -0,0 +1,13 @@
+const variableQuery = require('./__generated__/InputVariableQuery.graphql.ts')
+fetchQuery(require('./__generated__/InputUsedInFunctionCallQuery.graphql.ts'))
+function SomeQueryComponent() {
+  useLazyLoadQuery(require('./__generated__/InputInHookQuery.graphql.ts'))
+}
+const variableMutation = require('./__generated__/InputVariableMutation.graphql.ts')
+commitMutation(
+  environment,
+  require('./__generated__/InputUsedInFunctionCallMutation.graphql.ts')
+)
+function SomeMutationComponent() {
+  useMutation(require('./__generated__/InputInHookMutation.graphql.ts'))
+}

packages/next/build/swc/options.js

@@ -75,6 +75,7 @@ function getBaseSWCOptions({
       : null,
     removeConsole: nextConfig?.experimental?.removeConsole,
     reactRemoveProperties: nextConfig?.experimental?.reactRemoveProperties,
+    relay: nextConfig?.experimental?.relay,
   }
 }
 

packages/next/build/webpack-config.ts

@@ -1614,6 +1614,7 @@ export default async function getBaseWebpackConfig(
     removeConsole: config.experimental.removeConsole,
     reactRemoveProperties: config.experimental.reactRemoveProperties,
     styledComponents: config.experimental.styledComponents,
+    relay: config.experimental.relay,
   })
 
   const cache: any = {