Created
December 8, 2022 16:46
-
-
Save kwhinnery/50c267ca58634dc2c80979500b34ce27 to your computer and use it in GitHub Desktop.
Example app for 12 Days of Retool day 3!
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {"uuid":"095e511a-7703-11ed-aa54-7b1e6d7a8632","page":{"id":112160021,"data":{"appState":"[\"~#iR\",[\"^ \",\"n\",\"appTemplate\",\"v\",[\"^ \",\"isFetching\",false,\"plugins\",[\"~#iOM\",[\"$main\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"$main\",\"type\",\"frame\",\"subtype\",\"Frame\",\"namespace\",null,\"resourceName\",null,\"resourceDisplayName\",null,\"template\",[\"^3\",[\"type\",\"main\",\"sticky\",false]],\"style\",[\"^3\",[]],\"position2\",null,\"mobilePosition2\",null,\"mobileAppPosition\",null,\"tabIndex\",null,\"container\",\"\",\"createdAt\",\"~m1670509044651\",\"updatedAt\",\"~m1670509044651\",\"folder\",\"\",\"screen\",null]]],\"$header\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"$header\",\"^4\",\"frame\",\"^5\",\"Frame\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"type\",\"header\",\"sticky\",true,\"isHiddenOnDesktop\",false,\"isHiddenOnMobile\",true]],\"^:\",[\"^3\",[]],\"^;\",null,\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670509047733\",\"^A\",\"~m1670509047733\",\"^B\",\"\",\"^C\",null]]],\"circularImage1\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"circularImage1\",\"^4\",\"widget\",\"^5\",\"ImageWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"fixed\",\"horizontalAlign\",\"center\",\"srcWidth\",null,\"clickable\",false,\"src\",\"https://retool.com/blog/content/images/2022/12/threereindeer.png\",\"hidden\",false,\"srcHeight\",null,\"showInEditor\",false,\"tooltipText\",\"\",\"fit\",\"contain\",\"style\",[\"^3\",[\"borderRadius\",\"50%\"]],\"aspectRatio\",1,\"storageBlobId\",\"\",\"altText\",\"\",\"dbBlobId\",\"\",\"events\",[\"^3\",[]],\"srcType\",\"src\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"rowGroup\",\"body\",\"subcontainer\",\"header\",\"row\",0,\"col\",0,\"height\",2,\"width\",1,\"tabNum\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670509469741\",\"^A\",\"~m1670509481975\",\"^B\",\"\",\"^C\",null]]],\"text1\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"text1\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"fixed\",\"horizontalAlign\",\"left\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"center\",\"tooltipText\",\"\",\"value\",\"# JavaScript Equality Tester\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"header\",\"row\",0.2,\"col\",1,\"^F\",1.5999999999999999,\"^G\",6,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670509486598\",\"^A\",\"~m1670509503621\",\"^B\",\"\",\"^C\",null]]],\"firstOperand\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"firstOperand\",\"^4\",\"widget\",\"^5\",\"TextInputWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"spellCheck\",false,\"readOnly\",false,\"iconAfter\",\"\",\"showCharacterCount\",false,\"autoComplete\",false,\"maxLength\",null,\"hidden\",false,\"customValidation\",\"\",\"patternType\",\"\",\"hideValidationMessage\",false,\"textBefore\",\"\",\"validationMessage\",\"\",\"textAfter\",\"\",\"showInEditor\",false,\"showClear\",false,\"pattern\",\"\",\"tooltipText\",\"\",\"labelAlign\",\"left\",\"formDataKey\",\"{{ self.id }}\",\"value\",\"\",\"labelCaption\",\"\",\"hideLabel\",true,\"labelWidth\",\"33\",\"autoFill\",\"\",\"placeholder\",\"Enter a valid JSON value\",\"label\",\"First Operand\",\"_validate\",false,\"labelWidthUnit\",\"%\",\"invalid\",false,\"iconBefore\",\"\",\"minLength\",null,\"inputTooltip\",\"\",\"events\",[\"~#iL\",[[\"^3\",[\"event\",\"change\",\"type\",\"script\",\"method\",\"run\",\"pluginId\",\"\",\"targetId\",null,\"params\",[\"^3\",[\"src\",\"const currentValue = firstOperand.value;\\n\\n// Helper to update app and UI state\\nfunction updateValue(valid, newObjectValue, errorMessage) {\\n firstValue.setValue({\\n valid,\\n objectValue: newObjectValue,\\n });\\n firstOperandValidationText.setValue(`<i style=\\\"color:red\\\">${errorMessage || ''}</i>`);\\n}\\n\\n// Blank value is valid and will be processed as an empty string\\nif (!currentValue || currentValue === '') {\\n return updateValue(true, '');\\n}\\n\\n// Try to parse as a JSON object\\ntry {\\n const newValue = JSON.parse(currentValue);\\n return updateValue(true, newValue);\\n} catch(e) {\\n return updateValue(false, null, 'Invalid JSON object');\\n}\\n\"]],\"waitType\",\"debounce\",\"waitMs\",\"0\"]]]],\"autoCapitalize\",\"none\",\"loading\",false,\"disabled\",false,\"labelPosition\",\"top\",\"labelWrap\",false,\"maintainSpaceWhenHidden\",false,\"required\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",0.6,\"col\",0,\"^F\",1,\"^G\",4,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670510378613\",\"^A\",\"~m1670513338799\",\"^B\",\"\",\"^C\",null]]],\"secondOperand\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"secondOperand\",\"^4\",\"widget\",\"^5\",\"TextInputWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"spellCheck\",false,\"readOnly\",false,\"iconAfter\",\"\",\"showCharacterCount\",false,\"autoComplete\",false,\"maxLength\",null,\"hidden\",false,\"customValidation\",\"\",\"patternType\",\"\",\"hideValidationMessage\",false,\"textBefore\",\"\",\"validationMessage\",\"\",\"textAfter\",\"\",\"showInEditor\",false,\"showClear\",false,\"pattern\",\"\",\"tooltipText\",\"\",\"labelAlign\",\"left\",\"formDataKey\",\"{{ self.id }}\",\"value\",\"\",\"labelCaption\",\"\",\"hideLabel\",true,\"labelWidth\",\"33\",\"autoFill\",\"\",\"placeholder\",\"Enter a valid JSON value\",\"label\",\"Second Operand\",\"_validate\",false,\"labelWidthUnit\",\"%\",\"invalid\",false,\"iconBefore\",\"\",\"minLength\",null,\"inputTooltip\",\"\",\"events\",[\"^I\",[[\"^3\",[\"event\",\"change\",\"type\",\"script\",\"method\",\"run\",\"pluginId\",\"\",\"targetId\",null,\"params\",[\"^3\",[\"src\",\"const currentValue = secondOperand.value;\\n\\n// Helper to update app and UI state\\nfunction updateValue(valid, newObjectValue, errorMessage) {\\n secondValue.setValue({\\n valid,\\n objectValue: newObjectValue,\\n });\\n secondOperandValidationText.setValue(`<i style=\\\"color:red\\\">${errorMessage || ''}</i>`);\\n}\\n\\n// Blank value is valid and will be processed as an empty string\\nif (!currentValue || currentValue === '') {\\n return updateValue(true, '');\\n}\\n\\n// Try to parse as a JSON object\\ntry {\\n const newValue = JSON.parse(currentValue);\\n return updateValue(true, newValue);\\n} catch(e) {\\n return updateValue(false, null, 'Invalid JSON object');\\n}\\n\"]],\"waitType\",\"debounce\",\"waitMs\",\"0\"]]]],\"autoCapitalize\",\"none\",\"loading\",false,\"disabled\",false,\"labelPosition\",\"top\",\"labelWrap\",false,\"maintainSpaceWhenHidden\",false,\"required\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",2.1999999999999997,\"col\",0,\"^F\",1,\"^G\",4,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670510419093\",\"^A\",\"~m1670513666164\",\"^B\",\"\",\"^C\",null]]],\"text2\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"text2\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"auto\",\"horizontalAlign\",\"left\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"top\",\"tooltipText\",\"\",\"value\",\"#### Equality (==) Result:\\n{{ equalityValueTransformer.value }}\\n\\n#### Strict Equality (===) Result:\\n{{ strictEqualityValueTransformer.value }}\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",5.551115123125783e-17,\"col\",4,\"^F\",0.6000000000000001,\"^G\",4,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670510461017\",\"^A\",\"~m1670514695532\",\"^B\",\"\",\"^C\",null]]],\"text3\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"text3\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"auto\",\"horizontalAlign\",\"left\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"center\",\"tooltipText\",\"\",\"value\",\"**First Operand:**\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",0,\"col\",0,\"^F\",0.6,\"^G\",2,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670511793294\",\"^A\",\"~m1670511807328\",\"^B\",\"\",\"^C\",null]]],\"text4\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"text4\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"auto\",\"horizontalAlign\",\"left\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"center\",\"tooltipText\",\"\",\"value\",\"**Second Operand:**\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",1.6,\"col\",0,\"^F\",0.6,\"^G\",2,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670511812324\",\"^A\",\"~m1670511838536\",\"^B\",\"\",\"^C\",null]]],\"secondOperandValidationText\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"secondOperandValidationText\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"auto\",\"horizontalAlign\",\"right\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"center\",\"tooltipText\",\"\",\"value\",\"\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",1.5999999999999999,\"col\",2,\"^F\",0.6,\"^G\",2,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670511844153\",\"^A\",\"~m1670512730247\",\"^B\",\"\",\"^C\",null]]],\"firstOperandValidationText\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"firstOperandValidationText\",\"^4\",\"widget\",\"^5\",\"TextWidget2\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"heightType\",\"auto\",\"horizontalAlign\",\"right\",\"hidden\",false,\"imageWidth\",\"fit\",\"showInEditor\",false,\"verticalAlign\",\"center\",\"tooltipText\",\"\",\"value\",\"\",\"disableMarkdown\",false,\"overflowType\",\"scroll\",\"maintainSpaceWhenHidden\",false]],\"^:\",[\"^3\",[]],\"^;\",[\"^0\",[\"^ \",\"n\",\"position2\",\"v\",[\"^ \",\"^?\",\"\",\"^D\",\"body\",\"^E\",\"\",\"row\",0,\"col\",2,\"^F\",0.6,\"^G\",2,\"^H\",0]]],\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670512038880\",\"^A\",\"~m1670512727042\",\"^B\",\"\",\"^C\",null]]],\"firstValue\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"firstValue\",\"^4\",\"state\",\"^5\",\"State\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"_persistedValueGetter\",null,\"_persistedValueSetter\",null,\"persistValue\",false,\"persistedValueKey\",\"\",\"value\",\"{ valid: true, objectValue: '' }\"]],\"^:\",null,\"^;\",null,\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670512510628\",\"^A\",\"~m1670512920656\",\"^B\",\"\",\"^C\",null]]],\"secondValue\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"secondValue\",\"^4\",\"state\",\"^5\",\"State\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"_persistedValueGetter\",null,\"_persistedValueSetter\",null,\"persistValue\",false,\"persistedValueKey\",\"\",\"value\",\"{ valid: true, objectValue: '' }\"]],\"^:\",null,\"^;\",null,\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670512520940\",\"^A\",\"~m1670512928843\",\"^B\",\"\",\"^C\",null]]],\"equalityValueTransformer\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"equalityValueTransformer\",\"^4\",\"function\",\"^5\",\"Function\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"funcBody\",\"const first = {{ firstValue.value }};\\nconst second = {{ secondValue.value }};\\n\\nif (first.valid && second.valid) {\\n // Conduct the equality test\\n const validDisplay = (first.objectValue == second.objectValue) ? '<b style=\\\"color:green\\\">TRUE</b>' : '<b style=\\\"color:red\\\">FALSE</b>';\\n return `<code>${JSON.stringify(first.objectValue)} == ${JSON.stringify(second.objectValue)}</code> evaluates to ${validDisplay}`;\\n} else {\\n return '<i style=\\\"color:red\\\">Please enter valid JSON values on the left</i>';\\n}\",\"value\",\"\"]],\"^:\",null,\"^;\",null,\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670513769212\",\"^A\",\"~m1670515549599\",\"^B\",\"\",\"^C\",null]]],\"strictEqualityValueTransformer\",[\"^0\",[\"^ \",\"n\",\"pluginTemplate\",\"v\",[\"^ \",\"id\",\"strictEqualityValueTransformer\",\"^4\",\"function\",\"^5\",\"Function\",\"^6\",null,\"^7\",null,\"^8\",null,\"^9\",[\"^3\",[\"funcBody\",\"const first = {{ firstValue.value }};\\nconst second = {{ secondValue.value }};\\n\\nif (first.valid && second.valid) {\\n // Conduct the strict equality test\\n const validDisplay = (first.objectValue === second.objectValue) ? '<b style=\\\"color:green\\\">TRUE</b>' : '<b style=\\\"color:red\\\">FALSE</b>';\\n return `<code>${JSON.stringify(first.objectValue)} === ${JSON.stringify(second.objectValue)}</code> evaluates to ${validDisplay}`;\\n} else {\\n return '<i style=\\\"color:red\\\">Please enter valid JSON values on the left</i>';\\n}\",\"value\",\"\"]],\"^:\",null,\"^;\",null,\"^<\",null,\"^=\",null,\"^>\",null,\"^?\",\"\",\"^@\",\"~m1670513938844\",\"^A\",\"~m1670515567749\",\"^B\",\"\",\"^C\",null]]]]],\"^@\",null,\"version\",\"2.105.0\",\"appThemeId\",null,\"preloadedAppJavaScript\",null,\"preloadedAppJSLinks\",[],\"testEntities\",[],\"tests\",[],\"appStyles\",\"\",\"responsiveLayoutDisabled\",false,\"loadingIndicatorsDisabled\",false,\"urlFragmentDefinitions\",[\"^I\",[]],\"pageLoadValueOverrides\",[\"^I\",[]],\"customDocumentTitle\",\"\",\"customDocumentTitleEnabled\",false,\"customShortcuts\",[],\"isGlobalWidget\",false,\"isMobileApp\",false,\"multiScreenMobileApp\",false,\"mobileAppSettings\",[\"^ \",\"mobileOfflineModeEnabled\",false],\"folders\",[\"^I\",[]],\"queryStatusVisibility\",false,\"markdownLinkBehavior\",\"auto\",\"inAppRetoolPillAppearance\",\"NO_OVERRIDE\",\"rootScreen\",null,\"instrumentationEnabled\",false,\"experimentalPerfFeatures\",[\"^ \",\"serverDepGraphEnabled\",false,\"useRuntimeV2\",false],\"experimentalStabilityFeatures\",[\"^ \",\"lockModelForUpdates\",false],\"experimentalDataTabEnabled\",true]]]"},"changesRecord":[{"type":"WIDGET_TEMPLATE_UPDATE","payload":{"plugin":{"id":"strictEqualityValueTransformer","type":"function","folder":"","subtype":"Function","template":{"value":"","funcBody":"const first = {{ firstValue.value }};\nconst second = {{ secondValue.value }};\n\nif (first.valid && second.valid) {\n // Conduct the strict equality test\n const validDisplay = (first.objectValue === second.objectValue) ? '<b style=\"color:green\">TRUE</b>' : '<b style=\"color:red\">FALSE</b>';\n return `${JSON.stringify(first.objectValue)} === ${JSON.stringify(second.objectValue)} evaluates to ${validDisplay}`;\n} else {\n return '<i style=\"color:red\">Please enter valid JSON values on the left</i>';\n}"},"container":"","createdAt":"2022-12-08T15:38:58.844Z","updatedAt":"2022-12-08T15:50:03.489Z"},"update":{"funcBody":"const first = {{ firstValue.value }};\nconst second = {{ secondValue.value }};\n\nif (first.valid && second.valid) {\n // Conduct the strict equality test\n const validDisplay = (first.objectValue === second.objectValue) ? '<b style=\"color:green\">TRUE</b>' : '<b style=\"color:red\">FALSE</b>';\n return `<code>${JSON.stringify(first.objectValue)} === ${JSON.stringify(second.objectValue)}</code> evaluates to ${validDisplay}`;\n} else {\n return '<i style=\"color:red\">Please enter valid JSON values on the left</i>';\n}"},"widgetId":"strictEqualityValueTransformer","shouldRecalculateTemplate":true},"isUserTriggered":true}],"gitSha":null,"checksum":null,"createdAt":"2022-12-08T16:06:07.990Z","updatedAt":"2022-12-08T16:06:07.990Z","pageId":1651787,"userId":348139,"branchId":null},"modules":{}} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment