@supabase/phoenix 0.1.0

package/LICENSE.md

@@ -0,0 +1,22 @@
+# MIT License
+
+Copyright (c) 2014 Chris McCord
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,122 @@
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="./priv/static/phoenix-orange.png" />
+  <source media="(prefers-color-scheme: light)" srcset="./priv/static/phoenix.png" />
+  <img src="./priv/static/phoenix.png" alt="Phoenix logo" />
+</picture>
+
+> Peace of mind from prototype to production.
+
+[![Build Status](https://github.com/supabase/phoenix/workflows/CI/badge.svg)](https://github.com/supabase/phoenix/actions/workflows/ci.yml) [![npm version](https://img.shields.io/npm/v/@supabase/phoenix.svg)](https://www.npmjs.com/package/@supabase/phoenix)
+
+## Supabase Fork
+
+This is a Supabase fork of Phoenix Framework, published to npm as `@supabase/phoenix`.
+
+**Installation:**
+```bash
+npm install @supabase/phoenix
+```
+
+**Releases**: This fork uses automated releases via [release-please](https://github.com/googleapis/release-please). See [RELEASE.md](RELEASE.md) for details.
+
+**Upstream**: Based on [phoenixframework/phoenix](https://github.com/phoenixframework/phoenix)
+
+## Versioning
+
+This package uses **independent semantic versioning** for the JavaScript client.
+
+- **Current version**: 0.1.0
+- **Based on**: Phoenix Framework 1.8.3 JS client
+- **Last synced**: 2026-02-17
+
+We version based on **JS API changes only**, not upstream Phoenix framework releases.
+When we merge upstream Phoenix changes, we evaluate the JS API impact and version accordingly.
+
+## Getting started
+
+See the official site at <https://www.phoenixframework.org/>.
+
+Install the latest version of Phoenix by following the instructions at <https://hexdocs.pm/phoenix/installation.html#phoenix>.
+
+## Documentation
+
+API documentation is available at <https://hexdocs.pm/phoenix>.
+
+Phoenix.js documentation is available at <https://hexdocs.pm/phoenix/js>.
+
+## Contributing
+
+We appreciate any contribution to Phoenix. Check our [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) and [CONTRIBUTING.md](CONTRIBUTING.md) guides for more information. We usually keep a list of features and bugs in the [issue tracker][4].
+
+### Generating a Phoenix project from unreleased versions
+
+You can create a new project using the latest Phoenix source installer (the `phx.new` Mix task) with the following steps:
+
+1. Remove any previously installed `phx_new` archives so that Mix will pick up the local source code. This can be done with `mix archive.uninstall phx_new` or by simply deleting the file, which is usually in `~/.mix/archives/`.
+2. Copy this repo via `git clone https://github.com/phoenixframework/phoenix` or by downloading it
+3. Run the `phx.new` Mix task from within the `installer` directory, for example:
+
+```bash
+cd phoenix/installer
+mix phx.new dev_app --dev
+```
+
+The `--dev` flag will configure your new project's `:phoenix` dep as a relative path dependency, pointing to your local Phoenix checkout:
+
+```elixir
+defp deps do
+  [{:phoenix, path: "../..", override: true},
+```
+
+To create projects outside of the `installer/` directory, add the latest archive to your machine by following the instructions in [installer/README.md](https://github.com/phoenixframework/phoenix/blob/main/installer/README.md)
+
+### Building from source
+
+To build the documentation:
+
+```bash
+npm install
+MIX_ENV=docs mix docs
+```
+
+To build Phoenix:
+
+```bash
+mix deps.get
+mix compile
+```
+
+To build the Phoenix installer:
+
+```bash
+mix deps.get
+mix compile
+mix archive.build
+```
+
+To build Phoenix.js:
+
+```bash
+cd assets
+npm install
+```
+
+## Important links
+
+* [#elixir][1] on [Libera][2] IRC
+* [elixir-lang Slack channel][3]
+* [Issues tracker][4]
+* [Phoenix Forum (questions and proposals)][5]
+* Visit Phoenix's sponsor, DockYard, for expert [Phoenix Consulting](https://dockyard.com/phoenix-consulting)
+
+  [1]: https://web.libera.chat/?channels=#elixir
+  [2]: https://libera.chat/
+  [3]: https://elixir-lang.slack.com/
+  [4]: https://github.com/phoenixframework/phoenix/issues
+  [5]: https://elixirforum.com/c/phoenix-forum
+
+## Copyright and License
+
+Copyright (c) 2014, Chris McCord.
+
+Phoenix source code is licensed under the [MIT License](LICENSE.md).

package/assets/js/phoenix/ajax.js

@@ -0,0 +1,116 @@
+import {
+  global,
+  XHR_STATES
+} from "./constants"
+
+export default class Ajax {
+
+  static request(method, endPoint, headers, body, timeout, ontimeout, callback){
+    if(global.XDomainRequest){
+      let req = new global.XDomainRequest() // IE8, IE9
+      return this.xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback)
+    } else if(global.XMLHttpRequest){
+      let req = new global.XMLHttpRequest() // IE7+, Firefox, Chrome, Opera, Safari
+      return this.xhrRequest(req, method, endPoint, headers, body, timeout, ontimeout, callback)
+    } else if(global.fetch && global.AbortController){
+      // Fetch with AbortController for modern browsers
+      return this.fetchRequest(method, endPoint, headers, body, timeout, ontimeout, callback)
+    } else {
+      throw new Error("No suitable XMLHttpRequest implementation found")
+    }
+  }
+
+  static fetchRequest(method, endPoint, headers, body, timeout, ontimeout, callback){
+    let options = {
+      method,
+      headers,
+      body,
+    }
+    let controller = null
+    if(timeout){
+      controller = new AbortController()
+      const _timeoutId = setTimeout(() => controller.abort(), timeout)
+      options.signal = controller.signal
+    }
+    global.fetch(endPoint, options)
+      .then(response => response.text())
+      .then(data => this.parseJSON(data))
+      .then(data => callback && callback(data))
+      .catch(err => {
+        if(err.name === "AbortError" && ontimeout){
+          ontimeout()
+        } else {
+          callback && callback(null)
+        }
+      })
+    return controller
+  }
+
+  static xdomainRequest(req, method, endPoint, body, timeout, ontimeout, callback){
+    req.timeout = timeout
+    req.open(method, endPoint)
+    req.onload = () => {
+      let response = this.parseJSON(req.responseText)
+      callback && callback(response)
+    }
+    if(ontimeout){ req.ontimeout = ontimeout }
+
+    // Work around bug in IE9 that requires an attached onprogress handler
+    req.onprogress = () => { }
+
+    req.send(body)
+    return req
+  }
+
+  static xhrRequest(req, method, endPoint, headers, body, timeout, ontimeout, callback){
+    req.open(method, endPoint, true)
+    req.timeout = timeout
+    for(let [key, value] of Object.entries(headers)){
+      req.setRequestHeader(key, value)
+    }
+    req.onerror = () => callback && callback(null)
+    req.onreadystatechange = () => {
+      if(req.readyState === XHR_STATES.complete && callback){
+        let response = this.parseJSON(req.responseText)
+        callback(response)
+      }
+    }
+    if(ontimeout){ req.ontimeout = ontimeout }
+
+    req.send(body)
+    return req
+  }
+
+  static parseJSON(resp){
+    if(!resp || resp === ""){ return null }
+
+    try {
+      return JSON.parse(resp)
+    } catch {
+      console && console.log("failed to parse JSON response", resp)
+      return null
+    }
+  }
+
+  static serialize(obj, parentKey){
+    let queryStr = []
+    for(var key in obj){
+      if(!Object.prototype.hasOwnProperty.call(obj, key)){ continue }
+      let paramKey = parentKey ? `${parentKey}[${key}]` : key
+      let paramVal = obj[key]
+      if(typeof paramVal === "object"){
+        queryStr.push(this.serialize(paramVal, paramKey))
+      } else {
+        queryStr.push(encodeURIComponent(paramKey) + "=" + encodeURIComponent(paramVal))
+      }
+    }
+    return queryStr.join("&")
+  }
+
+  static appendParams(url, params){
+    if(Object.keys(params).length === 0){ return url }
+
+    let prefix = url.match(/\?/) ? "&" : "?"
+    return `${url}${prefix}${this.serialize(params)}`
+  }
+}

package/assets/js/phoenix/channel.js

@@ -0,0 +1,331 @@
+import {closure} from "./utils"
+import {
+  CHANNEL_EVENTS,
+  CHANNEL_STATES,
+} from "./constants"
+
+import Push from "./push"
+import Timer from "./timer"
+
+/**
+* @import Socket from "./socket"
+* @import { ChannelState, Params, ChannelBindingCallback, ChannelOnMessage, ChannelFilterBindings, ChannelOnErrorCallback, ChannelBinding } from "./types"
+*/
+
+export default class Channel {
+/**
+ * @param {string} topic
+ * @param {Params | (() => Params)} params
+ * @param {Socket} socket
+ */
+  constructor(topic, params, socket){
+    /** @type{ChannelState} */
+    this.state = CHANNEL_STATES.closed
+    /** @type{string} */
+    this.topic = topic
+    /** @type{() => Params} */
+    this.params = closure(params || {})
+    /** @type {Socket} */
+    this.socket = socket
+    /** @type{ChannelBinding[]} */
+    this.bindings = []
+    /** @type{number} */
+    this.bindingRef = 0
+    /** @type{number} */
+    this.timeout = this.socket.timeout
+    /** @type{boolean} */
+    this.joinedOnce = false
+    /** @type{Push} */
+    this.joinPush = new Push(this, CHANNEL_EVENTS.join, this.params, this.timeout)
+    /** @type{Push[]} */
+    this.pushBuffer = []
+    /** @type{string[]} */
+    this.stateChangeRefs = []
+
+    /** @type{Timer} */
+    this.rejoinTimer = new Timer(() => {
+      if(this.socket.isConnected()){ this.rejoin() }
+    }, this.socket.rejoinAfterMs)
+    this.stateChangeRefs.push(this.socket.onError(() => this.rejoinTimer.reset()))
+    this.stateChangeRefs.push(this.socket.onOpen(() => {
+      this.rejoinTimer.reset()
+      if(this.isErrored()){ this.rejoin() }
+    })
+    )
+    this.joinPush.receive("ok", () => {
+      this.state = CHANNEL_STATES.joined
+      this.rejoinTimer.reset()
+      this.pushBuffer.forEach(pushEvent => pushEvent.send())
+      this.pushBuffer = []
+    })
+    this.joinPush.receive("error", (reason) => {
+      this.state = CHANNEL_STATES.errored
+      if(this.socket.hasLogger()) this.socket.log("channel", `error ${this.topic}`, reason)
+      if(this.socket.isConnected()){ this.rejoinTimer.scheduleTimeout() }
+    })
+    this.onClose(() => {
+      this.rejoinTimer.reset()
+      if(this.socket.hasLogger()) this.socket.log("channel", `close ${this.topic}`)
+      this.state = CHANNEL_STATES.closed
+      this.socket.remove(this)
+    })
+    this.onError(reason => {
+      if(this.socket.hasLogger()) this.socket.log("channel", `error ${this.topic}`, reason)
+      if(this.isJoining()){ this.joinPush.reset() }
+      this.state = CHANNEL_STATES.errored
+      if(this.socket.isConnected()){ this.rejoinTimer.scheduleTimeout() }
+    })
+    this.joinPush.receive("timeout", () => {
+      if(this.socket.hasLogger()) this.socket.log("channel", `timeout ${this.topic}`, this.joinPush.timeout)
+      let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), this.timeout)
+      leavePush.send()
+      this.state = CHANNEL_STATES.errored
+      this.joinPush.reset()
+      if(this.socket.isConnected()){ this.rejoinTimer.scheduleTimeout() }
+    })
+    this.on(CHANNEL_EVENTS.reply, (payload, ref) => {
+      this.trigger(this.replyEventName(ref), payload)
+    })
+  }
+
+  /**
+   * Join the channel
+   * @param {number} timeout
+   * @returns {Push}
+   */
+  join(timeout = this.timeout){
+    if(this.joinedOnce){
+      throw new Error("tried to join multiple times. 'join' can only be called a single time per channel instance")
+    } else {
+      this.timeout = timeout
+      this.joinedOnce = true
+      this.rejoin()
+      return this.joinPush
+    }
+  }
+
+  /**
+   * Teardown the channel.
+   *
+   * Destroys and stops related timers.
+   */
+  teardown(){
+    this.pushBuffer.forEach((push) => push.destroy())
+    this.pushBuffer = []
+    this.rejoinTimer.reset()
+    this.joinPush.destroy()
+    this.state = CHANNEL_STATES.closed
+    this.bindings = {}
+  }
+
+  /**
+   * Hook into channel close
+   * @param {ChannelBindingCallback} callback
+   */
+  onClose(callback){
+    this.on(CHANNEL_EVENTS.close, callback)
+  }
+
+  /**
+   * Hook into channel errors
+   * @param {ChannelOnErrorCallback} callback
+   * @return {number}
+   */
+  onError(callback){
+    return this.on(CHANNEL_EVENTS.error, reason => callback(reason))
+  }
+
+  /**
+   * Subscribes on channel events
+   *
+   * Subscription returns a ref counter, which can be used later to
+   * unsubscribe the exact event listener
+   *
+   * @example
+   * const ref1 = channel.on("event", do_stuff)
+   * const ref2 = channel.on("event", do_other_stuff)
+   * channel.off("event", ref1)
+   * // Since unsubscription, do_stuff won't fire,
+   * // while do_other_stuff will keep firing on the "event"
+   *
+   * @param {string} event
+   * @param {ChannelBindingCallback} callback
+   * @returns {number} ref
+   */
+  on(event, callback){
+    let ref = this.bindingRef++
+    this.bindings.push({event, ref, callback})
+    return ref
+  }
+
+  /**
+   * Unsubscribes off of channel events
+   *
+   * Use the ref returned from a channel.on() to unsubscribe one
+   * handler, or pass nothing for the ref to unsubscribe all
+   * handlers for the given event.
+   *
+   * @example
+   * // Unsubscribe the do_stuff handler
+   * const ref1 = channel.on("event", do_stuff)
+   * channel.off("event", ref1)
+   *
+   * // Unsubscribe all handlers from event
+   * channel.off("event")
+   *
+   * @param {string} event
+   * @param {number} [ref]
+   */
+  off(event, ref){
+    this.bindings = this.bindings.filter((bind) => {
+      return !(bind.event === event && (typeof ref === "undefined" || ref === bind.ref))
+    })
+  }
+
+  /**
+   * @private
+   */
+  canPush(){ return this.socket.isConnected() && this.isJoined() }
+
+  /**
+   * Sends a message `event` to phoenix with the payload `payload`.
+   * Phoenix receives this in the `handle_in(event, payload, socket)`
+   * function. if phoenix replies or it times out (default 10000ms),
+   * then optionally the reply can be received.
+   *
+   * @example
+   * channel.push("event")
+   *   .receive("ok", payload => console.log("phoenix replied:", payload))
+   *   .receive("error", err => console.log("phoenix errored", err))
+   *   .receive("timeout", () => console.log("timed out pushing"))
+   * @param {string} event
+   * @param {Object} payload
+   * @param {number} [timeout]
+   * @returns {Push}
+   */
+  push(event, payload, timeout = this.timeout){
+    payload = payload || {}
+    if(!this.joinedOnce){
+      throw new Error(`tried to push '${event}' to '${this.topic}' before joining. Use channel.join() before pushing events`)
+    }
+    let pushEvent = new Push(this, event, function (){ return payload }, timeout)
+    if(this.canPush()){
+      pushEvent.send()
+    } else {
+      pushEvent.startTimeout()
+      this.pushBuffer.push(pushEvent)
+    }
+
+    return pushEvent
+  }
+
+  /** Leaves the channel
+   *
+   * Unsubscribes from server events, and
+   * instructs channel to terminate on server
+   *
+   * Triggers onClose() hooks
+   *
+   * To receive leave acknowledgements, use the `receive`
+   * hook to bind to the server ack, ie:
+   *
+   * @example
+   * channel.leave().receive("ok", () => alert("left!") )
+   *
+   * @param {number} timeout
+   * @returns {Push}
+   */
+  leave(timeout = this.timeout){
+    this.rejoinTimer.reset()
+    this.joinPush.cancelTimeout()
+
+    this.state = CHANNEL_STATES.leaving
+    let onClose = () => {
+      if(this.socket.hasLogger()) this.socket.log("channel", `leave ${this.topic}`)
+      this.trigger(CHANNEL_EVENTS.close, "leave")
+    }
+    let leavePush = new Push(this, CHANNEL_EVENTS.leave, closure({}), timeout)
+    leavePush.receive("ok", () => onClose())
+      .receive("timeout", () => onClose())
+    leavePush.send()
+    if(!this.canPush()){ leavePush.trigger("ok", {}) }
+
+    return leavePush
+  }
+
+  /**
+   * Overridable message hook
+   *
+   * Receives all events for specialized message handling
+   * before dispatching to the channel callbacks.
+   *
+   * Must return the payload, modified or unmodified
+   * @type{ChannelOnMessage}
+   */
+  onMessage(_event, payload, _ref){ return payload }
+
+  /**
+   * Overridable filter hook
+   *
+   * If this function returns `true`, `binding`'s callback will be called.
+   *
+   * @type{ChannelFilterBindings}
+   */
+  filterBindings(_binding, _payload, _ref){ return true }
+
+  isMember(topic, event, payload, joinRef){
+    if(this.topic !== topic){ return false }
+
+    if(joinRef && joinRef !== this.joinRef()){
+      if(this.socket.hasLogger()) this.socket.log("channel", "dropping outdated message", {topic, event, payload, joinRef})
+      return false
+    } else {
+      return true
+    }
+  }
+
+  joinRef(){ return this.joinPush.ref }
+
+  /**
+   * @private
+   */
+  rejoin(timeout = this.timeout){
+    if(this.isLeaving()){ return }
+    this.socket.leaveOpenTopic(this.topic)
+    this.state = CHANNEL_STATES.joining
+    this.joinPush.resend(timeout)
+  }
+
+  /**
+   * @param {string} event
+   * @param {unknown} [payload]
+   * @param {?string} [ref]
+   * @param {?string} [joinRef]
+   */
+  trigger(event, payload, ref, joinRef){
+    let handledPayload = this.onMessage(event, payload, ref, joinRef)
+    if(payload && !handledPayload){ throw new Error("channel onMessage callbacks must return the payload, modified or unmodified") }
+
+    let eventBindings = this.bindings.filter(bind => bind.event === event && this.filterBindings(bind, payload, ref))
+
+    for(let i = 0; i < eventBindings.length; i++){
+      let bind = eventBindings[i]
+      bind.callback(handledPayload, ref, joinRef || this.joinRef())
+    }
+  }
+
+  /**
+  * @param {string} ref
+  */
+  replyEventName(ref){ return `chan_reply_${ref}` }
+
+  isClosed(){ return this.state === CHANNEL_STATES.closed }
+
+  isErrored(){ return this.state === CHANNEL_STATES.errored }
+
+  isJoined(){ return this.state === CHANNEL_STATES.joined }
+
+  isJoining(){ return this.state === CHANNEL_STATES.joining }
+
+  isLeaving(){ return this.state === CHANNEL_STATES.leaving }
+}

package/assets/js/phoenix/constants.js

@@ -0,0 +1,35 @@
+export const globalSelf = typeof self !== "undefined" ? self : null
+export const phxWindow = typeof window !== "undefined" ? window : null
+export const global = globalSelf || phxWindow || globalThis
+export const DEFAULT_VSN = "2.0.0"
+export const DEFAULT_TIMEOUT = 10000
+export const WS_CLOSE_NORMAL = 1000
+
+export const SOCKET_STATES = /** @type {const} */ ({connecting: 0, open: 1, closing: 2, closed: 3})
+
+export const CHANNEL_STATES = /** @type {const} */ ({
+  closed: "closed",
+  errored: "errored",
+  joined: "joined",
+  joining: "joining",
+  leaving: "leaving",
+})
+
+export const CHANNEL_EVENTS = /** @type {const} */ ({
+  close: "phx_close",
+  error: "phx_error",
+  join: "phx_join",
+  reply: "phx_reply",
+  leave: "phx_leave"
+})
+
+export const TRANSPORTS = /** @type {const} */ ({
+  longpoll: "longpoll",
+  websocket: "websocket"
+})
+
+export const XHR_STATES = /** @type {const} */ ({
+  complete: 4
+})
+
+export const AUTH_TOKEN_PREFIX = "base64url.bearer.phx."