Skip to content

Instantly share code, notes, and snippets.

@withshubh
Last active January 11, 2022 20:01
Embed
What would you like to do?
Source code of the Explorer app to view and upload files to AWS S3 built using ToolJet. Tutorial: https://dev.to/tooljet/building-an-aws-s3-file-explorer-app-within-30-minutes-using-tooljet-22hp
{
"id":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"name":"Explorer",
"slug":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"isPublic":false,
"organizationId":"89c0ae92-4172-48ff-b610-f3d07305fe6e",
"currentVersionId":"13dc76e5-3ce1-4263-aa1b-abcee1feea58",
"userId":"6c935ec7-f5a5-4ccf-87ea-a74efaebbb2d",
"createdAt":"2021-12-20T06:25:21.441Z",
"updatedAt":"2021-12-20T06:25:34.393Z",
"dataQueries":[
{
"id":"a7b388ea-6685-4996-9a8e-2e82f15c8375",
"name":"s32",
"kind":"s3",
"options":{
"operation":"list_objects",
"bucket":"{{components.dropdown1.value}}"
},
"dataSourceId":"2dd5300c-4fd0-4889-a78e-564c566985da",
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.439Z",
"updatedAt":"2021-12-20T06:25:21.439Z"
},
{
"id":"c20ffa06-233e-4f94-af75-06ccdce537f8",
"name":"getBuckets",
"kind":"s3",
"options":{
"operation":"list_buckets",
"runOnPageLoad":true
},
"dataSourceId":"2dd5300c-4fd0-4889-a78e-564c566985da",
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.439Z",
"updatedAt":"2021-12-20T06:25:21.439Z"
},
{
"id":"110d929c-10d1-4c9b-a03a-f6b5b2ddb841",
"name":"uploadToS3",
"kind":"s3",
"options":{
"operation":"upload_object",
"bucket":"{{components.dropdown1.value}}",
"key":"{{ components.textinput1.value + '/'+ components.filepicker1.file[0].name}}",
"contentType":"{{components.filepicker1.file[0].type}}",
"data":"{{components.filepicker1.file[0].content}}"
},
"dataSourceId":"2dd5300c-4fd0-4889-a78e-564c566985da",
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.439Z",
"updatedAt":"2021-12-20T06:25:21.439Z"
}
],
"dataSources":[
{
"id":"f2b3b287-6a70-463d-8518-87b414693686",
"name":"Google Sheets",
"kind":"googlesheets",
"options":{
"access_type":{
"value":"write",
"encrypted":false
},
"access_token":{
"credential_id":"74a82bab-67ad-4f41-aa96-c3d398c44abe",
"encrypted":true
},
"refresh_token":{
"credential_id":"de7e81a9-71c1-4442-9ed4-1b7509a62019",
"encrypted":true
}
},
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.594Z",
"updatedAt":"2021-12-20T06:25:21.594Z"
},
{
"id":"2dd5300c-4fd0-4889-a78e-564c566985da",
"name":"AWS S3",
"kind":"s3",
"options":{
"access_key":{
"value":"AKIA2WXNMZ4ZXSZWUXEN",
"encrypted":false
},
"secret_key":{
"credential_id":"48c2c9ce-9c18-47fd-8af9-3b5b670cc73b",
"encrypted":true
},
"region":{
"value":"us-west-1",
"encrypted":false
}
},
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.645Z",
"updatedAt":"2021-12-21T11:37:08.410Z"
}
],
"appVersions":[
{
"id":"13dc76e5-3ce1-4263-aa1b-abcee1feea58",
"name":"vv",
"definition":{
"components":{
"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76":{
"component":{
"name":"container1",
"displayName":"Container",
"description":"Wrapper for multiple components",
"defaultSize":{
"width":5,
"height":200
},
"component":"Container",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
},
"events":{
},
"styles":{
"backgroundColor":{
"type":"color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"backgroundColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":240,
"left":65.19008199496903,
"width":13,
"height":400
}
}
},
"d63d574c-2a8e-45ab-8ed1-ca89bc39e82e":{
"component":{
"name":"filepicker1",
"displayName":"File Picker",
"description":"File Picker",
"component":"FilePicker",
"defaultSize":{
"width":15,
"height":100
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"enableDropzone":{
"type":"code",
"displayName":"Use Drop zone"
},
"enablePicker":{
"type":"code",
"displayName":"Use File Picker"
},
"enableMultiple":{
"type":"code",
"displayName":"Pick mulitple files"
},
"maxFileCount":{
"type":"code",
"displayName":"Max file count"
},
"fileType":{
"type":"code",
"displayName":"Accept file types"
},
"maxSize":{
"type":"code",
"displayName":"Max size limit (Bytes)"
},
"minSize":{
"type":"code",
"displayName":"Min size limit (Bytes)"
}
},
"events":{
"onFileSelected":{
"displayName":"On File Selected"
}
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"file":[
{
"name":"",
"content":"",
"dataURL":"",
"type":""
}
]
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"enableDropzone":{
"value":"{{true}}"
},
"enablePicker":{
"value":"{{true}}"
},
"maxFileCount":{
"value":"{{2}}"
},
"enableMultiple":{
"value":"{{false}}"
},
"fileType":{
"value":"{{\"image/*\"}}"
},
"maxSize":{
"value":"{{1048576}}"
},
"minSize":{
"value":"{{50}}"
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":150,
"left":9.34398675651941,
"width":34.97955599171898,
"height":100
}
}
},
"536f4cd1-cee5-40ad-ac92-853dfc8063bc":{
"component":{
"name":"button1",
"displayName":"Button",
"description":"Trigger actions: queries, alerts etc",
"component":"Button",
"defaultSize":{
"width":3,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Button Text"
},
"loadingState":{
"type":"code",
"displayName":"Loading State"
}
},
"events":{
"onClick":{
"displayName":"On click"
}
},
"styles":{
"backgroundColor":{
"type":"color",
"displayName":"Background color"
},
"textColor":{
"type":"color",
"displayName":"Text color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
},
"borderRadius":{
"type":"code",
"displayName":"Border radius"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"Upload file to S3"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.uploadToS3.isLoading}}"
}
},
"events":[
{
"eventId":"onClick",
"actionId":"run-query",
"message":"Hello world!",
"queryId":"110d929c-10d1-4c9b-a03a-f6b5b2ddb841",
"queryName":"uploadToS3"
},
{
"eventId":"onClick",
"actionId":"show-alert",
"message":"Upload successful!",
"alertType":"success"
}
],
"styles":{
"backgroundColor":{
"value":"#e06b0d"
},
"textColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"borderRadius":{
"value":"{{4}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":280,
"left":9.580436573905246,
"width":35.05641720157016,
"height":40
}
}
},
"cad8920d-0601-4fbf-9cbc-722c113ff958":{
"component":{
"name":"text1",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<h3>Upload file to S3</h3>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":30,
"left":9.344006549217138,
"width":19.05196193333655,
"height":30
}
}
},
"cf13ab02-5e51-481d-8653-f2e15285fa8a":{
"component":{
"name":"table1",
"displayName":"Table",
"description":"Display paginated tabular data",
"component":"Table",
"properties":{
"title":{
"type":"string",
"displayName":"Title"
},
"data":{
"type":"code",
"displayName":"Table data"
},
"loadingState":{
"type":"code",
"displayName":"Loading state"
},
"columns":{
"type":"array",
"displayName":"Table Columns"
},
"serverSidePagination":{
"type":"toggle",
"displayName":"Server-side pagination"
},
"clientSidePagination":{
"type":"toggle",
"displayName":"Client-side pagination"
},
"serverSideSearch":{
"type":"toggle",
"displayName":"Server-side search"
},
"actionButtonBackgroundColor":{
"type":"color",
"displayName":"Background color"
},
"actionButtonTextColor":{
"type":"color",
"displayName":"Text color"
},
"displaySearchBox":{
"type":"toggle",
"displayName":"Show search box"
},
"showDownloadButton":{
"type":"toggle",
"displayName":"Show download button"
},
"showFilterButton":{
"type":"toggle",
"displayName":"Show filter button"
},
"showBulkUpdateActions":{
"type":"toggle",
"displayName":"Show bulk update actions"
},
"showBulkSelector":{
"type":"toggle",
"displayName":"Bulk selection"
},
"highlightSelectedRow":{
"type":"toggle",
"displayName":"Highlight selected row"
}
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop "
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"defaultSize":{
"width":20,
"height":300
},
"events":{
"onRowClicked":{
"displayName":"Row clicked"
},
"onBulkUpdate":{
"displayName":"Bulk update"
},
"onPageChanged":{
"displayName":"Page changed"
},
"onSearch":{
"displayName":"Search"
}
},
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"tableType":{
"type":"select",
"displayName":"Table type",
"options":[
{
"name":"Bordered",
"value":""
},
{
"name":"Borderless",
"value":"table-borderless"
},
{
"name":"Classic",
"value":"table-classic"
},
{
"name":"Striped",
"value":"table-striped"
},
{
"name":"Striped & bordered",
"value":"table-striped table-bordered"
}
]
},
"cellSize":{
"type":"select",
"displayName":"Cell size",
"options":[
{
"name":"Compact",
"value":"compact"
},
{
"name":"Spacious",
"value":"spacious"
}
]
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"selectedRow":{
},
"changeSet":{
},
"dataUpdates":[
],
"pageIndex":0,
"searchText":"",
"selectedRows":[
]
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"title":{
"value":"Table"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.s32.isLoading}}"
},
"data":{
"value":"{{queries.s32.data['Contents']}}"
},
"serverSidePagination":{
"value":false
},
"clientSidePagination":{
"value":false
},
"displaySearchBox":{
"value":false
},
"showDownloadButton":{
"value":false
},
"showFilterButton":{
"value":false
},
"columns":{
"value":[
{
"name":"key",
"id":"e3ecbf7fa52c4d7210a93edb8f43776267a489bad52bd108be9588f790126737",
"key":"Key"
},
{
"name":"last modified",
"id":"5d2a3744a006388aadd012fcc15cc0dbcb5f9130e0fbb64c558561c97118754a",
"key":"LastModified"
},
{
"name":"size",
"id":"afc9a5091750a1bd4760e38760de3b4be11a43452ae8ae07ce2eebc569fe9a7f",
"key":"Size"
}
]
},
"showBulkUpdateActions":{
"value":true
},
"showBulkSelector":{
"value":false
},
"highlightSelectedRow":{
"value":false
},
"serverSideSearch":{
"value":false
},
"columnSizes":{
"5d2a3744a006388aadd012fcc15cc0dbcb5f9130e0fbb64c558561c97118754a":201,
"leftActions":162
},
"actions":{
"value":[
{
"name":"Action0",
"buttonText":"copy signed URL",
"events":[
],
"position":"left",
"backgroundColor":"#faf9f9",
"textColor":"#272727"
}
]
}
},
"events":[
],
"styles":{
"textColor":{
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
},
"cellSize":{
"value":"compact"
},
"tableType":{
"value":""
}
}
}
},
"layouts":{
"desktop":{
"top":240,
"left":2.3255811756240323,
"width":26,
"height":670
}
}
},
"e7d58e12-2c34-4663-821c-2fb33d30e71a":{
"component":{
"name":"dropdown1",
"displayName":"Dropdown",
"description":"Select one value from options",
"defaultSize":{
"width":8,
"height":30
},
"component":"DropDown",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"validation":{
"customRule":{
"type":"code",
"displayName":"Custom validation"
}
},
"properties":{
"label":{
"type":"code",
"displayName":"Label"
},
"value":{
"type":"code",
"displayName":"Default value"
},
"values":{
"type":"code",
"displayName":"Option values"
},
"display_values":{
"type":"code",
"displayName":"Option labels"
}
},
"events":{
"onSelect":{
"displayName":"On select"
}
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"value":null
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"validation":{
"customRule":{
"value":null
}
},
"properties":{
"label":{
"value":"Bucket:"
},
"value":{
"value":"{{2}}"
},
"values":{
"value":"{{queries.getBuckets.data.Buckets.map(bucket => bucket['Name'])}}"
},
"display_values":{
"value":"{{queries.getBuckets.data.Buckets.map(bucket => bucket['Name'])}}"
},
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":170,
"left":2.341778876242623,
"width":17,
"height":40
}
}
},
"7e2c5534-5a1a-4d90-b1af-667952a04755":{
"component":{
"name":"textinput1",
"displayName":"Text Input",
"description":"Text field for forms",
"component":"TextInput",
"defaultSize":{
"width":4,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"value":{
"type":"code",
"displayName":"Default value"
},
"placeholder":{
"type":"code",
"displayName":"Placeholder"
}
},
"validation":{
"regex":{
"type":"code",
"displayName":"Regex"
},
"minLength":{
"type":"code",
"displayName":"Min length"
},
"maxLength":{
"type":"code",
"displayName":"Max length"
},
"customRule":{
"type":"code",
"displayName":"Custom validation"
}
},
"events":{
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"value":""
},
"definition":{
"validation":{
"regex":{
"value":""
},
"minLength":{
"value":null
},
"maxLength":{
"value":null
},
"customRule":{
"value":null
}
},
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"value":{
"value":""
},
"placeholder":{
"value":"File path"
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":90,
"left":9.434434057096905,
"width":34.98612205975829,
"height":40
}
}
},
"0073f17a-9ae3-4ad3-89fe-581cabd24384":{
"component":{
"name":"button2",
"displayName":"Button",
"description":"Trigger actions: queries, alerts etc",
"component":"Button",
"defaultSize":{
"width":3,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Button Text"
},
"loadingState":{
"type":"code",
"displayName":"Loading State"
}
},
"events":{
"onClick":{
"displayName":"On click"
}
},
"styles":{
"backgroundColor":{
"type":"color",
"displayName":"Background color"
},
"textColor":{
"type":"color",
"displayName":"Text color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
},
"borderRadius":{
"type":"code",
"displayName":"Border radius"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"Fetch files"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.s32.isLoading}}"
}
},
"events":[
{
"eventId":"onClick",
"actionId":"run-query",
"message":"Hello world!",
"queryId":"a7b388ea-6685-4996-9a8e-2e82f15c8375",
"queryName":"s32"
}
],
"styles":{
"backgroundColor":{
"value":"#e06b0d"
},
"textColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"borderRadius":{
"value":"{{4}}"
},
"disabledState":{
"value":"{{components.dropdown1.value === ''}}"
}
}
}
},
"layouts":{
"desktop":{
"top":170,
"left":44.15724432505321,
"width":8,
"height":40
}
}
},
"aa4a680c-1068-405b-9a05-af1ab7314fc1":{
"component":{
"name":"container2",
"displayName":"Container",
"description":"Wrapper for multiple components",
"defaultSize":{
"width":5,
"height":200
},
"component":"Container",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
},
"events":{
},
"styles":{
"backgroundColor":{
"type":"color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"backgroundColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":0,
"left":0,
"width":43,
"height":70
}
}
},
"c45ff2f5-9453-4caf-bb54-b9f182dc1d8e":{
"component":{
"name":"text3",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<h2>AWS S3 File Explorer</h2>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"aa4a680c-1068-405b-9a05-af1ab7314fc1",
"layouts":{
"desktop":{
"top":20,
"left":2.3255811756240323,
"width":6.976744186046512,
"height":30
}
}
},
"4e742594-3b7c-4665-8b0e-5fc75ecb10cc":{
"component":{
"name":"text3",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<a href=\"\">source code</a>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":20,
"left":88.36129486745357,
"width":4,
"height":30
}
}
}
},
"globalSettings":{
"hideHeader":true,
"canvasMaxWidth":1292,
"canvasBackgroundColor":"#f3f3f3"
}
},
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.701Z",
"updatedAt":"2021-12-20T12:32:01.340Z"
}
],
"editingVersion":{
"id":"13dc76e5-3ce1-4263-aa1b-abcee1feea58",
"name":"vv",
"definition":{
"components":{
"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76":{
"component":{
"name":"container1",
"displayName":"Container",
"description":"Wrapper for multiple components",
"defaultSize":{
"width":5,
"height":200
},
"component":"Container",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
},
"events":{
},
"styles":{
"backgroundColor":{
"type":"color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"backgroundColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":240,
"left":65.19008199496903,
"width":13,
"height":400
}
}
},
"d63d574c-2a8e-45ab-8ed1-ca89bc39e82e":{
"component":{
"name":"filepicker1",
"displayName":"File Picker",
"description":"File Picker",
"component":"FilePicker",
"defaultSize":{
"width":15,
"height":100
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"enableDropzone":{
"type":"code",
"displayName":"Use Drop zone"
},
"enablePicker":{
"type":"code",
"displayName":"Use File Picker"
},
"enableMultiple":{
"type":"code",
"displayName":"Pick mulitple files"
},
"maxFileCount":{
"type":"code",
"displayName":"Max file count"
},
"fileType":{
"type":"code",
"displayName":"Accept file types"
},
"maxSize":{
"type":"code",
"displayName":"Max size limit (Bytes)"
},
"minSize":{
"type":"code",
"displayName":"Min size limit (Bytes)"
}
},
"events":{
"onFileSelected":{
"displayName":"On File Selected"
}
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"file":[
{
"name":"",
"content":"",
"dataURL":"",
"type":""
}
]
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"enableDropzone":{
"value":"{{true}}"
},
"enablePicker":{
"value":"{{true}}"
},
"maxFileCount":{
"value":"{{2}}"
},
"enableMultiple":{
"value":"{{false}}"
},
"fileType":{
"value":"{{\"image/*\"}}"
},
"maxSize":{
"value":"{{1048576}}"
},
"minSize":{
"value":"{{50}}"
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":150,
"left":9.34398675651941,
"width":34.97955599171898,
"height":100
}
}
},
"536f4cd1-cee5-40ad-ac92-853dfc8063bc":{
"component":{
"name":"button1",
"displayName":"Button",
"description":"Trigger actions: queries, alerts etc",
"component":"Button",
"defaultSize":{
"width":3,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Button Text"
},
"loadingState":{
"type":"code",
"displayName":"Loading State"
}
},
"events":{
"onClick":{
"displayName":"On click"
}
},
"styles":{
"backgroundColor":{
"type":"color",
"displayName":"Background color"
},
"textColor":{
"type":"color",
"displayName":"Text color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
},
"borderRadius":{
"type":"code",
"displayName":"Border radius"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"Upload file to S3"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.uploadToS3.isLoading}}"
}
},
"events":[
{
"eventId":"onClick",
"actionId":"run-query",
"message":"Hello world!",
"queryId":"110d929c-10d1-4c9b-a03a-f6b5b2ddb841",
"queryName":"uploadToS3"
},
{
"eventId":"onClick",
"actionId":"show-alert",
"message":"Upload successful!",
"alertType":"success"
}
],
"styles":{
"backgroundColor":{
"value":"#e06b0d"
},
"textColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"borderRadius":{
"value":"{{4}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":280,
"left":9.580436573905246,
"width":35.05641720157016,
"height":40
}
}
},
"cad8920d-0601-4fbf-9cbc-722c113ff958":{
"component":{
"name":"text1",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<h3>Upload file to S3</h3>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":30,
"left":9.344006549217138,
"width":19.05196193333655,
"height":30
}
}
},
"cf13ab02-5e51-481d-8653-f2e15285fa8a":{
"component":{
"name":"table1",
"displayName":"Table",
"description":"Display paginated tabular data",
"component":"Table",
"properties":{
"title":{
"type":"string",
"displayName":"Title"
},
"data":{
"type":"code",
"displayName":"Table data"
},
"loadingState":{
"type":"code",
"displayName":"Loading state"
},
"columns":{
"type":"array",
"displayName":"Table Columns"
},
"serverSidePagination":{
"type":"toggle",
"displayName":"Server-side pagination"
},
"clientSidePagination":{
"type":"toggle",
"displayName":"Client-side pagination"
},
"serverSideSearch":{
"type":"toggle",
"displayName":"Server-side search"
},
"actionButtonBackgroundColor":{
"type":"color",
"displayName":"Background color"
},
"actionButtonTextColor":{
"type":"color",
"displayName":"Text color"
},
"displaySearchBox":{
"type":"toggle",
"displayName":"Show search box"
},
"showDownloadButton":{
"type":"toggle",
"displayName":"Show download button"
},
"showFilterButton":{
"type":"toggle",
"displayName":"Show filter button"
},
"showBulkUpdateActions":{
"type":"toggle",
"displayName":"Show bulk update actions"
},
"showBulkSelector":{
"type":"toggle",
"displayName":"Bulk selection"
},
"highlightSelectedRow":{
"type":"toggle",
"displayName":"Highlight selected row"
}
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop "
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"defaultSize":{
"width":20,
"height":300
},
"events":{
"onRowClicked":{
"displayName":"Row clicked"
},
"onBulkUpdate":{
"displayName":"Bulk update"
},
"onPageChanged":{
"displayName":"Page changed"
},
"onSearch":{
"displayName":"Search"
}
},
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"tableType":{
"type":"select",
"displayName":"Table type",
"options":[
{
"name":"Bordered",
"value":""
},
{
"name":"Borderless",
"value":"table-borderless"
},
{
"name":"Classic",
"value":"table-classic"
},
{
"name":"Striped",
"value":"table-striped"
},
{
"name":"Striped & bordered",
"value":"table-striped table-bordered"
}
]
},
"cellSize":{
"type":"select",
"displayName":"Cell size",
"options":[
{
"name":"Compact",
"value":"compact"
},
{
"name":"Spacious",
"value":"spacious"
}
]
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"selectedRow":{
},
"changeSet":{
},
"dataUpdates":[
],
"pageIndex":0,
"searchText":"",
"selectedRows":[
]
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"title":{
"value":"Table"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.s32.isLoading}}"
},
"data":{
"value":"{{queries.s32.data['Contents']}}"
},
"serverSidePagination":{
"value":false
},
"clientSidePagination":{
"value":false
},
"displaySearchBox":{
"value":false
},
"showDownloadButton":{
"value":false
},
"showFilterButton":{
"value":false
},
"columns":{
"value":[
{
"name":"key",
"id":"e3ecbf7fa52c4d7210a93edb8f43776267a489bad52bd108be9588f790126737",
"key":"Key"
},
{
"name":"last modified",
"id":"5d2a3744a006388aadd012fcc15cc0dbcb5f9130e0fbb64c558561c97118754a",
"key":"LastModified"
},
{
"name":"size",
"id":"afc9a5091750a1bd4760e38760de3b4be11a43452ae8ae07ce2eebc569fe9a7f",
"key":"Size"
}
]
},
"showBulkUpdateActions":{
"value":true
},
"showBulkSelector":{
"value":false
},
"highlightSelectedRow":{
"value":false
},
"serverSideSearch":{
"value":false
},
"columnSizes":{
"5d2a3744a006388aadd012fcc15cc0dbcb5f9130e0fbb64c558561c97118754a":201,
"leftActions":162
},
"actions":{
"value":[
{
"name":"Action0",
"buttonText":"copy signed URL",
"events":[
],
"position":"left",
"backgroundColor":"#faf9f9",
"textColor":"#272727"
}
]
}
},
"events":[
],
"styles":{
"textColor":{
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
},
"cellSize":{
"value":"compact"
},
"tableType":{
"value":""
}
}
}
},
"layouts":{
"desktop":{
"top":240,
"left":2.3255811756240323,
"width":26,
"height":670
}
}
},
"e7d58e12-2c34-4663-821c-2fb33d30e71a":{
"component":{
"name":"dropdown1",
"displayName":"Dropdown",
"description":"Select one value from options",
"defaultSize":{
"width":8,
"height":30
},
"component":"DropDown",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"validation":{
"customRule":{
"type":"code",
"displayName":"Custom validation"
}
},
"properties":{
"label":{
"type":"code",
"displayName":"Label"
},
"value":{
"type":"code",
"displayName":"Default value"
},
"values":{
"type":"code",
"displayName":"Option values"
},
"display_values":{
"type":"code",
"displayName":"Option labels"
}
},
"events":{
"onSelect":{
"displayName":"On select"
}
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"value":null
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"validation":{
"customRule":{
"value":null
}
},
"properties":{
"label":{
"value":"Bucket:"
},
"value":{
"value":"{{2}}"
},
"values":{
"value":"{{queries.getBuckets.data.Buckets.map(bucket => bucket['Name'])}}"
},
"display_values":{
"value":"{{queries.getBuckets.data.Buckets.map(bucket => bucket['Name'])}}"
},
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":170,
"left":2.341778876242623,
"width":17,
"height":40
}
}
},
"7e2c5534-5a1a-4d90-b1af-667952a04755":{
"component":{
"name":"textinput1",
"displayName":"Text Input",
"description":"Text field for forms",
"component":"TextInput",
"defaultSize":{
"width":4,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"value":{
"type":"code",
"displayName":"Default value"
},
"placeholder":{
"type":"code",
"displayName":"Placeholder"
}
},
"validation":{
"regex":{
"type":"code",
"displayName":"Regex"
},
"minLength":{
"type":"code",
"displayName":"Min length"
},
"maxLength":{
"type":"code",
"displayName":"Max length"
},
"customRule":{
"type":"code",
"displayName":"Custom validation"
}
},
"events":{
},
"styles":{
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
"value":""
},
"definition":{
"validation":{
"regex":{
"value":""
},
"minLength":{
"value":null
},
"maxLength":{
"value":null
},
"customRule":{
"value":null
}
},
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"value":{
"value":""
},
"placeholder":{
"value":"File path"
}
},
"events":[
],
"styles":{
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"77009e8c-d8bb-4ab6-9ca4-a4ab41db7b76",
"layouts":{
"desktop":{
"top":90,
"left":9.434434057096905,
"width":34.98612205975829,
"height":40
}
}
},
"0073f17a-9ae3-4ad3-89fe-581cabd24384":{
"component":{
"name":"button2",
"displayName":"Button",
"description":"Trigger actions: queries, alerts etc",
"component":"Button",
"defaultSize":{
"width":3,
"height":30
},
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Button Text"
},
"loadingState":{
"type":"code",
"displayName":"Loading State"
}
},
"events":{
"onClick":{
"displayName":"On click"
}
},
"styles":{
"backgroundColor":{
"type":"color",
"displayName":"Background color"
},
"textColor":{
"type":"color",
"displayName":"Text color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
},
"borderRadius":{
"type":"code",
"displayName":"Border radius"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"Fetch files"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{queries.s32.isLoading}}"
}
},
"events":[
{
"eventId":"onClick",
"actionId":"run-query",
"message":"Hello world!",
"queryId":"a7b388ea-6685-4996-9a8e-2e82f15c8375",
"queryName":"s32"
}
],
"styles":{
"backgroundColor":{
"value":"#e06b0d"
},
"textColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"borderRadius":{
"value":"{{4}}"
},
"disabledState":{
"value":"{{components.dropdown1.value === ''}}"
}
}
}
},
"layouts":{
"desktop":{
"top":170,
"left":44.15724432505321,
"width":8,
"height":40
}
}
},
"aa4a680c-1068-405b-9a05-af1ab7314fc1":{
"component":{
"name":"container2",
"displayName":"Container",
"description":"Wrapper for multiple components",
"defaultSize":{
"width":5,
"height":200
},
"component":"Container",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
},
"events":{
},
"styles":{
"backgroundColor":{
"type":"color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"visible":{
"value":true
}
},
"events":[
],
"styles":{
"backgroundColor":{
"value":"#fff"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":0,
"left":0,
"width":43,
"height":70
}
}
},
"c45ff2f5-9453-4caf-bb54-b9f182dc1d8e":{
"component":{
"name":"text3",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<h2>AWS S3 File Explorer</h2>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"parent":"aa4a680c-1068-405b-9a05-af1ab7314fc1",
"layouts":{
"desktop":{
"top":20,
"left":2.3255811756240323,
"width":6.976744186046512,
"height":30
}
}
},
"4e742594-3b7c-4665-8b0e-5fc75ecb10cc":{
"component":{
"name":"text3",
"displayName":"Text",
"description":"Display markdown or HTML",
"component":"Text",
"others":{
"showOnDesktop":{
"type":"toggle",
"displayName":"Show on desktop"
},
"showOnMobile":{
"type":"toggle",
"displayName":"Show on mobile"
}
},
"properties":{
"text":{
"type":"code",
"displayName":"Text"
},
"loadingState":{
"type":"code",
"displayName":"Show loading state"
}
},
"defaultSize":{
"width":3,
"height":30
},
"events":[
],
"styles":{
"textColor":{
"type":"color",
"displayName":"Text Color"
},
"visibility":{
"type":"code",
"displayName":"Visibility"
},
"disabledState":{
"type":"code",
"displayName":"Disable"
}
},
"exposedVariables":{
},
"definition":{
"others":{
"showOnDesktop":{
"value":true
},
"showOnMobile":{
"value":false
}
},
"properties":{
"text":{
"value":"<a href=\"\">source code</a>"
},
"visible":{
"value":true
},
"loadingState":{
"value":"{{false}}"
}
},
"events":[
],
"styles":{
"textColor":{
"value":"#000"
},
"visibility":{
"value":"{{true}}"
},
"disabledState":{
"value":"{{false}}"
}
}
}
},
"layouts":{
"desktop":{
"top":20,
"left":88.36129486745357,
"width":4,
"height":30
}
}
}
},
"globalSettings":{
"hideHeader":true,
"canvasMaxWidth":1292,
"canvasBackgroundColor":"#f3f3f3"
}
},
"appId":"6c28033c-cf7a-4337-9487-3d1f2a1851b2",
"createdAt":"2021-12-20T06:25:21.701Z",
"updatedAt":"2021-12-20T12:32:01.340Z"
},
"tooljetVersion":"0.10.0"
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment