Type-check throws an error for Analytics.record method using Kinesis provider

vojtech-simko commented 2 years ago

Before opening, please confirm:

[X] I have searched for duplicate or closed issues and discussions.
[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.

JavaScript Framework

Angular

Amplify APIs

Authentication, Analytics, GraphQL API, Storage

Amplify Categories

auth, storage, function, api, analytics

Environment information

``` # Put output below this line System: OS: macOS 12.0.1 CPU: (8) arm64 Apple M1 Memory: 287.09 MB / 16.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm Browsers: Chrome: 99.0.4844.51 Safari: 15.1 npmPackages: @angular-devkit/build-angular: ^13.2.5 => 13.2.5 @angular/animations: ~13.2.5 => 13.2.5 @angular/animations/browser: undefined () @angular/animations/browser/testing: undefined () @angular/cdk: ^13.2.5 => 13.2.5 @angular/cdk/a11y: undefined () @angular/cdk/accordion: undefined () @angular/cdk/bidi: undefined () @angular/cdk/clipboard: undefined () @angular/cdk/coercion: undefined () @angular/cdk/collections: undefined () @angular/cdk/drag-drop: undefined () @angular/cdk/keycodes: undefined () @angular/cdk/layout: undefined () @angular/cdk/observers: undefined () @angular/cdk/overlay: undefined () @angular/cdk/platform: undefined () @angular/cdk/portal: undefined () @angular/cdk/scrolling: undefined () @angular/cdk/stepper: undefined () @angular/cdk/table: undefined () @angular/cdk/testing: undefined () @angular/cdk/testing/protractor: undefined () @angular/cdk/testing/selenium-webdriver: undefined () @angular/cdk/testing/testbed: undefined () @angular/cdk/text-field: undefined () @angular/cdk/tree: undefined () @angular/cli: ~13.2.5 => 13.2.5 @angular/common: ~13.2.5 => 13.2.5 @angular/common/http: undefined () @angular/common/http/testing: undefined () @angular/common/testing: undefined () @angular/common/upgrade: undefined () @angular/compiler: ~13.2.5 => 13.2.5 (9.0.0) @angular/compiler-cli: ~13.2.5 => 13.2.5 @angular/compiler/testing: undefined () @angular/core: ~13.2.5 => 13.2.5 (9.0.0) @angular/core/testing: undefined () @angular/forms: ~13.2.5 => 13.2.5 @angular/material: ^13.2.5 => 13.2.5 @angular/material/autocomplete: undefined () @angular/material/autocomplete/testing: undefined () @angular/material/badge: undefined () @angular/material/badge/testing: undefined () @angular/material/bottom-sheet: undefined () @angular/material/bottom-sheet/testing: undefined () @angular/material/button: undefined () @angular/material/button-toggle: undefined () @angular/material/button-toggle/testing: undefined () @angular/material/button/testing: undefined () @angular/material/card: undefined () @angular/material/card/testing: undefined () @angular/material/checkbox: undefined () @angular/material/checkbox/testing: undefined () @angular/material/chips: undefined () @angular/material/chips/testing: undefined () @angular/material/core: undefined () @angular/material/core/testing: undefined () @angular/material/datepicker: undefined () @angular/material/datepicker/testing: undefined () @angular/material/dialog: undefined () @angular/material/dialog/testing: undefined () @angular/material/divider: undefined () @angular/material/divider/testing: undefined () @angular/material/expansion: undefined () @angular/material/expansion/testing: undefined () @angular/material/form-field: undefined () @angular/material/form-field/testing: undefined () @angular/material/form-field/testing/control: undefined () @angular/material/grid-list: undefined () @angular/material/grid-list/testing: undefined () @angular/material/icon: undefined () @angular/material/icon/testing: undefined () @angular/material/input: undefined () @angular/material/input/testing: undefined () @angular/material/list: undefined () @angular/material/list/testing: undefined () @angular/material/menu: undefined () @angular/material/menu/testing: undefined () @angular/material/paginator: undefined () @angular/material/paginator/testing: undefined () @angular/material/progress-bar: undefined () @angular/material/progress-bar/testing: undefined () @angular/material/progress-spinner: undefined () @angular/material/progress-spinner/testing: undefined () @angular/material/radio: undefined () @angular/material/radio/testing: undefined () @angular/material/select: undefined () @angular/material/select/testing: undefined () @angular/material/sidenav: undefined () @angular/material/sidenav/testing: undefined () @angular/material/slide-toggle: undefined () @angular/material/slide-toggle/testing: undefined () @angular/material/slider: undefined () @angular/material/slider/testing: undefined () @angular/material/snack-bar: undefined () @angular/material/snack-bar/testing: undefined () @angular/material/sort: undefined () @angular/material/sort/testing: undefined () @angular/material/stepper: undefined () @angular/material/stepper/testing: undefined () @angular/material/table: undefined () @angular/material/table/testing: undefined () @angular/material/tabs: undefined () @angular/material/tabs/testing: undefined () @angular/material/toolbar: undefined () @angular/material/toolbar/testing: undefined () @angular/material/tooltip: undefined () @angular/material/tooltip/testing: undefined () @angular/material/tree: undefined () @angular/material/tree/testing: undefined () @angular/platform-browser: ~13.2.5 => 13.2.5 @angular/platform-browser-dynamic: ~13.2.5 => 13.2.5 @angular/platform-browser-dynamic/testing: undefined () @angular/platform-browser/animations: undefined () @angular/platform-browser/testing: undefined () @angular/router: ~13.2.5 => 13.2.5 @angular/router/testing: undefined () @angular/router/upgrade: undefined () @angular/youtube-player: ^13.2.5 => 13.2.5 @aws-amplify/analytics: ^5.2.1 => 5.2.1 (4.0.22) @aws-amplify/api: ^4.0.34 => 4.0.34 (3.3.3) @aws-amplify/api-graphql: ^2.2.23 => 2.2.23 (1.3.3) @aws-amplify/auth: ^4.4.3 => 4.4.3 (3.4.34) @aws-amplify/storage: ^4.4.17 => 4.4.17 (3.4.4) @aws-amplify/ui-angular: 1.0.5 => 1.0.5 @fullcalendar/angular: ^5.10.1 => 5.10.2 @fullcalendar/daygrid: ^5.10.1 => 5.10.1 @fullcalendar/interaction: ^5.10.1 => 5.10.1 @fullcalendar/list: ^5.10.1 => 5.10.1 @graphql-tools/webpack-loader: ^6.6.1 => 6.6.1 @kolkov/angular-editor: ^1.1.7 => 1.1.7 @ngneat/svg-icon: ^4.1.0 => 4.1.0 @swimlane/dragula: ^3.8.0 => 3.8.0 @swimlane/ngx-dnd: ^9.0.0 => 9.0.0 @types/dragula: ^3.7.0 => 3.7.0 (2.1.35) @types/jasmine: ~3.6.0 => 3.6.11 @types/jasminewd2: ^2.0.9 => 2.0.9 @types/node: ^12.20.13 => 12.20.13 @types/webrtc: 0.0.26 => 0.0.26 angular2-toaster: ^11.0.1 => 11.0.1 aws-amplify: ^4.3.16 => 4.3.16 (3.4.3) aws-sdk: ^2.1085.0 => 2.1085.0 codelyzer: ^6.0.0 => 6.0.2 commander: ^9.0.0 => 9.0.0 (2.20.3, 4.1.1, 7.2.0, 2.13.0) example-typescript: 1.0.0 flatpickr: ^4.6.6 => 4.6.9 jasmine-core: ~3.6.0 => 3.6.0 (2.8.0) jasmine-spec-reporter: ~5.0.0 => 5.0.2 karma: ~6.3.17 => 6.3.17 karma-chrome-launcher: ~3.1.0 => 3.1.0 karma-coverage-istanbul-reporter: ~3.0.2 => 3.0.3 karma-jasmine: ~4.0.0 => 4.0.1 karma-jasmine-html-reporter: ^1.5.0 => 1.6.0 ng2-flatpickr: ^9.0.0 => 9.0.0 ngx-chips: ^2.2.2 => 2.2.2 ngx-draggable-dom: ^2.3.0 => 2.3.0 ngx-file-drop: ^13.0.0 => 13.0.0 node-example: 1.0.0 openvidu-browser: ^2.17.0 => 2.17.0 protractor: ~7.0.0 => 7.0.0 protractor-example: 1.0.0 rxjs: ~6.5.5 => 6.5.5 (6.6.7, 7.5.4) rxjs/ajax: undefined () rxjs/fetch: undefined () rxjs/internal-compatibility: undefined () rxjs/operators: undefined () rxjs/testing: undefined () rxjs/webSocket: undefined () svg-to-ts: ^7.1.0 => 7.1.0 ts-node: ~8.3.0 => 8.3.0 tslint: ~6.1.0 => 6.1.3 typescript: ~4.5.5 => 4.5.5 (3.9.10) typescript-example: 1.0.0 uuid: ^8.3.2 => 8.3.2 (3.4.0, 3.3.2, 8.3.1) wavesurfer.js: ^4.6.0 => 4.6.0 zone-mix: undefined () zone-node: undefined () zone-testing: undefined () zone.js: ~0.11.4 => 0.11.4 (0.10.3) zone.js/async-test: undefined () zone.js/async-test.min: undefined () zone.js/fake-async-test: undefined () zone.js/fake-async-test.min: undefined () zone.js/jasmine-patch: undefined () zone.js/jasmine-patch.min: undefined () zone.js/long-stack-trace-zone: undefined () zone.js/long-stack-trace-zone.min: undefined () zone.js/mocha-patch: undefined () zone.js/mocha-patch.min: undefined () zone.js/proxy: undefined () zone.js/proxy.min: undefined () zone.js/sync-test: undefined () zone.js/sync-test.min: undefined () zone.js/task-tracking: undefined () zone.js/task-tracking.min: undefined () zone.js/webapis-media-query: undefined () zone.js/webapis-media-query.min: undefined () zone.js/webapis-notification: undefined () zone.js/webapis-notification.min: undefined () zone.js/webapis-rtc-peer-connection: undefined () zone.js/webapis-rtc-peer-connection.min: undefined () zone.js/webapis-shadydom: undefined () zone.js/webapis-shadydom.min: undefined () zone.js/wtf: undefined () zone.js/wtf.min: undefined () zone.js/zone-bluebird: undefined () zone.js/zone-bluebird.min: undefined () zone.js/zone-error: undefined () zone.js/zone-error.min: undefined () zone.js/zone-legacy: undefined () zone.js/zone-legacy.min: undefined () zone.js/zone-patch-canvas: undefined () zone.js/zone-patch-canvas.min: undefined () zone.js/zone-patch-cordova: undefined () zone.js/zone-patch-cordova.min: undefined () zone.js/zone-patch-electron: undefined () zone.js/zone-patch-electron.min: undefined () zone.js/zone-patch-fetch: undefined () zone.js/zone-patch-fetch.min: undefined () zone.js/zone-patch-jsonp: undefined () zone.js/zone-patch-jsonp.min: undefined () zone.js/zone-patch-message-port: undefined () zone.js/zone-patch-message-port.min: undefined () zone.js/zone-patch-promise-test: undefined () zone.js/zone-patch-promise-test.min: undefined () zone.js/zone-patch-resize-observer: undefined () zone.js/zone-patch-resize-observer.min: undefined () zone.js/zone-patch-rxjs: undefined () zone.js/zone-patch-rxjs-fake-async: undefined () zone.js/zone-patch-rxjs-fake-async.min: undefined () zone.js/zone-patch-rxjs.min: undefined () zone.js/zone-patch-socket-io: undefined () zone.js/zone-patch-socket-io.min: undefined () zone.js/zone-patch-user-media: undefined () zone.js/zone-patch-user-media.min: undefined () npmGlobalPackages: @angular/cli: 13.1.3 @aws-amplify/cli: 7.6.23 corepack: 0.10.0 npm: 8.1.2 stardio-pro: 0.0.0 uuid: 8.3.2 ```

Describe the bug

After upgrading from aws-amplify@3.4.3 to aws-amplify@4.3.16 and later to modular packages @aws-amplify/... type-checking throws an error for Amplify.record method when trying to stream data via AWSKinesisProvider. (problem is there if I import Amplify from aws-amplify as well as from @aws-amplify/analytics)

In documentation it's written:

# You can send a data to a Kinesis stream with the standard record() method:

Analytics.record({
    data: { 
        // The data blob to put into the record
    },
    // OPTIONAL
    partitionKey: 'myPartitionKey', 
    streamName: 'myKinesisStream'
}, 'AWSKinesis');

But when I try to use it this way it throws an error:

No overload matches this call.
  Overload 1 of 2, '(event: AnalyticsEvent, provider?: string): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'AnalyticsEvent'.
      Object literal may only specify known properties, and 'data' does not exist in type 'AnalyticsEvent'.
  Overload 2 of 2, '(eventName: string, attributes?: EventAttributes, metrics?: EventMetrics): any', gave the following error.
    Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'string'.

I assume the problem is caused by AnalyticsEvent only defining structure for sending events to Pinpoint and not Kinesis.

Expected behavior

Analytics.record should allow me to send events via Kinesis provider without type-check errors.

Reproduction steps

npm i aws-amplify or npm i @aws-amplify/core @aws-amplify/analytics

In main app file configure Amplify


import { Amplify } from '@aws-amplify/core';
import awsconfig from './aws-exports';

Amplify.configure(awsconfig);

3. Import analytics from `@aws-amplify/analytics`
```typescript
import { Analytics, AWSKinesisProvider } from '@aws-amplify/analytics';

Configure analytics and add KinesisProvider pluggable
```
import awsconfig from 'src/aws-exports';
```

Analytics.addPluggable(new AWSKinesisProvider()); Analytics.configure({ AWSKinesis: { region: awsconfig.aws_project_region } });

5. Try to send event to Kinesis
```typescript
let streamName =
    'events-' + awsconfig.aws_user_files_s3_bucket.split('-')[1];

Analytics.record(
        {
            data: {
                // ... some data here
            },
            streamName
        },
        'AWSKinesis'
    );

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line Error: src/app/core/providers/analytics.provider.ts:15:5 - error TS2769: No overload matches this call. Overload 1 of 2, '(event: AnalyticsEvent, provider?: string): any', gave the following error. Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'AnalyticsEvent'. Object literal may only specify known properties, and 'data' does not exist in type 'AnalyticsEvent'. Overload 2 of 2, '(eventName: string, attributes?: EventAttributes, metrics?: EventMetrics): any', gave the following error. Argument of type '{ data: { ... }; streamName: string; }' is not assignable to parameter of type 'string'. 15 Analytics.record( ~~~~~~~~~~~~~~~~~ 16 { ~~~~~~~~~ ... 25 'AWSKinesis' ~~~~~~~~~~~~~~~~~~~~ 26 ); ~~~~~ ```

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

Additional information and screenshots

No response

chrisbonifacio commented 2 years ago

Hi @vojtech-simko 👋 thanks for raising this issue. I was able to reproduce the error and will label this as a bug for the team to look into further.

vojtech-simko commented 2 years ago

Thank you @chrisbonifacio 👍

christian-becker-ta commented 2 years ago

Any update on this or workaround? I have currently the issue, that my amplify application does not send the records to Kinesis stream, and therefore or do not get a trigger on my lambda function for post-process the data.

Would be happy about some hints.

chkrause commented 2 years ago

I'm highly interested in a solution to this issue. Do you have a timeline until when it will be fixed?

manickgm commented 2 years ago

I have worked around this issue by using the Kinesis pluggable provider itself.

https://github.com/aws-amplify/amplify-js/blob/f6e2ca25785bb30ab6040f1f8c163e6069ccc392/packages/analytics/src/Providers/AWSKinesisProvider.ts#L96

The sample code is as follows:

    const KinesisProvider = Analytics.getPluggable('AWSKinesis');
    KinesisProvider.record({
        event:{
        data: "Hello world",
        partitionKey: 'myPartitionKey', 
        streamName: 'firstangulartrialKinesis-dev' // Please refer "kinesisStreamId" output of the amplify-meta json for the correct stream name created by Amplify. 'amplify/backend/amplify-meta.json'
        },
       provider:"AWSKinesis"
      })

Please make Kinesis Provider is registered before this.

import { Analytics, AWSKinesisProvider } from 'aws-amplify';
Analytics.addPluggable(new AWSKinesisProvider());

Please confirm if this works for you.

ashika01 commented 2 years ago

Hi this issue is now fixed and merged in the latest release. Please let us know if this is still an issue and we can re-open this issue.

aws-amplify / amplify-js