// SAMPLE GRAPHQL QUERY VIA FETCH, made by code exporter in Hasura. ~Sahil
This is an example snippet - you should consider tailoring it
to your service.

async function fetchGraphQL(operationsDoc, operationName, variables) {
  const result = await fetch(
      method: "POST",
      body: JSON.stringify({
        query: operationsDoc,
        variables: variables,
        operationName: operationName

  return await result.json();

const operationsDoc = `
  mutation MyMutation($likes: Int = 2) {
    insert_blogs(objects: {title: "awsm blog", year: 2022, url: "", likes: $likes}) {
      returning {

function executeMyMutation(likes) {
  return fetchGraphQL(
    {"likes": likes}

async function startExecuteMyMutation(likes) {
  const { errors, data } = await executeMyMutation(likes);

  if (errors) {
    // handle those errors like a pro

  // do something great with this precious data


Creating managed permissions - Yo

Awesome: Source: Hasura Authorization #EasyGraphQLwHasura, all this in blogpost: Click here.

  1. image
  2. image
  3. Add Table: image
  4. Add foreign key like that: image
  5. Add this relationship: image
  6. We are going to use deafult employees text there: image
  7. Add the object relationship as well (This is Manager Relation): image
  8. Add another table and save the table: image
  9. Now Add foreign key like that: image
  10. We can (but we don’t) add relation like we added earlier as shwon in there but we’ll use Track way to add relationship this time(see next screenshot): image
  11. Click on Track All to track all realtions automatically: image
  12. We can see that relationship is set successfully between payroll and employee: image
  13. Lest make manager_id field as nullable: image
  14. Lets add employees now:



We can see that Janet and Michael are added: image

Now we use Michael's id as highlighed in above screenshot to be as manager_id for filed of Elanor and Chiddi:



We can see the results as expected: image

  1. Lets create payroll entries:

Janet (using Janet’s id): image

Michael (using Michael’s id): image

Elanor (using Elanor’s id): image

Chiddi (using Chidd’s id): image

Now in payroll we can see all the entries: image

  1. Querying in graphiql we can see such data which says Michael is manager for Elanor and Chidi: image

  2. We can see employees for employees i.e., for Michael we can see he has employees as Elanor and Chidi: image

  3. We can see emoyees and salaries in payroll table: image

  4. Setting up permission for HR (insert* permission) and save that: image

  5. Now we clone the permission for select, update and delete as well by doing that: image

  6. We can see that HR now has all the permissions for insert, select, update and delete: image

  7. Now we set select permission for employees: image

  8. Now we set select permission for the employee who is actually a Manager: image

  9. Make same permission for update as well: image

  10. We change the name of payroll table to payrolls: image

  11. Lets make everyone to be able to select everything: image

  12. Lets clone select permission of Employees(i.e., same above permision) for HR and Managers as well (FYI: Do overwrite the permissions if asked): image

Now we can see that everyone can select: image

  1. Normally we pass roles in the request via jwt token like that..: image

BUT for now we are just gonna do it like this for demo (role=HR and id=Jane’s Id): image

and we see that HR can select the data.

also, if we put role=Manager and id=Michael’s Id we see that Michael can select data for Elanor and Chidi only: image

and Elanor can only select her own data only: image

and same for Chidi: image

Also we can see that employee can not mutate data bcoz we set that in permission roles that employees can only query data: image

And if we use Manager role instead we can see that Manage can mutate and insert data as well: image

Changing salary of Elanor by Manager: image

Lets see Elanor’s Salary (we can move to payroll table for any employee like that): image

and we can see it update correctly (we can use that button to close it though): image

Also, if we try to update Janet’s salary by using Manager role we see that its not allowed: image

  1. Using jwt token for real world scenario. We can use key as anything(using long random key is good though) and also provide type as well for correspoinding alog use to hash the jwt: image


Now we can see that we can query using our jwt token(yo!!): image