Drop deprecated things

Instead of `ApolloModule`, use either `provideApollo()` or `provideNamedApollo()`.

Instead of `import {graphql} from 'apollo-angular';` use `import {gql as graphql} from 'apollo-angular';`

Author: PowerKiKi

.changeset/sweet-pigs-fix.md

@@ -0,0 +1,8 @@
+---
+'apollo-angular': major
+---
+
+Drop deprecated things:
+
+- Instead of `ApolloModule`, use either `provideApollo()` or `provideNamedApollo()`.
+- Instead of `import {graphql} from 'apollo-angular';` use `import {gql as graphql} from 'apollo-angular';`

packages/apollo-angular/schematics/install/files/module/graphql.module.ts

@@ -1,24 +1,19 @@
-import { APOLLO_OPTIONS, ApolloModule } from 'apollo-angular';
+import { provideApollo } from 'apollo-angular';
 import { HttpLink } from 'apollo-angular/http';
-import { NgModule } from '@angular/core';
+import { inject, NgModule } from '@angular/core';
 import { ApolloClientOptions, InMemoryCache } from '@apollo/client/core';
 
-const uri = '<%= endpoint %>'; // <-- add the URL of the GraphQL server here
-export function createApollo(httpLink: HttpLink): ApolloClientOptions<any> {
+export function createApollo(): ApolloClientOptions<any> {
+  const uri = '<%= endpoint %>'; // <-- add the URL of the GraphQL server here
+  const httpLink = inject(HttpLink);
+
   return {
     link: httpLink.create({ uri }),
     cache: new InMemoryCache(),
   };
 }
 
 @NgModule({
-  exports: [ApolloModule],
-  providers: [
-    {
-      provide: APOLLO_OPTIONS,
-      useFactory: createApollo,
-      deps: [HttpLink],
-    },
-  ],
+  providers: [provideApollo(createApollo)],
 })
 export class GraphQLModule {}

packages/apollo-angular/src/apollo-module.ts

@@ -1,22 +1,9 @@
-import { NgModule, Provider } from '@angular/core';
+import { Provider } from '@angular/core';
 import { ApolloClientOptions } from '@apollo/client/core';
 import { Apollo } from './apollo';
 import { APOLLO_FLAGS, APOLLO_NAMED_OPTIONS, APOLLO_OPTIONS } from './tokens';
 import { Flags, NamedOptions } from './types';
 
-/**
- * This is deprecated and will be removed in the next major version, because
- * Angular is moving toward a moduleless ecosystem.
- *
- * Instead, use either `provideApollo()` or `provideNamedApollo()`.
- *
- * @deprecated
- */
-@NgModule({
-  providers: [Apollo],
-})
-export class ApolloModule {}
-
 export function provideApollo<TCacheShape = any>(
   optionsFactory: () => ApolloClientOptions<TCacheShape>,
   flags: Flags = {},

packages/apollo-angular/src/gql.ts

@@ -6,8 +6,3 @@ const typedGQLTag: <Result, Variables>(
 ) => TypedDocumentNode<Result, Variables> = gqlTag;
 
 export const gql = typedGQLTag;
-
-/**
- * @deprecated Instead, use `import {gql as graphql} from 'apollo-angular';`. Because different exports for the same thing will increase the final bundle size.
- */
-export const graphql = typedGQLTag;

packages/apollo-angular/src/index.ts

@@ -1,5 +1,5 @@
 export type { TypedDocumentNode } from '@apollo/client/core';
-export { ApolloModule, provideApollo, provideNamedApollo } from './apollo-module';
+export { provideApollo, provideNamedApollo } from './apollo-module';
 export { Apollo, ApolloBase } from './apollo';
 export { QueryRef, QueryRefFromDocument } from './query-ref';
 export { Query } from './query';
@@ -19,4 +19,4 @@ export type {
   WatchQueryOptions,
   WatchQueryOptionsAlone,
 } from './types';
-export { gql, graphql } from './gql';
+export { gql } from './gql';

packages/apollo-angular/testing/src/module.ts

@@ -1,4 +1,4 @@
-import { Apollo, ApolloModule } from 'apollo-angular';
+import { Apollo } from 'apollo-angular';
 import { Inject, InjectionToken, NgModule, Optional } from '@angular/core';
 import {
   ApolloCache,
@@ -31,8 +31,8 @@ function addClient(name: string, op: LinkOperation): Operation {
 }
 
 @NgModule({
-  imports: [ApolloModule],
   providers: [
+    Apollo,
     ApolloTestingBackend,
     { provide: ApolloTestingController, useExisting: ApolloTestingBackend },
   ],

packages/apollo-angular/tests/index.spec.ts

@@ -1,7 +1,7 @@
 import * as api from '../src';
 import { Apollo } from '../src/apollo';
-import { ApolloModule, provideApollo, provideNamedApollo } from '../src/apollo-module';
-import { gql, graphql } from '../src/gql';
+import { provideApollo, provideNamedApollo } from '../src/apollo-module';
+import { gql } from '../src/gql';
 import { QueryRef } from '../src/query-ref';
 
 describe('public api', () => {
@@ -11,9 +11,6 @@ describe('public api', () => {
   test('should export QueryRef', () => {
     expect(api.QueryRef).toBe(QueryRef);
   });
-  test('should export ApolloModule', () => {
-    expect(api.ApolloModule).toBe(ApolloModule);
-  });
   test('should export provideApollo', () => {
     expect(api.provideApollo).toBe(provideApollo);
   });
@@ -23,7 +20,4 @@ describe('public api', () => {
   test('should export gql', () => {
     expect(api.gql).toBe(gql);
   });
-  test('should export graphql', () => {
-    expect(api.graphql).toBe(graphql);
-  });
 });

scripts/prepare-e2e.js

@@ -9,12 +9,11 @@ const [, , name, version] = process.argv;
 function updateComponent() {
   let filepath = path.join(cwd, `./${name}/src/app/app.component.ts`);
   const code =
-    `import { Apollo, ApolloModule } from 'apollo-angular';\n` +
+    `import { Apollo } from 'apollo-angular';\n` +
     `import { versionInfo } from 'graphql';\n` +
     fs
       .readFileSync(filepath, 'utf8')
-      .replace('AppComponent {', 'AppComponent { constructor(private readonly apollo: Apollo) {}')
-      .replace('imports: [', 'imports: [ApolloModule, ') +
+      .replace('AppComponent {', 'AppComponent { constructor(private readonly apollo: Apollo) {}') +
     `\n (window as any).GRAPHQL_VERSION = versionInfo.major;`;
 
   fs.writeFileSync(filepath, code, 'utf8');