View 1_hooks.ts
This file contains 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
export const SpaceLayoutEditor = { | |
// Not important for the integration, just something for my specific use case | |
recentItems: [], | |
mounted() { | |
// IMPORTANT LINE: LiveView -> React data flow | |
this.handleEvent("react.update_items", ({ items }: { items: string }) => { | |
const newItems: SpaceItem[] = JSON.parse(items) | |
this.mountEditor(newItems) | |
}) |
View 1_hooks.ts
This file contains 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
export const SpaceLayoutEditor = { | |
mounted() { | |
// I use webpack chunks to reduce LiveView entry file size | |
import(/* webpackChunkName: "space-layout-editor-lv" */ '../entry/space-layout-editor-lv').then((mounter) => { | |
this.unmountComponent = mounter.default(this.el.id, { | |
editorOpts: this.editorOpts() | |
}) | |
}).catch(console.error) | |
}, |
View hook-example.js
This file contains 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
/** | |
* This example is just copy/pasted from my code base. The gist of it is that `this.pushEventTo` on the hook | |
* will send an event over the LiveView channel that is processed by the component/LiveView that's mounted at | |
* that element. | |
* | |
* I recommend using pushEventTo instead of pushEvent because I've run into situations where the event gets sent | |
* to the incorrect component or LiveView. | |
*/ | |
const GeneratePDFButton = { | |
mounted() { |
View notion.ex
This file contains 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
defmodule Clove.Connections.Client.Notion do | |
# There is not a way to filter last_edited_time, so consumer should check if it needs to fetch the blocks or not | |
# This will help for deletion detection, though | |
def retrieve_pages(connection) do | |
request = %{ | |
method: :post, | |
url: "#{base_url()}/v1/search", | |
params: %{ | |
"query" => "", | |
"sort" => %{ |
View header.html
This file contains 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
<script type="text/javascript"> | |
if (window.top !== window.self) { | |
document.body.classList.add('in-iframe') | |
} | |
</script> |
View chartkick.ex
This file contains 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
defmodule Chartkick do | |
@moduledoc """ | |
Adapted from https://github.com/buren/chartkick-ex/blob/master/lib/chartkick.ex to work with LiveView. | |
Works in conjunction with Phoenix LiveView hooks to render charts using Chartkick.js library. | |
""" | |
require EEx | |
gen_chart_fn = fn chart_type -> |
View sso.json
This file contains 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
{ | |
"user": { | |
"id": "(Required) String: The ID of the user logging into Clove", | |
"email": "String: The email address of the user", | |
"name": "String: Full name of the user", | |
"given_name": "String: First name of the user", | |
"family_name": "String: Last name of the user", | |
"custom_data": "Map: Arbitrary data container for your application", | |
"organization": { | |
"id": "(Required if organization key present) String: The ID of the organization this user belongs to", |
View embed.html
This file contains 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
<!-- Note: un-minified source code available at clove-embed.js --> | |
<script type="text/javascript" src="https://public-cdn.cloveapp.io/clove-embed.min.js"></script> | |
<script type="text/javascript"> | |
CloveEmbed.installFrameListener() | |
CloveEmbed.setFrameUrl("https://yourhub.example.com") | |
</script> |
View head.html
This file contains 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
<script type="text/javascript"> | |
if (window.top !== window.self) { | |
const msg = { | |
urlChange: { | |
pathname: window.location.pathname, | |
search: window.location.search, | |
href: window.location.href | |
} | |
} | |
window.top.postMessage(msg, '*') |
View intercom.html
This file contains 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
{% if user %} | |
<script> | |
window.intercomSettings = { | |
app_id: "YOUR_APP_ID", | |
user_id: "{{ user.id }}", | |
email: "{{ user.email }}", | |
user_hash: "{{ user.id | encrypt: "hmac", "YOUR_IDENTITY_VERIFICATION_SECRET" }}" | |
}; | |
</script> | |
{% else %} |
NewerOlder