{"app":{"id":9,"summary":"Supabase Authentication Example - frontend scripts version","versions":[23,24,27,28,29,31,33,43],"created_by":"adam186","created_at":"2023-03-16T12:50:11.430Z","votes":0,"approved":true,"apps":["supabase"],"app_type":"openapp","external_embed_url":null,"value":{"css":{},"grid":[{"3":{"h":8,"w":2,"x":0,"y":0,"fixed":false},"12":{"h":13,"w":12,"x":0,"y":0,"id":"a","fixed":false},"id":"a","data":{"id":"a","tabs":["Login","Data"],"type":"tabscomponent","customCss":{},"configuration":{"tabsKind":{"type":"static","value":"invisibleOnView"}},"numberOfSubgrids":2}}],"subgrids":{"a-0":[{"3":{"h":1,"w":1,"x":0,"y":2,"fixed":false},"12":{"h":1,"w":4,"x":4,"y":0,"id":"d","fixed":false},"id":"d","data":{"id":"d","type":"textcomponent","customCss":{},"configuration":{"style":{"type":"static","value":"Label"},"tooltip":{"type":"static","value":""},"copyButton":{"type":"static","value":false}},"componentInput":{"eval":"Email","type":"template","value":"Hello ${ctx.username}","fieldType":"template"},"verticalAlignment":"bottom","horizontalAlignment":"left"}},{"3":{"h":1,"w":2,"x":0,"y":0,"fixed":false},"12":{"h":1,"w":4,"x":4,"y":1,"id":"b","fixed":false},"id":"b","data":{"id":"b","type":"emailinputcomponent","customCss":{},"configuration":{"placeholder":{"type":"static","value":"Email"},"defaultValue":{"type":"static"}},"verticalAlignment":"center"}},{"3":{"h":1,"w":1,"x":1,"y":2,"fixed":false},"12":{"h":1,"w":4,"x":4,"y":2,"id":"d","fixed":false},"id":"e","data":{"id":"e","type":"textcomponent","customCss":{},"configuration":{"style":{"type":"static","value":"Label"},"tooltip":{"type":"static","value":""},"copyButton":{"type":"static","value":false}},"componentInput":{"eval":"Password","type":"template","value":"Hello ${ctx.username}","fieldType":"template"},"verticalAlignment":"bottom","horizontalAlignment":"left"}},{"3":{"h":1,"w":2,"x":0,"y":1,"fixed":false},"12":{"h":1,"w":4,"x":4,"y":3,"id":"c","fixed":false},"id":"c","data":{"id":"c","type":"passwordinputcomponent","customCss":{},"configuration":{"placeholder":{"type":"static","value":"Password"}},"verticalAlignment":"center"}},{"3":{"h":1,"w":1,"x":0,"y":3,"fixed":false},"12":{"h":2,"w":4,"x":4,"y":4,"id":"f","fixed":false},"id":"f","data":{"id":"f","type":"buttoncomponent","customCss":{},"recomputeIds":["bg_1","bg_0"],"configuration":{"size":{"type":"static","value":"sm"},"color":{"type":"static","value":"dark"},"label":{"type":"static","value":"Login"},"disabled":{"expr":"false","type":"eval"},"afterIcon":{"type":"static"},"onSuccess":{"type":"oneOf","selected":"none","configuration":{"none":{},"setTab":{"setTab":{"type":"static","value":[]}},"gotoUrl":{"url":{"type":"static","value":""},"newTab":{"type":"static","value":true}},"sendToast":{"message":{"type":"static","value":""}}}},"beforeIcon":{"type":"static"},"fillContainer":{"type":"static","value":false},"triggerOnAppLoad":{"type":"static","value":false}},"componentInput":{"type":"runnable","fields":{},"runnable":{"name":"Login","type":"runnableByName","inlineScript":{"path":"/Login","content":"state.supabase = {\n\t// You'll need to insert the URL and the public API key of your Supabase project here\n\turl: '',\n\tpublicKey: '',\n\tclient: state?.supabase?.client ?? undefined,\n\terror: undefined\n};\n\nconst sb = await import('https://esm.sh/@supabase/supabase-js@2.10.0');\nconst client = sb.createClient(state.supabase.url, state.supabase.publicKey);\nconst { data, error, error_description } = await client.auth.signInWithPassword({\n  // In frontend scripts you can directly reference components by their IDs\n  email: b.result,\n  password: c.result\n});\nif (data?.session?.access_token) {\n  state.supabase.client = sb.createClient(state.supabase.url, state.supabase.publicKey, {\n    global: { headers: { Authorization: `bearer ${data.session.access_token}` } }\n  });\n} else {\n  state.supabase.client = undefined;\n  state.supabase.error = error_description ?? error?.message ?? error ?? undefined;\n}","language":"frontend"}},"fieldType":"any","recomputeOnInputChanged":true},"verticalAlignment":"center","horizontalAlignment":"right"}},{"3":{"h":1,"w":1,"x":1,"y":3,"fixed":false},"12":{"h":5,"w":4,"x":4,"y":6,"id":"i","fixed":false},"id":"i","data":{"id":"i","type":"textcomponent","customCss":{"text":{"class":"text-red-500","style":""}},"configuration":{"style":{"type":"static","value":"Body"},"tooltip":{"type":"static","value":""},"copyButton":{"type":"static","value":false}},"componentInput":{"eval":"${state?.supabase?.error ?? ' '}","type":"template","value":"Hello ${ctx.username}","fieldType":"template"},"verticalAlignment":"top","horizontalAlignment":"center"}}],"a-1":[{"3":{"h":10,"w":3,"x":0,"y":1,"fixed":false},"12":{"h":11,"w":12,"x":0,"y":0,"id":"h","fixed":false},"id":"h","data":{"id":"h","type":"tablecomponent","customCss":{},"actionButtons":[],"configuration":{"search":{"type":"static","value":"Disabled"},"pagination":{"type":"oneOf","selected":"auto","configuration":{"auto":{"pageSize":{"type":"static","value":20}},"manual":{"pageCount":{"type":"static","value":-1}}}}},"componentInput":{"type":"connected","value":[{"id":1,"age":42,"name":"A cell with a long name"},{"id":2,"age":84,"name":"A briefer cell"}],"fieldType":"array","connection":{"path":"data","componentId":"state"},"subFieldType":"object"}}}]},"fullscreen":false,"hiddenInlineScripts":[{"name":"Load data","fields":{},"autoRefresh":false,"inlineScript":{"path":"/Load data","content":"if (!state.supabase.error) {\n\ttry {\n\t\tconst { data, error, error_description } = await state.supabase.client\n\t\t\t.from('my_table')\n\t\t\t.select();\n\t\tconst err = error_description ?? error ?? undefined;\n\t\tif (err) {\n\t\t\tthrow Error(err);\n\t\t}\n\t\tstate.data = data;\n\t\tsetTab('a', 1);\n\t} catch (err) {\n\t\tstate.supabase.error = err;\n\t\tstate.data = [];\n\t}\n} else {\n\tstate.data = [];\n}","language":"frontend"},"recomputeOnInputChanged":true,"doNotRecomputeOnInputChanged":false}],"unusedInlineScripts":[]},"description":"Example app (with frontend scripts) of how to use Supabase Authentication to query RLS enabled data.\n\nYou can read more about this example [**here**](https://docs.windmill.dev/blog/supabase-authentication-and-rls-protected-tables-on-windmill).\n\n**Usage:**\n\nUpdate the `Login` script with your Supabase instance **URL** and **public anon key**.","vcreated_at":"2023-04-10T10:59:13.210Z","vcreated_by":"adam186","comments":[]}}