Incorrect __typename Generation on Custom Type

Before opening, please confirm:

[X] I have installed the latest version of the Amplify CLI (see above), and confirmed that the issue still persists.
[X] I have searched for duplicate or closed issues.
[X] I have read the guide for submitting bug reports.
[X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

How did you install the Amplify CLI?

npm

If applicable, what version of Node.js are you using?

18.18.2

Amplify CLI Version

12.10.1

What operating system are you using?

Mac

Amplify Codegen Command

codegen

Describe the bug

When we run Amplify codegen setup for Angular, we are getting incorrect typename generation. Currently, on a single type only, we are getting typename: string instead of __typename: 'TypeName'

Expected behavior

When we generate Angular Code with Codegen, the __typename should be set to the name of the custom type it belongs too

Reproduction steps

Run Amplify CodeGen with the schema listed below.

GraphQL schema(s)

```graphql # Put schemas below this line getWidgets: [WidgetDefnition] enum WidgetType { ReportingLocationTrendsWidget ReportingLocationTimeSeriesWidget ReportingLocationKPIGaugeWidget ReportingLocationMultiTrendGraphWidget GaugeLocationsWidget } enum FlowDirection { IN OUT } interface Widget { id: ID order: Int widget_type: WidgetType name: String intent_id: String # if associated to an intent rows: String columns: String } enum WidgetType { ReportingLocationTrendsWidget ReportingLocationTimeSeriesWidget ReportingLocationKPIGaugeWidget ReportingLocationMultiTrendGraphWidget GaugeLocationsWidget } union WidgetDefinition = ReportingLocationKPIGaugeWidget | ReportingLocationMultiTrendGraphWidget type ReportingLocationKPIGaugeWidget implements Widget { id: ID order: Int widget_type: WidgetType name: String intent_id: String rows: String columns: String capability_id: String transformer_id: String series_key: String aggregator: TimeSeriesWidgetAggregator gaugeType: KPIGaugeType, min: Float, max: Float } type GaugeLocationsWidget implements Widget { id: ID order: Int widget_type: WidgetType name: String intent_id: String rows: String columns: String flow_direction: FlowDirection locations: [GaugeLocation!]! } type GaugeLocation { name: String label: String offset: Int color: String } enum TimeSeriesWidgetTimeUnit { HOUR DAY WEEK MONTH YEAR } enum TimeSeriesWidgetAggregator { MAX MIN AVG } enum KPIGaugeType { NUMBER_VALUE GAUGE } enum DashboardWidgetLayout { CLASSIC GRID } enum FlowDirection { IN OUT } ```

Log output

``` # Put your logs below this line ✔ Generated GraphQL operations successfully and saved at src/graphql ✔ Code generated successfully and saved in file src/app/services/api.service.ts ```

Additional information

Right now, everything compiles and deploys correctly if we manually modify api.service.ts to update

typename: string --> typename: 'GaugeLocation'

This is working correctly for our other 75+ types and inputs but this one set is causing the issue.

.graphqlconfig.yml

``` projects: clientapp: schemaPath: ./amplify/backend/api/clientapp/build/schema.graphql includes: - src/graphql/**/*.graphql excludes: - ./amplify/** - src/app/services/api.service.ts extensions: amplify: codeGenTarget: angular generatedFileName: src/app/services/api.service.ts docsFilePath: src/graphql maxDepth: 5 extensions: amplify: version: 3 ```

api.service

``` { __typename: "GaugeLocationsWidget"; id?: string | null; order?: number | null; widget_type?: WidgetType | null; name?: string | null; intent_id?: string | null; rows?: string | null; columns?: string | null; flow_direction?: FlowDirection | null; locations?: Array<{ __typename: string; <--------Issue is here, should be __typename: "GaugeLocation" name?: string | null; label?: string | null; offset?: number | null; color?: string | null; } | null> | null; } ```

aws-amplify / amplify-codegen