How to use apollo-angular - 10 common examples

export class MdiIconsGQL extends Apollo.Query<
    MdiIcons.Query,
    MdiIcons.Variables
> {
    document: any = gql`
        query mdiIcons {
            mdiIcons {
                name
            }
        }
    `;
}
@Injectable({
    providedIn: "root"
})
export class WidgetsGQL extends Apollo.Query {
    document: any = gql`
        query widgets {
            widgets {
                type
                chartData {
                    date
                    amount
                }
                increase
                currentAmount
            }
        }
    `;
}

// ====================================================

export const AuthorFragmentFragment = gql`
  fragment AuthorFragment on Author {
    id
    firstName
    lastName
  }
`;

// ====================================================
// Apollo Services
// ====================================================

@Injectable({
  providedIn: "root"
})
export class AllPostsGQL extends Apollo.Query<
  AllPosts.Query,
  AllPosts.Variables
> {
  document: any = gql`
    query AllPosts {
      posts {
        id
        title
        votes
        author {
          ...AuthorFragment
        }
      }
    }

    ${AuthorFragmentFragment}

providedIn: "root"
})
export class RemoveChatGQL extends Apollo.Mutation<
  RemoveChat.Mutation,
  RemoveChat.Variables
> {
  document: any = gql`
    mutation RemoveChat($chatId: ID!) {
      removeChat(chatId: $chatId)
    }
  `;
}
@Injectable({
  providedIn: "root"
})
export class RemoveMessagesGQL extends Apollo.Mutation<
  RemoveMessages.Mutation,
  RemoveMessages.Variables
> {
  document: any = gql`
    mutation RemoveMessages($chatId: ID!, $messageIds: [ID!]) {
      removeMessages(chatId: $chatId, messageIds: $messageIds)
    }
  `;
}

// ====================================================
// END: Apollo Angular template
// ====================================================

import { BookingDataService } from './booking/booking-data-service';
import { OrderDataService } from './order/order-data-service';
import { provideClient } from './graphql-client';
import { ApolloModule } from 'apollo-angular';

// export enum BackendType {
//   IN_MEMORY,
//   REST,
//   GRAPHQL,
// }

@NgModule({
  imports: [
    CommonModule,
    HttpModule,
    ApolloModule.forRoot(provideClient),
  ],
  declarations: [],
  providers: [
    DishesDataService,
    LoginDataService,
    BookingDataService,
    OrderDataService,
  ],
})

export class BackendModule {

  constructor (@Optional() @SkipSelf() parentModule: BackendModule) {
    if (parentModule) {
      throw new Error('BackendModule is already loaded. Import it in the AppModule only');
    }

import { AppComponent } from './components/app.component';
import { getClient } from './client';
import { UsersComponent } from './components/users/users.component';


@NgModule({
  bootstrap: [ AppComponent ],

  // modules go here
  imports: [
    BrowserModule,
    HttpModule,
    AppRoutingModule,
    MaterialModule,
    BrowserAnimationsModule,
    ApolloModule.withClient(getClient),
  ],

  // services go here
  providers: [ AuthService ],

  // components go here
  declarations: [
    AppComponent,
    UsersComponent
  ],

})

export class AppModule { }

// rest
import { provideClient } from './apollo';

@NgModule({
  declarations: [
    AppComponent,
    HomePageComponent,
  ],
  imports: [
    // 3rd party modules
    BrowserModule,
    BrowserAnimationsModule,
    ReactiveFormsModule,
    MaterialModule,
    FlexLayoutModule,
    ApolloModule.withClient(provideClient),
    // our modules
    AppRoutingModule,
    AuthModule,
    SharedModule,
    ChatsModule,
    CallsModule,
    ContactsModule,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ApolloModule } from 'apollo-angular';

import { AppComponent } from './app.component';
import { getClient } from './client';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule,
    // Define the default ApolloClient
    ApolloModule.withClient(getClient),
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

export class DeclineTestSessionGQL extends Apollo.Mutation<
  DeclineTestSessionMutation,
  DeclineTestSessionMutationVariables
> {
  document = DeclineTestSessionDocument;
}
export const SelectedTestSessionDocument = gql`
  query selectedTestSession {
    selectedTestSession @client
  }
`;

@Injectable({
  providedIn: 'root'
})
export class SelectedTestSessionGQL extends Apollo.Query<
  SelectedTestSessionQuery,
  SelectedTestSessionQueryVariables
> {
  document = SelectedTestSessionDocument;
}
export const GetTestNameDocument = gql`
  query getTestName($testId: String!) {
    test(testId: $testId) {
      name
    }
  }
`;

@Injectable({
  providedIn: 'root'
})

> {
  document = UserlistDocument;
}
export const GetVariationDocument = gql`
  query getVariation($variationId: String!) {
    variation(variationId: $variationId) {
      ...VariationData
    }
  }
  ${VariationDataFragmentDoc}
`;

@Injectable({
  providedIn: 'root'
})
export class GetVariationGQL extends Apollo.Query<
  GetVariationQuery,
  GetVariationQueryVariables
> {
  document = GetVariationDocument;
}
export const AllVariationsDocument = gql`
  query allVariations($testId: String!) {
    variations(testId: $testId) {
      ...VariationData
    }
  }
  ${VariationDataFragmentDoc}
`;

@Injectable({
  providedIn: 'root'