fix: use correct relative path to bundled client when imported from nested module

.changeset/gentle-ladybugs-yawn.md

@@ -0,0 +1,5 @@
+---
+'@hey-api/openapi-ts': patch
+---
+
+fix: use correct relative path to bundled client when imported from nested module

packages/openapi-ts/src/generate/client.ts

@@ -2,11 +2,23 @@
 import path from 'node:path';
 
 import { getConfig, isStandaloneClient } from '../utils/config';
-import { ensureDirSync } from './utils';
+import { ensureDirSync, relativeModulePath } from './utils';
 
-export const clientModulePath = () => {
+export const clientModulePath = ({
+  sourceOutput,
+}: {
+  sourceOutput: string;
+}) => {
   const config = getConfig();
-  return config.client.bundle ? './client' : config.client.name;
+
+  if (config.client.bundle) {
+    return relativeModulePath({
+      moduleOutput: 'client',
+      sourceOutput,
+    });
+  }
+
+  return config.client.name;
 };
 
 export const clientOptionsTypeName = () => 'Options';

packages/openapi-ts/src/generate/plugins.ts

@@ -34,7 +34,6 @@ export const generatePlugins = async ({
     plugin.handler({
       client,
       files,
-      outputParts,
       plugin,
     });
   }

packages/openapi-ts/src/generate/services.ts

@@ -761,24 +761,26 @@ export const generateServices = async ({
 
   const isStandalone = isStandaloneClient(config);
 
+  const servicesOutput = 'services';
+
   files.services = new TypeScriptFile({
     dir: config.output.path,
-    name: 'services.ts',
+    name: `${servicesOutput}.ts`,
   });
 
   // Import required packages and core files.
   if (isStandalone) {
     files.services.import({
-      module: clientModulePath(),
+      module: clientModulePath({ sourceOutput: servicesOutput }),
       name: 'createClient',
     });
     files.services.import({
-      module: clientModulePath(),
+      module: clientModulePath({ sourceOutput: servicesOutput }),
       name: 'createConfig',
     });
     files.services.import({
       asType: true,
-      module: clientModulePath(),
+      module: clientModulePath({ sourceOutput: servicesOutput }),
       name: clientOptionsTypeName(),
     });
   } else {
@@ -857,7 +859,7 @@ export const generateServices = async ({
       client,
       onClientImport: (imported) => {
         files.services.import({
-          module: clientModulePath(),
+          module: clientModulePath({ sourceOutput: servicesOutput }),
           name: imported,
         });
       },

packages/openapi-ts/src/generate/utils.ts

@@ -5,3 +5,30 @@
     mkdirSync(path, { recursive: true });
   }
 };
+
+/**
+ * Construct a relative import path to modules. This is used for example
+ * in plugins to import types or services module.
+ */
+export const relativeModulePath = ({
+  moduleOutput,
+  sourceOutput,
+}: {
+  /**
+   * Output path to the imported module.
+   * @example
+   * 'types'
+   */
+  moduleOutput: string;
+  /**
+   * Output path to the source module.
+   * @example
+   * '@tanstack/react-query'
+   */
+  sourceOutput: string;
+}): string => {
+  const outputParts = sourceOutput.split('/');
+  const relativePath =
+    new Array(outputParts.length).fill('').join('../') || './';
+  return `${relativePath}${moduleOutput}`;
+};

packages/openapi-ts/src/plugins/@tanstack/query-core/plugin.ts

@@ -15,6 +15,7 @@
   operationResponseTypeName,
   toOperationName,
 } from '../../../generate/services';
+import { relativeModulePath } from '../../../generate/utils';
 import { isOperationParameterRequired } from '../../../openApi';
 import { getOperationKey } from '../../../openApi/common/parser/operation';
 import type { Client } from '../../../types/client';
@@ -643,7 +644,6 @@
 export const handler: PluginDefinition['handler'] = ({
   client,
   files,
-  outputParts,
   plugin,
 }) => {
   if (
@@ -662,13 +662,14 @@
 
   file.import({
     asType: true,
-    module: clientModulePath(),
+    module: clientModulePath({ sourceOutput: plugin.output }),
     name: clientOptionsTypeName(),
   });
 
-  const relativePath =
-    new Array(outputParts.length).fill('').join('../') || './';
-  const typesModulePath = relativePath + files.types.getName(false);
+  const typesModulePath = relativeModulePath({
+    moduleOutput: files.types.getName(false),
+    sourceOutput: plugin.output,
+  });
 
   const mutationsType =
     plugin.name === '@tanstack/svelte-query' ||
@@ -1211,7 +1212,10 @@
         file.add(statement);
       }
 
-      const servicesModulePath = relativePath + files.services.getName(false);
+      const servicesModulePath = relativeModulePath({
+        moduleOutput: files.services.getName(false),
+        sourceOutput: plugin.output,
+      });
 
       if (hasQueries || hasInfiniteQueries) {
         file.import({

packages/openapi-ts/src/plugins/types.ts

@@ -6,7 +6,6 @@ export interface PluginDefinition {
   handler: (args: {
     client: Client;
     files: Files;
-    outputParts: string[];
     plugin: Config['plugins'][number];
   }) => void;
   name: string;

packages/openapi-ts/test/sample.cjs

@@ -4,30 +4,30 @@ const main = async () => {
   /** @type {import('../src').UserConfig} */
   const config = {
     client: {
-      // bundle: true,
+      bundle: true,
       // name: '@hey-api/client-axios',
       name: '@hey-api/client-fetch',
     },
     // debug: true,
     // experimental_parser: true,
     // input: './test/spec/v3-transforms.json',
-    // input: './test/spec/v3.json',
-    input: './test/spec/3.1.0/required-all-of-ref.json',
+    input: './test/spec/v3.json',
+    // input: './test/spec/3.1.0/required-all-of-ref.json',
     // input: './test/spec/v2.json',
     // input: 'https://mongodb-mms-prod-build-server.s3.amazonaws.com/openapi/2caffd88277a4e27c95dcefc7e3b6a63a3b03297-v2-2023-11-15.json',
     // name: 'foo',
     output: {
       path: './test/generated/sample/',
     },
-    // plugins: [
-    //   {
-    //     // infiniteQueryOptions: false,
-    //     // mutationOptions: false,
-    //     name: '@tanstack/react-query',
-    //     // queryOptions: false,
-    //   },
-    //   // '@hey-api/services',
-    // ],
+    plugins: [
+      {
+        // infiniteQueryOptions: false,
+        // mutationOptions: false,
+        name: '@tanstack/react-query',
+        // queryOptions: false,
+      },
+      // '@hey-api/services',
+    ],
     schemas: {
       export: false,
     },