Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@onflow/util-template

Package Overview
Dependencies
Maintainers
16
Versions
26
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@onflow/util-template

Template Literal used for Cadence Interop

  • 1.0.4
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
16K
increased by36.84%
Maintainers
16
Weekly downloads
 
Created
Source

template

Utility to help with string interop in SDK and FCL

Usage

import {templar} from "onflow/template"

const template = templar`
From: ${o => o.from}
To: ${o => o.to}
Message: ${o => o.msg}
`

const letter = template({
  from: "Bob the Builder",
  to: "Postman Pat",
  msg: "Please pick up your black and white cat.",
})

// prettier-ignore
assert( letter, `
From: Bob the Builder
To: Postman Pat
Message: Please pick up your black and white cat.
`)
import {templar} from "@onflow/template"

const template1 = templar`
a: ${o => o.a}
b: ${o => o.b}
`

const template2 = templar`
x: ${o => o.x}
y: ${o => o.y}
`

const template3 = templar`
${template1}
${template2}
oh hello!
${template1}
${template2}
`

const rawr = template3({a: "A", b: "B", x: "X", y: "Y"})

// prettier-ignore
assert(rawr, `
a: A
b: B
x: X
y: Y
oh hello!
a: A
b: B
x: X
y: Y
`)

Examples

Role your own graphql libary

// gql.js
import {templar} from "@onflow/template"

export const gql = templar

export const gqlr = (...args) => (opts = {}) => {
  const params = opts.params || {}
  const headers = opts.headers || {}
  const endpoint = opts.endpoint || ""

  return fetch(endpoint, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      ...headers,
    },
    body: JSON.stringify({
      query: gql(...args)(params),
    }),
  }).then(d => d.json())
}

// somewhere-else.js
import React, {useEffect, useState} from "react"
import {gqlr, gql} from "./gql"

const USER = gql`
  fragment USER on User {
    username
  }
`

const query = gqlr`
  query {
    me { ...USER }
  }
  ${USER}
`

export const Username = () => {
  const [username, setUsername] = useState(null)

  useEffect(() => {
    query({
      endpoint: "http://...",
      headers: {authorization: "bearer ..."},
    }).then(response => setUsername(response.data.me.username))
  }, [])

  return username == null ? null : username
}

Role your own pipeline thing?

const pipe = (fns = []) => token => {
  return fns.reduce((token, fn) => fn(token), token)
}

const param = (key, value) => token => {
  token.params = token.parms || {}
  token.params[key] = value
  return token
}

const script = (...args) => token => {
  token.type = "script"
  token.value = templar(...args)(token.params)
  return token
}

const query = (...args) => token => {
  token.type = "query"
  token.value = templar(...args)(token.parms)
  return token
}

const desc = (...args) => token => {
  token.description = templar(...args)(token.params)
  return token
}

const rawr = pipe([
  param("msg", "woot woot im a boot"),
  script`
    pub fun main() {
      log("msg: ${o => o.msg}")
    }
  `,
  desc`
    the message: ${o => o.msg}
  `,
])

assert(rawr, {
  params: {
    msg: "woot woot im a boot",
  },
  type: "script",
  code: `
    pub fun main() {
      log("msg: woot woot im a boot")
    }
  `,
  descrition: `
    the message: woot woot im a boot
  `,
})

FAQs

Package last updated on 04 Oct 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc