Forum Academy Marketplace Showcase Pricing Features

Send JSON to plugin

I am working with the google calendar API. when you get events, you only get a color code. you have to make a second api to get the color code dictionary.

i am trying to spit the dictionary into a plugin along with the event color codes to spit back out the hex values. so 2 lists in, one list out. 1 list is a list of numbers. no problemo there. the other is a JSON response from an authenticated API call. i need most of the body. this would be easy if there was a list but the data comes like this

{
  "kind": "calendar#colors",
  "updated": "2012-02-14T00:00:00.000Z",
  "calendar": {
      "1": {
          "background": "#ac725e",
          "foreground": "#1d1d1d"
      },
      "2": {
          "background": "#d06b64",
          "foreground": "#1d1d1d"
      },
      "3": {
          "background": "#f83a22",
          "foreground": "#1d1d1d"
      },
      "4": {
          "background": "#fa573c",
          "foreground": "#1d1d1d"
      },
      "5": {
          "background": "#ff7537",
          "foreground": "#1d1d1d"
      },
      "6": {
          "background": "#ffad46",
          "foreground": "#1d1d1d"
      },
      "7": {
          "background": "#42d692",
          "foreground": "#1d1d1d"
      },
      "8": {
          "background": "#16a765",
          "foreground": "#1d1d1d"
      },
      "9": {
          "background": "#7bd148",
          "foreground": "#1d1d1d"
      },
      "10": {
          "background": "#b3dc6c",
          "foreground": "#1d1d1d"
      },
      "11": {
          "background": "#fbe983",
          "foreground": "#1d1d1d"
      },
      "12": {
          "background": "#fad165",
          "foreground": "#1d1d1d"
      },
      "13": {
          "background": "#92e1c0",
          "foreground": "#1d1d1d"
      },
      "14": {
          "background": "#9fe1e7",
          "foreground": "#1d1d1d"
      },
      "15": {
          "background": "#9fc6e7",
          "foreground": "#1d1d1d"
      },
      "16": {
          "background": "#4986e7",
          "foreground": "#1d1d1d"
      },
      "17": {
          "background": "#9a9cff",
          "foreground": "#1d1d1d"
      },
      "18": {
          "background": "#b99aff",
          "foreground": "#1d1d1d"
      },
      "19": {
          "background": "#c2c2c2",
          "foreground": "#1d1d1d"
      },
      "20": {
          "background": "#cabdbf",
          "foreground": "#1d1d1d"
      },
      "21": {
          "background": "#cca6ac",
          "foreground": "#1d1d1d"
      },
      "22": {
          "background": "#f691b2",
          "foreground": "#1d1d1d"
      },
      "23": {
          "background": "#cd74e6",
          "foreground": "#1d1d1d"
      },
      "24": {
          "background": "#a47ae2",
          "foreground": "#1d1d1d"
      }
  },
  "event": {
      "1": {
          "background": "#a4bdfc",
          "foreground": "#1d1d1d"
      },
      "2": {
          "background": "#7ae7bf",
          "foreground": "#1d1d1d"
      },
      "3": {
          "background": "#dbadff",
          "foreground": "#1d1d1d"
      },
      "4": {
          "background": "#ff887c",
          "foreground": "#1d1d1d"
      },
      "5": {
          "background": "#fbd75b",
          "foreground": "#1d1d1d"
      },
      "6": {
          "background": "#ffb878",
          "foreground": "#1d1d1d"
      },
      "7": {
          "background": "#46d6db",
          "foreground": "#1d1d1d"
      },
      "8": {
          "background": "#e1e1e1",
          "foreground": "#1d1d1d"
      },
      "9": {
          "background": "#5484ed",
          "foreground": "#1d1d1d"
      },
      "10": {
          "background": "#51b749",
          "foreground": "#1d1d1d"
      },
      "11": {
          "background": "#dc2127",
          "foreground": "#1d1d1d"
      }
  }
}

and i access the values in the editor like this

i am trying to send the entire JSON body to the editor so i can work with it in JS but cant figure out how to even print the JSON to the console.

any thoughts here?

The bubble api connector (as well as the plug-in API) will output only parsed data based on fixed template, which is auto-created when initializing the call.

If you want to work with the raw JSON response, I’d take a look at either (a) custom plug-in using the server side action or (b) toolbox plug-in (server-side action). This launches a Node instance where you can fetch data from your api, work on it and send the data to the page. Obviously, Not as easy, but flexible.

1 Like

Yeah… I figured that part out and got frustrated but thought about it and found a solution. I’ll share when it’s ready but it may only be a fringe case solution. We’ll see! Imma make it work client side tho!

1 Like

@jared.gibb
How did you resolved that?

Which issue are you referring to?

@jared.gibb
sending nested json to plugin.

What’s the trouble? Sending the Json or using it once it’s in the plugin? Shouldn’t be any issue getting the code in.

Care to share what you’ve tried and are you dealing with the same Json?

@jared.gibb
Well currently i’m dealing with two hurdels.
I have RG which has data souce of API call result(which is list of JSON objects). First i call the API then store that result in the same data type custom state.

On page load i call the API and then set result into state.

Now onclick of “Add” button want to append the content to same custom state. Here is the actual issue.
On click of button i need to create a json object (with 6 fields)which i want to append the same custom state which is data source of RG.
How can i achieve that? How to perform type conversion or anything to make it working?