profile
viewpoint
Michal Kvasničák michalkvasnicak @brosoft-sk Trnava, Slovakia Senior Full stack engineer @surglogs.com, founder of @brosoft-sk and @Byteclaw's magician

michalkvasnicak/babel-plugin-css-modules-transform 312

Extract css class names from required css module files, so we can render it on server.

michalkvasnicak/aws-lambda-graphql 242

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

michalkvasnicak/routex 43

THIS PROJECT IS NO LONGER MAINTAINED AND HAS BEEN UNPUBLISHED FROM NPM

michalkvasnicak/react-apollo-graphql 15

Get rid of decorators and use Apollo GraphQL queries and mutations in the simple and readable way.

michalkvasnicak/create-js-app 12

[DEPRECATED!! - see readme] Create full stack javascript applications with no configuration. Powered by webpack 2, eslint, flowtype, ...

michalkvasnicak/spust 12

Quickly bootstrap universal javascript application. No configuration needed.

michalkvasnicak/oauth2-server 6

Open source OAuth 2.0 server implementation of final draft for PHP and HHVM

michalkvasnicak/imaginarium 5

🖼️ Serverless javascript image processor based on Sharp

michalkvasnicak/work-in-timezone 5

🌍 Am I eligible to work in timezone? Share timezone where job is available.

michalkvasnicak/react-error-reporter 4

Simple error reporting using React components.

issue commentmichalkvasnicak/aws-lambda-graphql

WebSocket handshake: Unexpected response code: 502?

wss:// is the websocket endpoint so that’s correct. Did you look to your websocket handler lambda’s cloudwatch logs of there is some error? Otherwise it’s hard to help you without the code.

On Sat, 15 Aug 2020 at 00:24, miliu99 notifications@github.com wrote:

Ah, somehow I got that problem resolved, but get a new one:

WebSocket connection to 'wss:// 2nilfiusp1.execute-api.us-east-1.amazonaws.com/dev' failed: WebSocket is closed before the connection is established.

I'm wondering is this the right endpoint? In the document, it says "please provide the uri of the api gateway v2 endpoint", but I got it from serverless.yml output as:

endpoints:

ANY - https://ys13c4hyo4.execute-api.us-east-1.amazonaws.com/dev/

wss://2nilfiusp1.execute-api.us-east-1.amazonaws.com/dev

Is this v2? How do I know? In the serverless.yml there is no reference to v2.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/michalkvasnicak/aws-lambda-graphql/issues/107#issuecomment-674296157, or unsubscribe https://github.com/notifications/unsubscribe-auth/AABKU7B2XBVQAFO73BJ5KDDSAW2SZANCNFSM4P7ZJDXA .

-- Michal Kvasničák - web developer

Kontakt: web: www.kvasnicak.info mobil: +421 908 876 467 skype: misiak_michal

miliu99

comment created time in 11 hours

push eventmichalkvasnicak/michalkvasnicak

Michal Kvasničák

commit sha 78a48a447f72fbedc865bca85ce0ec0603606bb9

chore: update my personal readme

view details

push time in 3 days

create barnchmichalkvasnicak/michalkvasnicak

branch : master

created branch time in 3 days

created repositorymichalkvasnicak/michalkvasnicak

created time in 3 days

push eventByteclaw/visage

Michal Kvasničák

commit sha a1493318f75fe467fa3bc3ff35725109a48d5a73

chore: add funding

view details

push time in 3 days

issue openedmichalkvasnicak/aws-lambda-graphql

Projects that use this library

If you want to share your project that uses this library please do so here 🙂

created time in 3 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha eaed71bc444937557ed8d929fea3c6cde6b4a3ac

chore: add funding file

view details

push time in 3 days

issue closedmichalkvasnicak/aws-lambda-graphql

subscriptions not working properly

Hello michal,

Thank for making such a helpful package, i'm currently facing a minor problem with subscriptions, and here is whats going on.

I'm working on a app, where when a customer creates a new order (A react native application), which will trigger a mutation and then publish a subscription event to our web app (A react application), it successfully triggers and the new order is received and shown in the UI and shown in the event table in dynamodb.

const createOrder = async ({ NewOrderInputs }, _ ,{pubSub}) => {
  try {
    const orderNum = await nextOrderNum();
    
    const createdOrder = await new Orders({
      ...NewOrderInputs,
      customerId: "customerId",
      orderNumber: "orderNum",
    });

    createdOrder.save();

    pubSub.publish(NEW_ORDER, {newOrder: createdOrder});

    return createdOrder;
  } catch (error) {
    console.log("newOrderNoAuth -> error", error);
  }
};

Now when the web user accepts the new order, a mutation is triggered to change the order status to "Accepted" and publish a subscription event to our user in the RN app, here is when the subscription doesn't do what its suppose to.

const changeOrderStatus = async ({OrderStatusInput}, _ ,{pubSub}) => {
  const {status, eta, orderId} = OrderStatusInput;
  try{
    const currentDateAndTime = new Date();
    const estimatedDateAndTime = eta;

    const order = await Orders.findOneAndUpdate({ _id: orderId },{
      timeStampEta : eta ? estimatedDateAndTime : currentDateAndTime,
      orderStatus: status
    },{new:true});

    pubSub.publish(ORDER_STATUS_CHANGED, {orderStatusChanged: order });

    return true
  }catch(error){
    console.log("changeOrderStatus -> error", error)
  }
}

The first event is triggered but it doesn't go through as if its stuck mid way and nothing shows up in the RN UI and the event table in dynamodb, then when the same event is triggered with a new order status of "Ready", the first event of order status "Accepted" goes through and shows up in the RN UI as well as the event table in dynamodb, and the last order status of "Completed" gets the Ready event.

I am not sure as to why this happening and your help would be much appreciated.

also this is happening only when its deployed to aws, works properly when the server is running on local .

here is what my subscriptions look like

const subscriptions = {
  helloWorldSub: {
    resolve: (rootValue) => rootValue,
    subscribe: (rootValue, args, ctx, info) => ctx.pubSub.subscribe(HELLO_WORLD)(rootValue, args, ctx, info),
  },
  orderStatusChanged: {
    subscribe: withFilter(
      (root, args, ctx, info) => ctx.pubSub.subscribe(ORDER_STATUS_CHANGED)(root, args, ctx, info),
      (payload, variables) =>
        payload.orderStatusChanged.customerId === variables.customerId
    ),
  },
  newOrder: {
    subscribe: withFilter(
      (root, args, ctx, info) => ctx.pubSub.subscribe(NEW_ORDER)(root, args, ctx, info),
      (payload, variables) => payload.newOrder.storeId === variables.storeId
    ),
  },
};

closed time in 4 days

Adel-ak

issue commentmichalkvasnicak/aws-lambda-graphql

subscriptions not working properly

@Adel-ak unfortunately I don't know why it worked only for newOrder subscription. There can be numerous reasons why. For example if you have some nested resolvers on the result type of createOrder mutation that you ask for when you send this mutation, it could cause event loop to last longer and process the published event. But changeOrderStatus returned only boolean so maybe the function just finished its lifetime and subsequent call to it maybe flushed the event. Hard to say.

In examples there is always await pubSub.publish(...) so I don't think it's necessary to add something to documentation but thank you 🙂 .

Adel-ak

comment created time in 4 days

created tagmichalkvasnicak/aws-lambda-graphql

tagaws-lambda-graphql@1.0.0-alpha.14

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 4 days

created tagmichalkvasnicak/aws-lambda-graphql

tagserverless-chat-example-server@1.0.0-alpha.14

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 4 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha b4dde6cf6f64775fe32c7691874ea14ddaf58a08

chore: update changelog and contributors list

view details

Michal Kvasničák

commit sha 9eef6a10a4ecf3993961226803552d425a9e2bb2

chore(release): release - aws-lambda-graphql@1.0.0-alpha.14 - serverless-chat-example-server@1.0.0-alpha.14

view details

push time in 4 days

push eventmichalkvasnicak/aws-lambda-graphql

pepe_mbp

commit sha 06d074f4ab9b05058959f2b34d82e55e52413cc7

add onWebsocketConnect handler

view details

pepe_mbp

commit sha 397326cd3f428b4c57ac6bbb876feaaf7053bc22

remove unnecessary responses

view details

pepe_mbp

commit sha bfb2e960225ca7b3865f32ddaa34b9e14df41caf

prettier format

view details

pepe_mbp

commit sha b22dd7bbae7d04d2995e809661c002cd3a830ae8

fix(test): fix existing tests

view details

pepe_mbp

commit sha e5f1246f9ab3f2a950df1177b03a937b748fa17f

feat(tests): add tests for onWebsocketConnect

view details

push time in 4 days

PR merged michalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

Hey..

We use IAM for our auth, and have been using it with this lib for normal queries and mutations without issues. Getting started with subscriptions now, and had to do a little hack to be able to access the IAM info. Thought I'd share it with you in case you find it useful.

I wasn't sure if I could put this info inside connection.data.context, so I just left it in connection.data.identity

The way I am using this is in onConnect, I access the identity data from the connection object, I build my user context, and return it from onConnect, then I have it accessible in the resolvers.

Not sure if that's the most straightforward way to weave the identity data down to resolvers, happy to hear of better ways to do it.

PS: Thanks for the great library, it's saved our team a lot of work and time, and it's just a pleasure to use.

Cheers!

Pepe

+169 -6

12 comments

3 changed files

jcane86

pr closed time in 4 days

pull request commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

Great job, thank you very much!

jcane86

comment created time in 4 days

issue closedmichalkvasnicak/aws-lambda-graphql

How to integrate with Apollo Server?

Thanks for developing such an awesome package for us. I have a stupid question here.

What I want to achieve is that I want to merge this package into our main application which is based on Apollo Server. In your example, the endpoints are all generated from the "Server" class. Question is how could I integate it with Apollo Server, is there any sample?

Thanks CJ

closed time in 4 days

powerfulj

Pull request review commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

 export class Server<         // based on routeKey, do actions         switch (event.requestContext.routeKey) {           case '$connect': {+            const {+              onWebsocketConnect,+            } = this.subscriptionOptions || {};+             // register connection             // if error is thrown during registration, connection is rejected             // we can implement some sort of authorization here             const endpoint = extractEndpointFromEvent(event); -            await this.connectionManager.registerConnection({+            const connection = await this.connectionManager.registerConnection({               endpoint,               connectionId: event.requestContext.connectionId,             }); +            let newConnectionContext = {}++            if (onWebsocketConnect) {+              try {+                const result = await onWebsocketConnect(+                  connection,+                  event,+                  lambdaContext,+                );++                if (result === false) {+                  throw new Error('Prohibited connection!');+                } else if (result !== null && typeof result === 'object') {+                  newConnectionContext = result+                }+              } catch (err) {+                const errorResponse = formatMessage({+                  type: SERVER_EVENT_TYPES.GQL_ERROR,+                  payload: { message: err.message },+                });++                await this.connectionManager.sendToConnection(+                  connection,+                  errorResponse,+                );+                await this.connectionManager.closeConnection(connection);

This one should be replaced with this.connectionManager.unregisterConnecition which will delete the connection from Connection store but won't call ApiGatewayManager.

jcane86

comment created time in 4 days

Pull request review commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

 export class Server<               // set connection context which will be available during graphql execution               const connectionData = {                 ...connection.data,-                context: newConnectionContext,+                context: {...connection.data.context, ...newConnectionContext},

Please format the code with prettier 🙂

jcane86

comment created time in 4 days

Pull request review commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

 export class Server<         // based on routeKey, do actions         switch (event.requestContext.routeKey) {           case '$connect': {+            const {+              onWebsocketConnect,+            } = this.subscriptionOptions || {};+             // register connection             // if error is thrown during registration, connection is rejected             // we can implement some sort of authorization here             const endpoint = extractEndpointFromEvent(event); -            await this.connectionManager.registerConnection({+            const connection = await this.connectionManager.registerConnection({               endpoint,               connectionId: event.requestContext.connectionId,             }); +            let newConnectionContext = {}++            if (onWebsocketConnect) {+              try {+                const result = await onWebsocketConnect(+                  connection,+                  event,+                  lambdaContext,+                );++                if (result === false) {+                  throw new Error('Prohibited connection!');+                } else if (result !== null && typeof result === 'object') {+                  newConnectionContext = result+                }+              } catch (err) {+                const errorResponse = formatMessage({+                  type: SERVER_EVENT_TYPES.GQL_ERROR,+                  payload: { message: err.message },+                });++                await this.connectionManager.sendToConnection(

I think that it's not possible to return anything in $connect phase. So this should be removed I think.

jcane86

comment created time in 4 days

Pull request review commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

 All options from Apollo Lambda Server and - **onError** (`(err: any) => void`, `optional`) - use to log errors from websocket handler on unknown error - **subscriptionManager** (`ISubscriptionManager`, `required`) - **subscriptions** (`optional`)-  - **`onConnect(messagePayload: object, connection: IConnection, event: APIGatewayWebSocketEvent, context: LambdaContext): Promise<boolean|object> | object | boolean`** (`optional`) - Return an object to set a context to your connection object saved in the database e.g. for saving authentication details+  - **`onWebsocketConnect(connection: IConnection, event: APIGatewayWebSocketEvent, context: LambdaContext): Promise<boolean|object> | object | boolean`** (`optional`) - onWebsocketConnect is called when the Websocket connection is initialized ($connect route).  Return an object to set a context to your connection object saved in the database e.g. for saving authentication details. This is especially useful to get authentication details (API GW authorizers only run in $connect route)

I think this name is good! 👍

jcane86

comment created time in 4 days

issue commentmichalkvasnicak/aws-lambda-graphql

subscriptions not working properly

Hey @Adel-ak , please try to append await to pubSub.publish() because it's async and maybe your event loop closes sooner so eventStore won't get a chance to store the event to dynamodb.

Have you checked logs of your functions? I saw this happening in chat app when I deployed buggy version of the server where processing of DynamoDB event stream failed and it caused the stream to pause. Then when I deployed fixed version and published a new message it resumed the stream and the client received all the failed messages + the new one.

Adel-ak

comment created time in 4 days

issue commentmichalkvasnicak/aws-lambda-graphql

How to integrate with Apollo Server?

It already uses ApolloServer for HTTP requests because Server extends ApolloServer from apollo-server-lambda, for WebSocket connections it extends it with the handler for WebSocket events.

powerfulj

comment created time in 6 days

pull request commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

Thank you very much! In that case it seems we need to add a way how to set up a data on connection during $connect phase that can be leveraged for any authorizer. I think your approach is correct but let's do it more "generic" if you agree.

We have onConnect handler already occupied (https://github.com/michalkvasnicak/aws-lambda-graphql/blob/master/packages/aws-lambda-graphql/src/Server.ts#L70). I think it'd be great to add a sentence or two to it's type definition so developers can easily find out when in lifecycle this event handler is called.

Then we can introduce another event handler that can return a data, that will be stored on connection. I'm not sure what name of an event handler to use, maybe onConnectionReceived or something better. Set up connection data in $connect phase only and only if the handler is specified and resolves to {[key: string]: any }.

jcane86

comment created time in 10 days

pull request commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

Could you point me to the documentation where I can verify it? If that's the case, then the problem is that $connect handling does nothing except registers the connection. If we're limited to use it only during $connect then we'd need to provide some sort of handler (like onConnect) that can be called during $connect phase and store something on connection.

I'd appreciate a link to docs and maybe some easy example of how cognito is treated by Apigw for websockect connections.

jcane86

comment created time in 10 days

pull request commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

@jcane86 onConnect is called when server receives GQL_CONNECTION_INIT message from a client (https://github.com/michalkvasnicak/aws-lambda-graphql/blob/master/packages/aws-lambda-graphql/src/Server.ts#L300).

Then if everything is OK, server will return GQL_CONNECTION_ACK (https://github.com/michalkvasnicak/aws-lambda-graphql/blob/master/packages/aws-lambda-graphql/src/Server.ts#L349).

The problem is that Apollo client doesn't wait for ACK if I remember correctly. So maybe the problem is, that your client implementation fires subscriptions or operations in the meantime between INIT and ACK, so your context doesn't have data necessary to perform auth. But in that case you should see errors in logs or receive errors in responses 🤔

jcane86

comment created time in 10 days

pull request commentmichalkvasnicak/aws-lambda-graphql

Enable Cognito (IAM) auth for subscriptions

@jcane86 Could this have something in common with #71 ? Basically you return some sort of an ID from onConnect that can be used in context to hydrate identity.

The problem is that I don't want to pollute the typings because of that.

Also thank you for kind words, I'm glad this library helps 🙂

jcane86

comment created time in 10 days

push eventByteclaw/visage

Michal Kvasničák

commit sha fc451759b157e5eb0d525f7c0a183f87299e02fb

chore(release): release - @byteclaw/visage-core@1.0.0-alpha.11 - @byteclaw/visage-docs@1.0.0-alpha.50 - @byteclaw/visage-themes@1.0.0-alpha.50 - @byteclaw/visage@1.0.0-alpha.50

view details

push time in 10 days

issue openedByteclaw/visage

Investigate depthFirstObjectMerge util performance

It seems that initial mount takes too long especially for components with big style sheet that is extended multiple times.

created time in 10 days

push eventByteclaw/visage

Michal Kvasničák

commit sha 862dfa6a6d601a1eee53e2d8d088efb71a80baae

feat: add intermediatory style sheet resolution cache

view details

push time in 10 days

delete branch Byteclaw/visage

delete branch : feature/resolution-cache

delete time in 10 days

issue closedByteclaw/visage

Investigate caching

It seems that Responsive style generator has performance problems with large styles. It makes sense, because the styles are generated for each breakpoint in an app, but the problem is that if component is shared across app, we don't need to generate styles over and over again because the instance is same unless a developer use styles prop or styles function.

We need to find a way to cache styles for same component across whole app and optimise it. For example if I have a Button and I use it on 10 places, I need to generate styles only for first render and then next 9 instance should just use it.

For example combination of ResponsiveDesignSystem + createResponsiveEmotionStyleGenerator seems to be problematic, because resizing of a window can cause recompute because responsive DesignSystem uses window.matchMedia to match current breakpoint, otherwise IsBreakpoint wouldn't work. This causes cache to reset on each change. We need to add check to IsBreakpoint component to warn developer if DesignSystem is not responsive.

We need to find out how to cache styles maybe for each breakpoint without reset? Maybe cache of all breakpoints and reset cache only on theme or styleGenerator change.

closed time in 10 days

michalkvasnicak

PR opened Byteclaw/visage

feat: add intermediatory style sheet resolution cache

Closes #639

+117 -20

0 comment

8 changed files

pr created time in 11 days

create barnchByteclaw/visage

branch : feature/resolution-cache

created branch time in 11 days

issue commentByteclaw/visage

Investigate caching

Also we maybe should preserve cache if breakpoint is changed and cache per breakpoint and reset whole cache only if theme or generator is changed.

michalkvasnicak

comment created time in 11 days

push eventByteclaw/visage

dependabot[bot]

commit sha e8c5da5a9318e117f974f3c71744fe90b78fcb9d

chore(deps): bump elliptic from 6.5.2 to 6.5.3 Bumps [elliptic](https://github.com/indutny/elliptic) from 6.5.2 to 6.5.3. - [Release notes](https://github.com/indutny/elliptic/releases) - [Commits](https://github.com/indutny/elliptic/compare/v6.5.2...v6.5.3) Signed-off-by: dependabot[bot] <support@github.com>

view details

push time in 11 days

delete branch Byteclaw/visage

delete branch : dependabot/npm_and_yarn/elliptic-6.5.3

delete time in 11 days

PR merged Byteclaw/visage

chore(deps): bump elliptic from 6.5.2 to 6.5.3 dependencies

Bumps elliptic from 6.5.2 to 6.5.3. <details> <summary>Commits</summary> <ul> <li><a href="https://github.com/indutny/elliptic/commit/8647803dc3d90506aa03021737f7b061ba959ae1"><code>8647803</code></a> 6.5.3</li> <li><a href="https://github.com/indutny/elliptic/commit/856fe4d99fe7b6200556e6400b3bf585b1721bec"><code>856fe4d</code></a> signature: prevent malleability and overflows</li> <li>See full diff in <a href="https://github.com/indutny/elliptic/compare/v6.5.2...v6.5.3">compare view</a></li> </ul> </details> <br />

Dependabot compatibility score

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


<details> <summary>Dependabot commands and options</summary> <br />

You can trigger Dependabot actions by commenting on this PR:

  • @dependabot rebase will rebase this PR
  • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
  • @dependabot merge will merge this PR after your CI passes on it
  • @dependabot squash and merge will squash and merge this PR after your CI passes on it
  • @dependabot cancel merge will cancel a previously requested merge and block automerging
  • @dependabot reopen will reopen this PR if it is closed
  • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
  • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
  • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
  • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
  • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
  • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
  • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
  • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

</details>

+6 -6

0 comment

1 changed file

dependabot[bot]

pr closed time in 11 days

issue commentByteclaw/visage

Investigate caching

Maybe it could be sufficient to add cache here https://github.com/Byteclaw/visage/blob/5861ae80071720be79b31fe1ef012eebb887b485/packages/visage-core/src/styleSheet/resolveStyleSheets.ts#L16 so if style sheets are not changed at all we'll store the result for a given breakpoint in WeakMap. Another option is to add extra cache for resolveStyleSheet call so at least if the list of style sheet changes, we can skip resolution of already known style sheets.

michalkvasnicak

comment created time in 11 days

issue commentByteclaw/visage

Investigate caching

It seems that maybe caching intermediary stylesheets could help a little. Basically the point is, that if component receives parentStyles, those style sheet can be already resolved so maybe we should cache them in resolveStyleSheet and use the result directly if there is any.

michalkvasnicak

comment created time in 11 days

issue commentmichalkvasnicak/aws-lambda-graphql

Add debug mode and logs

@clmntrss Ok I don't see any problem with optional debug flag. Could you prepare a PR ?

clmntrss

comment created time in 12 days

issue commentmichalkvasnicak/aws-lambda-graphql

Add debug mode and logs

@clmntrss what would you like to log?

clmntrss

comment created time in 17 days

issue openedByteclaw/visage

Investigate caching

It seems that Responsive style generator has performance problems with large styles. It makes sense, because the styles are generated for each breakpoint in an app, but the problem is that if component is shared accross app, we don't need to generate styles over and over again because the instance is same unless a developer use styles prop or styles function.

created time in 17 days

issue openedByteclaw/visage

BorderRadius theme styler is not applied to border*Radius props

borderRadius theme setting is applied only to borderRadius CSS prop, but in case we want granular control e.g. borderTopLeftRadius, it's not applied.

created time in 19 days

issue openedByteclaw/visage

[Tabs] - it's impossible to override styling more than once

For example you have 2 versions of Tabs with different visuals in your app. If you change the looking using face it's impossible to create second version too, because face will apply on both versions.

The solution could be to change API so user can provide custom components like TabNavigationButton, etc.

created time in 19 days

issue closedmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

Hello,

I've been trying over the past few days to get subscriptions working with my application. I set things up like you did in the example and I used Serverless to deploy it to AWS. However, I can't get subscriptions either on the website or testing with playground.


In the dev tools, I can see that it is connecting to the webSocket, and receiving an acknowledgement.

image

And everything else seems to work. The mutations and the queries.

In DynamoDB, all the tables are being created I believe

image

But I noticed that the subscriptions table is always empty. There is some activity when it comes to reading but none when it comes to writing.

image

I'm attaching my serverless.yml, graphql.js (index.js) and also the subscription resolvers.


Serverless.yml

provider:
  name: aws
  runtime: nodejs10.x
  region: us-east-1 # NOTE: change with your preferred region
  memorySize: 256

  iamRoleStatements:
    - Effect: Allow
      Action:
        - execute-api:ManageConnections
      Resource: "arn:aws:execute-api:*:*:*/dev/POST/@connections/*"
    - Effect: Allow
      Action:
        - dynamodb:DeleteItem
        - dynamodb:GetItem
        - dynamodb:PutItem
        - dynamodb:UpdateItem
      Resource: !GetAtt ConnectionsDynamoDBTable.Arn
    - Effect: Allow
      Action:
        - dynamodb:DescribeStream
        - dynamodb:GetRecords
        - dynamodb:GetShardIterator
        - dynamodb:ListStreams
      Resource: !GetAtt EventsDynamoDBTable.StreamArn
    - Effect: Allow
      Action:
        - dynamodb:PutItem
      Resource: !GetAtt EventsDynamoDBTable.Arn
    - Effect: Allow
      Action:
        - dynamodb:BatchWriteItem
        - dynamodb:DeleteItem
        - dynamodb:GetItem
        - dynamodb:PutItem
        - dynamodb:Query
        - dynamodb:Scan
      Resource: !GetAtt SubscriptionsDynamoDBTable.Arn
    - Effect: Allow
      Action:
        - dynamodb:BatchWriteItem
        - dynamodb:DeleteItem
        - dynamodb:GetItem
        - dynamodb:PutItem
      Resource: !GetAtt SubscriptionOperationsDynamoDBTable.Arn

functions:
  wsHandler:
    handler: graphql.handleWebSocket
    events:
      - websocket:
          route: $connect
      - websocket:
          route: $disconnect
      - websocket:
          route: $default
  eventProcessorHandler:
    handler: graphql.handleEvents
    events:
      - stream:
          enabled: true
          type: dynamodb
          arn:
            Fn::GetAtt: [EventsDynamoDBTable, StreamArn]
  # this one is optional (if you want to support HTTP)
  httpHandler:
    handler: graphql.handleHTTP
    events:
      - http:
          path: /
          method: any
          cors: true
      - http:
          path: /graphiql
          method: any
          cors: true

resources:
  Resources:
    ConnectionsDynamoDBTable:
      Type: AWS::DynamoDB::Table
      Properties:
        # see DynamoDBConnectionManager
        TableName: Connections
        AttributeDefinitions:
          - AttributeName: id
            AttributeType: S
        BillingMode: PAY_PER_REQUEST
        KeySchema:
          # connection id
          - AttributeName: id
            KeyType: HASH
        # This one is optional (all connections have 2 hours of lifetime in ttl field but enabling TTL is up to you)
        TimeToLiveSpecification:
          AttributeName: ttl
          Enabled: true

    SubscriptionsDynamoDBTable:
      Type: AWS::DynamoDB::Table
      Properties:
        # see DynamoDBSubscriptionManager
        TableName: Subscriptions
        AttributeDefinitions:
          - AttributeName: event
            AttributeType: S
          - AttributeName: subscriptionId
            AttributeType: S
        BillingMode: PAY_PER_REQUEST
        KeySchema:
          - AttributeName: event
            KeyType: HASH
          - AttributeName: subscriptionId
            KeyType: RANGE
        # This one is optional (all subscriptions have 2 hours of lifetime in ttl field but enabling TTL is up to you)
        TimeToLiveSpecification:
          AttributeName: ttl
          Enabled: true

    SubscriptionOperationsDynamoDBTable:
      Type: AWS::DynamoDB::Table
      Properties:
        # see DynamoDBSubscriptionManager
        TableName: SubscriptionOperations
        AttributeDefinitions:
          - AttributeName: subscriptionId
            AttributeType: S
        BillingMode: PAY_PER_REQUEST
        KeySchema:
          - AttributeName: subscriptionId
            KeyType: HASH
        # This one is optional (all subscription operations have 2 hours of lifetime in ttl field but enabling TTL is up to you)
        TimeToLiveSpecification:
          AttributeName: ttl
          Enabled: true

    EventsDynamoDBTable:
      Type: AWS::DynamoDB::Table
      Properties:
        # see DynamoDBEventStore
        TableName: Events
        KeySchema:
          - AttributeName: id
            KeyType: HASH
        BillingMode: PAY_PER_REQUEST
        # see ISubscriptionEvent
        AttributeDefinitions:
          - AttributeName: id
            AttributeType: S
        StreamSpecification:
          StreamViewType: NEW_IMAGE
        # This one is optional (all events have 2 hours of lifetime in ttl field but enabling TTL is up to you)
        TimeToLiveSpecification:
          AttributeName: ttl
          Enabled: true

graphql.js

const { tradeTokenForMember, authenticated } = require("./middleware/is-auth");
const {
	DynamoDBConnectionManager,
	DynamoDBEventProcessor,
	DynamoDBEventStore,
	DynamoDBSubscriptionManager,
	PubSub,
	Server,
} = require("aws-lambda-graphql");

const typeDefs = require("./graphql/schema/index");
const resolvers = require("./graphql/resolvers/index");

const eventStore = new DynamoDBEventStore();
const eventProcessor = new DynamoDBEventProcessor();
const subscriptionManager = new DynamoDBSubscriptionManager();
const connectionManager = new DynamoDBConnectionManager({
	subscriptionManager,
});
const pubsub = new PubSub({ eventStore });

const server = new Server({
	// accepts all the apollo-server-lambda options and adds few extra options
	// provided by this package
	connectionManager,
	eventProcessor,
	resolvers,
	subscriptionManager,
	typeDefs,
	playground: {
		endpoint:
			"******/dev/graphiql",
		subscriptionEndpoint:
			"******/dev",
	},
	context: async ({ event, lambdaContext }) => {
		let token = null;
		let currentMember = null;
		console.log("Set token for context");
		try {
			token = event.headers.Authorization;
			if (token) {
				currentMember = await tradeTokenForMember(token);
			}
		} catch (err) {
			console.warn(`Unable to authenticate using auth token: ${token}`);
		}
		return {
			token,
			currentMember,
			pubsub,
			headers: event.headers,
			event,
			lambdaContext,
		};
	},
});

module.exports.handleWebSocket = server.createWebSocketHandler();
module.exports.handleHTTP = server.createHttpHandler({
	cors: {
		origin: "*",
		credentials: false,
	},
});
// this creates dynamodb event handler so we can send messages to subscribed clients
module.exports.handleEvents = server.createEventHandler();

resolver


	Subscription: {
		onNewRequest: {
			//! Will need WithFilter here to filter for only "Processing transactions"
			resolve: (rootValue) => {
				return rootValue;
			},
			subscribe: (rootValue, args, ctx, info) => {
				ctx.pubsub.subscribe(TRANSACTION_SUBSCRIPTION)(
					rootValue,
					args,
					ctx,
					info
				);
			},

Please let me know if you need more info

P.s. I'm a self proclaimed noob so please let me know if my logic is wrong

closed time in 20 days

ObinnaAka

issue commentmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

I haven't found any error in your repository in server package. I haven't tested it because it relies on Mongo so it's not really something I can just quickly run.

The error logged in your logs can be caused by invalid parsing of GraphQL operation so it would be helpful to see a JSON operation that is being sent when the client is subscribing to some subscription. The problem happens in execute function which is called in web socket handler created by server.createWebSocketHandler(). If you can send a mutation or query and get correct result then the problem is in subscription operation. So I'd try sending some test query and mutation over websocket if the server returns correct response.

But as I said, I don't think this is a problem with aws-lambda-graphql library. So I'm closing this unless you provide me with some minimum repository that I can run without any problem.

ObinnaAka

comment created time in 20 days

issue commentmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

What version of aws-lambda-graphql do you have? Can you upgrade to 1.0.0-alpha.13 because as I wrote above, versions alpha.10-12 are deprecated because of an error in headers processing.

If that won't help, can you provide a minimal project repository? But I don't think this is a problem with aws-lambda-graphql. There must be something else going on in your code.

I need to see how you publish events, and if you can, provide CloudWatch logs of websocket lambda handler after client subscribes, because if you don't have subscriptions in your table, an error should occur on subscription.

ObinnaAka

comment created time in 22 days

issue commentByteclaw/visage

[UI] - use :focus-visible

@jurajhrib there is an interesting package https://react-spectrum.adobe.com/react-aria/index.html and they have focus ring and other accessibility features solved by hooks, maybe it would be beneficial to take a look on their implementation, if we can use their package or just get inspired.

michalkvasnicak

comment created time in 23 days

created tagmichalkvasnicak/aws-lambda-graphql

tagaws-lambda-graphql@1.0.0-alpha.13

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 24 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha 89d06c86db77ea21b27abd85fe896cc6051dbb01

chore: update changelog

view details

Michal Kvasničák

commit sha 4987022931e2a23cbf3a0c6e9eb7536268a9f920

chore(release): release - aws-lambda-graphql@1.0.0-alpha.13 - serverless-chat-example-server@1.0.0-alpha.13

view details

push time in 24 days

created tagmichalkvasnicak/aws-lambda-graphql

tagserverless-chat-example-server@1.0.0-alpha.13

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 24 days

issue closedmichalkvasnicak/aws-lambda-graphql

Fix doing includes over not existing header.

After #97 it stopped working because the header is not always present.

closed time in 24 days

michalkvasnicak

delete branch michalkvasnicak/aws-lambda-graphql

delete branch : fix/check-for-sec-websocket-protocol-header

delete time in 24 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha 79f3c6c18a542a3793d85d25c93c4d18a3ce8c68

fix: check sec-websocket-protocol only if provided (#101)

view details

push time in 24 days

issue openedmichalkvasnicak/aws-lambda-graphql

Fix doing includes over not existing header.

After #97 it stopped working because the header is not always present.

created time in 24 days

issue commentmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

Error in your logs can be caused by this line https://github.com/michalkvasnicak/aws-lambda-graphql/blob/master/packages/aws-lambda-graphql/src/execute.ts#L97 which means that operation you sent is malformed.

But I'd need more information. Is it caused by sending a mutation or does it happen when you're trying subscribe?

ObinnaAka

comment created time in 24 days

issue commentmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

How do you test it ? Could you please explain client side steps you do in order to test your server implementation? Because I don't see any problem with the server code you provided.

ObinnaAka

comment created time in 24 days

push eventByteclaw/visage

Michal Kvasničák

commit sha 5861ae80071720be79b31fe1ef012eebb887b485

chore(release): release - @byteclaw/visage-docs@1.0.0-alpha.49 - @byteclaw/visage-themes@1.0.0-alpha.49 - @byteclaw/visage@1.0.0-alpha.49

view details

push time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage@1.0.0-alpha.49

Visage design system

created time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage-themes@1.0.0-alpha.49

Visage design system

created time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage-docs@1.0.0-alpha.49

Visage design system

created time in 24 days

push eventByteclaw/visage

Michal Kvasničák

commit sha b30f8fef37e5d0a73e11a2b7783387190fc43c78

fix(visage): detect breakpoints in effect so app can be hydrated

view details

push time in 24 days

delete branch Byteclaw/visage

delete branch : revert-breakpoint-detection

delete time in 24 days

PR merged Byteclaw/visage

fix(visage): detect breakpoints in effect so app can be hydrated

Reverts the behaviour of using effect to detect breakpoints with matchMedia otherwise SSR hydration is broken.

+2 -2

0 comment

1 changed file

michalkvasnicak

pr closed time in 24 days

PR opened Byteclaw/visage

fix(visage): detect breakpoints in effect so app can be hydrated

Reverts the behaviour of using effect to detect breakpoints with matchMedia otherwise SSR hydration is broken.

+2 -2

0 comment

1 changed file

pr created time in 24 days

create barnchByteclaw/visage

branch : revert-breakpoint-detection

created branch time in 24 days

push eventByteclaw/visage

Michal Kvasničák

commit sha 1f53733b441510366590913884d96c0f325fdc61

chore(release): release - @byteclaw/visage-docs@1.0.0-alpha.48 - @byteclaw/visage-themes@1.0.0-alpha.48 - @byteclaw/visage@1.0.0-alpha.48

view details

push time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage-docs@1.0.0-alpha.48

Visage design system

created time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage-themes@1.0.0-alpha.48

Visage design system

created time in 24 days

created tagByteclaw/visage

tag@byteclaw/visage@1.0.0-alpha.48

Visage design system

created time in 24 days

push eventByteclaw/visage

Michal Kvasničák

commit sha dd49fa720e9f91d6d0fe6264b905f1c1030ce32b

fix(visage): correct window detection

view details

push time in 25 days

delete branch Byteclaw/visage

delete branch : fix/ssr-detection

delete time in 25 days

PR merged Byteclaw/visage

fix(visage): correct window detection

Closes #634

+1 -1

0 comment

1 changed file

michalkvasnicak

pr closed time in 25 days

PR opened Byteclaw/visage

fix(visage): correct window detection

Closes #634

+1 -1

0 comment

1 changed file

pr created time in 25 days

create barnchByteclaw/visage

branch : fix/ssr-detection

created branch time in 25 days

issue openedByteclaw/visage

Fix SSR detection in breakpoint detection

created time in 25 days

delete branch Byteclaw/visage

delete branch : feature/breakpoint-detection-on-render

delete time in 25 days

push eventByteclaw/visage

Michal Kvasničák

commit sha 56c5935737e15322c4fb837bb952c9b84de486a8

feat(visage): detect breakpoint in render phase

view details

push time in 25 days

issue closedByteclaw/visage

Detect breakpoint using matchMedia on initial render and not in effect

Basically we want to detect current breakpoint sooner than useEffect but we want to unregister listeners on unmount.

closed time in 25 days

michalkvasnicak

PR opened Byteclaw/visage

feat(visage): detect breakpoint in render phase

Closes #632

+168 -10

0 comment

2 changed files

pr created time in 25 days

create barnchByteclaw/visage

branch : feature/breakpoint-detection-on-render

created branch time in 25 days

issue openedmichalkvasnicak/aws-lambda-graphql

Add validation for parameters in constructors

Basically now we're relying only on Typescript typecheck but some users are using Javascript so it'd be good to have native validation for options in constructors.

created time in 25 days

issue commentmichalkvasnicak/aws-lambda-graphql

Subscriptions and SubscriptionsOptions DB Empty

Ok I found a problem, you need to pass SubscriptionManager to ConnectionManager in subscriptions option (https://github.com/michalkvasnicak/aws-lambda-graphql/blob/master/packages/aws-lambda-graphql/src/DynamoDBConnectionManager.ts#L38).

Just change:

const connectionManager = new DynamoDBConnectionManager({
	subscriptionManager,
});

to

const connectionManager = new DynamoDBConnectionManager({
	subscriptions: subscriptionManager,
});

I think you should have errors in cloud watch logs for your function.

ObinnaAka

comment created time in 25 days

pull request commentmichalkvasnicak/aws-lambda-graphql

feat: remove multiValueHeader not supported by WebSocket

Thank you, good work :)

clmntrss

comment created time in 25 days

created tagmichalkvasnicak/aws-lambda-graphql

tagserverless-chat-example-server@1.0.0-alpha.12

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 25 days

created tagmichalkvasnicak/aws-lambda-graphql

tagaws-lambda-graphql@1.0.0-alpha.12

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 25 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha 6bd425d907b99cba29bf1584d6953889947ca104

chore: update changelog

view details

Michal Kvasničák

commit sha d354768621530a0999fd5055ef973ca650e37811

chore(release): release - aws-lambda-graphql@1.0.0-alpha.12 - serverless-chat-example-server@1.0.0-alpha.12

view details

push time in 25 days

push eventmichalkvasnicak/aws-lambda-graphql

Clement

commit sha 214a4bd1fb8a8cb08e0ff4ac12309b1a4169325a

fix: remove multiValueHeader not supported by WebSocket (#98) Co-authored-by: Clément Rousseau <crousseau@greenflex.com>

view details

push time in 25 days

PR merged michalkvasnicak/aws-lambda-graphql

feat: remove multiValueHeader not supported by WebSocket

Removing multiValueHeader not compatible with web-socket and might be source of error in the code.

I should had remove it in the last PR

+0 -39

0 comment

2 changed files

clmntrss

pr closed time in 25 days

push eventmichalkvasnicak/aws-lambda-graphql

Michal Kvasničák

commit sha e8f251484318ce7086ad07bbd9f5765e46e8456f

chore: update readme and changelo

view details

Michal Kvasničák

commit sha 313066f48e8162038a4a35217fc5966170cb79a6

chore(release): release - aws-lambda-graphql@1.0.0-alpha.11 - serverless-chat-example-server@1.0.0-alpha.11

view details

push time in 25 days

created tagmichalkvasnicak/aws-lambda-graphql

tagaws-lambda-graphql@1.0.0-alpha.11

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 25 days

created tagmichalkvasnicak/aws-lambda-graphql

tagserverless-chat-example-server@1.0.0-alpha.11

Use AWS Lambda + AWS API Gateway v2 for GraphQL subscriptions over WebSocket and AWS API Gateway v1 for HTTP

created time in 25 days

push eventmichalkvasnicak/aws-lambda-graphql

Clément Rousseau

commit sha 47cd86e4c997a36943effff78fba6ec88928053f

feat: remove multiple headers not support by websocket

view details

push time in 25 days

PR merged michalkvasnicak/aws-lambda-graphql

feat: remove multiple headers not support by websocket

PR following the modifications you made after the issue about returning empty Sec-Webprotocol (#93)

The changes you made throwed a new error that made the problem a little more understandable.

Looks like it's not possible to return a few headers even if you receive multiple. Server has to chose only one protocol he wants to give back to the client.

I think "graphql-ws" is the best to return since you need to use it in subscription-transport-ws

https://github.com/apollographql/subscriptions-transport-ws/blob/0e81e9e45929db2f4d2699cf34229fb4cb2144e8/src/protocol.ts#L1

Error received on Chrome : Error during WebSocket handshake: 'Sec-WebSocket-Protocol' header must not appear more than once in a response

+4 -3

0 comment

1 changed file

clmntrss

pr closed time in 25 days

more