codegen models doesn't generate id for belongs-to connection

### Before opening, please confirm:

I have [searched for duplicate or closed issues](https://github.com/aws-amplify/amplify-js/issues?q=is%3Aissue+).
I have read the guide for [submitting bug reports](https://github.com/aws-amplify/amplify-js/blob/main/CONTRIBUTING.md#bug-reports).
I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

### JavaScript Framework

React

### Amplify APIs

GraphQL API, DataStore

### Amplify Categories

api

### Environment information

```
# Put output below this line

System:
OS: macOS 11.2.3
CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
Memory: 452.77 MB / 32.00 GB
Shell: 3.2.1 - /usr/local/bin/fish
Binaries:
Node: 12.18.3 - ~/n/bin/node
Yarn: 1.22.10 - ~/npm/bin/yarn
npm: 7.5.2 - ~/npm/bin/npm
Browsers:
Chrome: 89.0.4389.114
Firefox: 87.0
Safari: 14.0.3
npmGlobalPackages:
@aws-amplify/cli: 4.46.1
@marlonmarcello/vite-plugin-pug: 1.0.3
@wethegit/preact-stickerbook: 1.0.2
@wethegit/sweet-potato-components: 0.0.3
@wethegit/sweet-potato-cooker: 0.9.0
@wethegit/sweet-potato-peeler: 0.3.8
node-gyp: 7.1.2
npm: 7.5.2
twosg: 0.1.0
tpci-tcgportal: 1.0.0
yarn: 1.22.10

```

### Describe the bug

By following the tutorial on [the docs on how to create a belongs-to connection](https://docs.amplify.aws/cli/graphql-transformer/connection#belongs-to) I came up with the following **graphql.schema**:
```graphql
type Project @model {
id: ID!
name: String!
emails: [Email] @connection(keyName: "byProject", fields: ["id"])
}

type Email @model @key(name: "byProject", fields: ["projectID"]) {
id: ID!
title: String!
language: String!
body: String!
projectID: ID!
project: Project @connection(fields: ["projectID"])
}
```

After that, I ran `amplify codegen` and `amplify codegen models`.
The generated model was the following:
```ts
import { ModelInit, MutableModel, PersistentModelConstructor } from "@aws-amplify/datastore";

export declare class Project {
readonly id: string;
readonly name: string;
readonly emails?: (Email | null)[];
constructor(init: ModelInit);
static copyOf(source: Project, mutator: (draft: MutableModel) => MutableModel | void): Project;
}

export declare class Email {
readonly id: string;
readonly title: string;
readonly language: string;
readonly body: string;
readonly project?: Project;
constructor(init: ModelInit);
static copyOf(source: Email, mutator: (draft: MutableModel) => MutableModel | void): Email;
}
```

### Issue 1:
Notice that the `Email` class is missing `projectID`.

### Issue 2:
Because of Issue 1, when using typescript the following error is given:
```ts
const email = await DataStore.save(
new Email({
title: "Email title",
language: "en",
body: JSON.stringify(rows),
projectID: id,
})
);

// Argument of type '{ title: string; language: string; body: string; projectID: string; }' is not assignable to parameter of type 'ModelInit'.
// Object literal may only specify known properties, but 'projectID' does not exist in type 'ModelInit'. Did you mean to write 'project'?ts(2345)
```

### Expected behavior

`amplify codegen models` should include the `projectID` field on the generated class.

### Reproduction steps

1. `amplify init`
2. `amplify add api`
3. Select GraphQL and go through base steps
4. Use the schema provided above
5. `amplify codegen models`

Notice the missing connection ID.

### Code Snippet

```javascript
// Put your code below this line.

```

### Log output

```
// Put your logs below this line

```

### aws-exports.js

_No response_

### Manual configuration

_No response_

### Additional configuration

_No response_

### Mobile Device

_No response_

### Mobile Operating System

_No response_

### Mobile Browser

_No response_

### Mobile Browser Version

_No response_